Skip to content

Latest commit

 

History

History
66 lines (43 loc) · 1.67 KB

README.md

File metadata and controls

66 lines (43 loc) · 1.67 KB

English | 简体中文

logo

CI Status

Todo App

Talk is cheap, show me the Demo

Live demo: https://hefengxian.github.io/vue3-ts-vite-vitest-todo/

Todo App Screenshot

Why

Todo App is a typical start-up project, especially for some new frameworks. maybe you guys already know how to build one with some framework you are familiar with (even there is one on Vue docs). But when i decide to start learn & using Vue3, there is no practice demo ONLY use the following:

  • Pure Composition API
  • New Reactive API
  • TypeScript
  • Pure TS/TSX no SFC *.vue
  • Vite for build tool
  • Learn/Practice how to write tests (Vitest as the testing framework)

So i write one by myself, to practice new Vue3 new APIs, new build tools...

Hope it will helpful for those people like me, to experience new APIs and tools that bring to you

Dev

Here we use yarn

You need to know

  • Conception of Vue3 Composition APIs/Reactive APIs/setup()
  • TypeScript
  • Vue Test Util (if you want write some test)
  • Less (CSS build by Less)
  • JSX syntax for Vue3 (quite difference to React.js JSX)
# install dependencies
yarn install

# dev mode with HMR
yarn dev

# run test
yarn test

# build
yarn build

Recommended IDE Setup

License

MIT