https://github.com/danedwardsdeveloper/metacritic100
A MERN web app that lets you track how many of MetaCritic's top 100 films you've seen.
https://github.com/danedwardsdeveloper/metacritic100
Last synced: 5 months ago
JSON representation
A MERN web app that lets you track how many of MetaCritic's top 100 films you've seen.
- Host: GitHub
- URL: https://github.com/danedwardsdeveloper/metacritic100
- Owner: danedwardsdeveloper
- License: other
- Created: 2024-07-26T09:06:43.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-10-22T11:20:56.000Z (over 1 year ago)
- Last Synced: 2025-06-08T03:27:11.041Z (about 1 year ago)
- Language: TypeScript
- Size: 2.03 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# MetaCritic100
~ [Live site](https://metacritic100.com/) ~
Track your progress through MetaCritic's top 100 films with this MERN stack web application. Deployed with [Fly.io](https://fly.io/).
## Features
- Track viewed films from MetaCritic's top 100 list
- Responsive design with Pinterest-style layout
- Stateless user authentication and account management with an http-only same-site JWT cookie
- Dark/Light mode
- Films data is stored client-side to minimise unnecessary http requests
- Local storage is used to track the filmSeen status of signed-out users
- Local storage merges with MongoDB user document on sign in/ account creation
## Tech Stack
- Express
- Written in TypeScript
- MongoDB
- React 18
- Packaged with Vite & SWC
- Written in TypeScript
- React Helmet Async for metadata
- Tailwind
## Roadmap
### High Priority
- [ ] Implement `/delete-account` route
- [ ] Create summary page for social media sharing
- [ ] Optimize Lighthouse score
- [ ] Add H1 heading on the home page (Somehow?)
### UI/UX Improvements
- [ ] Enhance FilmCard styling
- [ ] Implement scroll-to-top functionality
- [ ] Add GSAP animations
- [ ] Create shimmery skeleton loaders with intentional delay
- [ ] Implement filter options (language, year, genre, runtime, age rating)
- [ ] Develop search modal
- [ ] Add responsive navbar behavior (squeeze on scroll)
### Component Refactoring
- [ ] Split MenuBar into smaller components:
- Main navigation
- Mobile navigation
- Film count
### New Features
- [ ] Implement global error handling
- [ ] Add Winston for logging
- [ ] Integrate Simple Analytics
- [ ] Create a logo
- [ ] Implement caching policy
- [ ] Add multi-language support
- [ ] Create a "Reset all films" feature
- [ ] Allow users to write notes / score each film
### FilmCard Enhancements
- [ ] Add modal menu with links to:
- MetaCritic page
- Wikipedia page
- JustWatch
### Miscellaneous
- [ ] Remove dead links from the Footer
- [ ] Update Footer icon color
- [ ] Icon colours in dark mode
- [ ] Add "Site by Dan Edwards" credit
## Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
## License
This project is licensed under the [MIT License](LICENSE).