Welcome to Flow!
Flow is a mobile-responsive Music player app that has many useful features. Users can efficiently upload and edit songs, comment on items, and much more. Data is managed and organised by Firebase, which also provides login and authentication.
Please visit (in a new tab): https://flow-dan-chui.vercel.app/
- Vue.js
- Vue Router
- Firebase
- Pinia
- PWA
- Tailwind CSS
- Vite
- Testing (Vitest | Cypress)
- Vercel
-
Modern Framework: Utilizing Vue.js and Vue Router to maximise efficiency and reusability.
-
Database: Data management and storage are delivered by Firebase.
-
Authentication: Login, editing data and user management requires authentication and authorization. Firebase rule policies controls access.
-
Pinia: State management library that simplifies fetching, caching, and updating data.
-
Filtering/Sorting: Filtering and sorting options via Pinia efficiently navigates through data.
-
PWA: Progressive Web App (PWA) allows Users to utilize the app both online and offline.
-
UI/UX: Clean User and mobile-friendly interface stylized by Tailwind CSS.
-
Internationalization: Vue-i18 assists with translation between the English and Japanese languages.
-
Testing: Automated testing using Vitest & Cypress helps ensure code quality.
Please visit (in a new tab): https://flow-dan-chui.vercel.app/
VSCode + Volar (and disable Vetur) + TypeScript Vue Plugin (Volar).
See Vite Configuration Reference.
npm installnpm run devnpm run buildRun Unit Tests with Vitest
npm run test:unitRun End-to-End Tests with Cypress
npm run test:e2e:devThis runs the end-to-end tests against the Vite development server. It is much faster than the production build.
But it's still recommended to test the production build with test:e2e before deploying (e.g. in CI environments):
npm run build
npm run test:e2eLint with ESLint
npm run lint