Awesome
Vue3 codebase containing real world examples (CRUD, auth, advanced patterns, etc) that adheres to the RealWorld spec and API.
This codebase was created to demonstrate a fully fledged fullstack application built with Vue3 including CRUD operations, authentication, routing, pagination, and more.
We've gone to great lengths to adhere to the Vue3 community styleguides & best practices.
For more information on how to this works with other frontends/backends, head over to the RealWorld repo.
What works?
- Vite
- Composition API
- SFC <script setup> sugar
- Suspense (Experimental)
- Vue router
- Pinia for state management
- TypeScript and Vue tsc for static analysis
- swagger-typescript-api for auto generate interface from swagger
- ESLint and @mutoe/eslint-config for linting and styling (based on @anthony/eslint-config)
- Vitest for unit testing
- Testing Library for component testing
- Cypress for E2E testing
- GitHub Actions CI/CD
Basically, some of they are necessary features for the development of medium to large projects, and you can also use this repository as a starter.
Enjoy it! 😄
Getting started
pnpm install
# Development
pnpm dev
# Build dist
pnpm build
# Run unit tests
pnpm test:unit
pnpm test:unit:ci
# Run E2E tests
pnpm test:e2e
pnpm test:e2e:ci
Contributors
<a href="https://github.com/mutoe/vue3-realworld-example-app/graphs/contributors"> <img src="https://contributors-img.web.app/image?repo=mutoe/vue3-realworld-example-app" /> </a>Made with contributors-img.
Vue related implementations of the Realworld app
- gothinkster/vue-realworld-example-app - vue2, js
- AlexBrohshtut/vue-ts-realworld-app - vue2, ts, class-component
- devJang/nuxt-realworld - nuxt, ts, composition api
- levchak0910/vue3-ssr-realworld-example-app - vue3, ssr
Sponsor
Thanks JetBrains for providing IDE support!