A simple website using pure JS, CSS, and HTML to showcase my movie reviews.
As of April 2024, there are 75 reviews on the site. I expect to add at least 1 review a month.
Visit my site to read them! Hosted proudly on GitHub Pages.
- Responsive Design: Resize the page and have fun. My site is styled for mobile phones and desktops.
- Idiomatic HTML: Each page features HTML written as intended by the World Wide Web Consortium (W3C).
- Latest CSS: I used the latest techniques like Grid and Flex!
- Accessibility: My site was developed with screen readers in mind. Each page received a high accessibility score of 95+ from PageSpeed Insights. Try for yourself by pasting this link on PageSpeed Insights.
- Light / Dark Mode Toggle: implemented without a flash of unstyled content (FOUC), remembers preference from previous visits, matches OS-default otherwise
- Meta tags for each page: any page and review is sharable on social media, iMessage, or Discord with the site image, title, and description for beautifully rendered links
- No web frameworks: Having used React and Angular, I wanted to design a website from scratch to learn the fundamentals.
- Watched List: I am debating how to design an automated system that logs films I watch in chronological order with links to reviews on the site if available. I am not a Letterboxd user, but I am looking into their API.
- Performance Optimization: The home page has lazy loading for most movie card images, but it loads slowly with for users with connections below 1 Mbps. There is a plain review list for very slow connections, but unsure how to move forward otherwise.
My work would have taken significantly longer without the aid of Ben Frain's amazing book "Responsive Web Design with HTML5 and CSS." It was a great read and caused a late-night "Eureka!" moment.