Skip to content

A Todo App build by TypeScript + Vue3 + Vitest with composition APIs pure TS/TSX

License

Notifications You must be signed in to change notification settings

hefengxian/vue3-ts-vite-vitest-todo

Repository files navigation

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

About

A Todo App build by TypeScript + Vue3 + Vitest with composition APIs pure TS/TSX

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published