This project will be used for budget and expense tracking for home and personal uses.
New user will likely come from:
- Register as new user including userid and password, email not required for login
Existing user will login as normal.
App \
- Use useState, useRef, useEffect, etc. hooks
App | UI Components
- Add a 35-65px high Responsive TopNav w/ Material UI
<AppBar>
&<MenuIcon>
for desktop view.- AppBar.jsx needs fixed as /home or /Home renders a terrible AppBar/TopNav.
- should contain a user/account icon button, a menu bar that opens the OffCanvas Drawer
- be responsive to 360px max-width for mobile/phone.
- WCAG / Aria compliant for labels, etc.
- Theme Toggle (Dark Mode || Light Mode)
- AppBar.jsx needs fixed as /home or /Home renders a terrible AppBar/TopNav.
App | UI / UX:
- Finish Google SEO, Ads and Analytics meta
- Create and Add a Favicon
- Create and Add a Logo
- Add a Theme toggle
- Suggested colors:
- Dark Mode: Black, Gray
- Light Mode: Blue TopNav, White Canvas
- Suggested colors:
CSS | Theme:
- Add a Theme
- Suggested colors:
- Dark Mode: Black, Gray
- Light Mode: Blue TopNav
- Suggested colors:
App | CSS & A11y
- Accessibility testing with Lighthouse, Pagespeed, Firefox Accessible testing etc.
- Testing with various browsers
- Media Queries with breakpoints
- 360px max width for phone/mobile.
Backend | Database:
- Choose backend: MongoDB
- Create APIs and API folder
- Create Express Server in server folder
Hosting: Planned on self hosting but could deploy somewhere.
Testing:
- Unit testing with Jest and Testing Library
- Write initial unit tests
- Performance Testing
- Chrome Performance Testnig
- Firefox Performance Testing
- Browser testing
- Chrome & Firefox
Design:
- Create a .drawio file with UML and sitemap
- Figma Design?
- Excalidraw
GitHub:
- Create Action
- Create Workflow
Editor:
- Add a tasks.json
-
Init project repository http://github.com/gbowne1/SavvyBudget
-
Publish project on some particular host to be decided on, but likely will be self hosted until MVP.
- [ ]
- [ ]