基于Vite构建工具,用Strve.js开发一个简版TodoList(真香!)

开发 项目管理
我们今天就做一个简版的TodoList,项目虽小,但是五脏俱全。包含了对文本的增删改,非常值得上手。

发布Strve已经有三个月了,今天就给大家做一个小项目。看一看这个小框架到底好不好用。

我们今天就做一个简版的TodoList,项目虽小,但是五脏俱全。包含了对文本的增删改,非常值得上手。

开发项目之前,我需要打开官方文档,查阅Strve项目构建工具Create Strve App是怎么使用的。操作(具体操作大家可以根据文档)一番后,我们会看到下面这些。

文件目录是不是觉得特别清爽,然后又是基于Vite搭建的,所以开发体验也是不错的。Strve底层是全面拥抱Es Modules,使用Vite搭建项目是不二之选。

下面,我们要实现一款简版的TodoList应用。它是一个单页面应用,所以我们仅需要在一个JS文件中开发,HTML与JS可以在一起写,从另一种角度上跟JSX思想差不多。逻辑代码如下图所示,大家可以参照一下,另外,我在项目中使用了CSS Modules。虽然,现在只有一个页面。

我们会看到逻辑区域与显示区域都很一目了然,我们仅仅去关心数据,操作数据就可以了。相比于JQ那种命令式API,拿来DOM就是干的方式,这种声明式API就非常优雅高效。

我们接下来就是发布部署了,下面是打包之后的文件目录。

然后,我们发布到云端,并且进行测试跑分。居然,可以跑到99分,其实我有信心可以跑到100分的( )。

这篇文章很简短,大体介绍了Strve开发一个小项目的流程。

责任编辑:姜华 来源: 前端历劫之路
相关推荐

2023-06-15 06:57:06

Strve.jsVite

2022-02-21 06:02:49

Strve.jsCodepenReact

2021-12-23 06:07:21

前端技术编程

2021-05-31 17:37:26

ViteReactesbuild

2021-11-29 00:17:41

JS符串转换

2021-06-18 06:11:26

工具WebpackSnowpack

2020-09-07 14:40:20

Vue.js构建工具前端

2022-11-14 00:14:49

2015-04-01 14:40:26

Java构建工具build.xml

2013-01-31 10:15:28

JavaScriptGrunt

2022-04-18 11:13:34

前端开发工具

2023-07-22 06:55:00

JS框架Strve

2021-05-25 16:34:06

JavaScript前端

2022-08-26 13:56:30

模块JavaScript

2023-08-22 10:13:53

模块工具JavaScrip

2023-03-15 23:59:13

前端构建工具

2022-05-16 09:14:28

前端构建工具

2022-10-20 11:49:49

JS动画帧,CSS

2021-02-23 09:50:42

PythonJSWeb SSH

2021-11-10 09:30:11

Python工具命令
点赞
收藏

51CTO技术栈公众号