Timesheet aggregator
A prototype application build with Nuxt framework.
Proof of concept for a well engineered application build with modern tooling (2023)
By well engineered I mean:
- do something useful and be able to do it even after several years of development
- conforms to a set of rules that are automatically checked (formatting, linting, ...)
- is build on top of solid foundations
- is devided into vertical modules (by feature)
- can be deployed in minutes
- does not suck in browser (is fast to load, fast to navigate, works on an old mobile device, supports light and dark OS preferences, is at least somewhat accessible)
By modern tooling I mean (in 2023):
- nuxt 3
- nuxt 3 layers, modules
- pinia, vue-use
- css, post-css, open-props
- pnpm, turborepo
- prettier, eslint, stylelint, husky, lint-staged
- histoire
What the app does
Functional requirements
- I can see how many work hours is the baseline in a given month and how many have I worked (logged)
- The baseline is configurable (e. g. 8 vs 6 working hours per day)
- I can drop a json file with logged time into it and it will display a table with logged hours
Non functional requirement
- lighthouse?
Nuxt 3 Minimal Starter
Look at the Nuxt 3 documentation to learn more.
Setup
Make sure to install the dependencies:
# yarn
yarn install
# npm
npm install
# pnpm
pnpm install
Development Server
Start the development server on http://localhost:3000
npm run dev
Production
Build the application for production:
npm run build
Locally preview production build:
npm run preview
Check out the deployment documentation for more information.