A collection documentaries related to Hawaii
Live site: https://raybb.github.io/awesome-hawaii-documentaries/
Before moving to Hawaii I wanted to watch documentaries to learn about the area. Unfortunately, Google, Amazon, Netflix, IMDB, and local library searches all lead to just a few documentaries. I knew there were more out there so I started compiling a list from more obscure sources.
I uploaded much of the data to The Movie Database (TMDB) and ultimately decided to make a Web 1.0 themed website with the data.
Staying true to the theme of Web 1.0, this site has no frameworks or premade stylesheets. Just artisanally handcrafted CSS, HTML, and a tad of JavaScript. Admittedly, I used media queries, arrow functions, lazy loading, and other modern web features. Vue, React, and similar frontend frameworks are overused. Here is a nod to the simple ways.
- Images are hotlinked from TMDB so if TMDB goes down we won't have photos anymore
- Hotlinked images are relatively large (~8MB total)
- Storing data in TSV so it is easy to copy from Google Sheets
- Not using Google Sheets api because: Web 1.0, easier data, don't want to depend on Google
- Hardcoding HTML string in the JavaScript
Clicking the sun in the top left corner of the screen switches from Web 1.0 to Web 2.0. Feature was added after a friend who actually wanted to see the documentaries said that the Web 1.0 theme made his eyes bleed. The feature required adding a bunch of CSS variables to the previously simple CSS. I also didn't add the whole bootstrap CSS, which could cause repainting if loaded on button click, so I just reused the parts I needed.
The code in the tmdb folder was used to pull the address of images for movie covers. I don't anticipate using it again since new movie covers are easy to grab manually.
- Marley for making the honeycreeper pixel art.
- Gimp for the electric blue pattern used in background.
- Hawaiian Voice for many great movies.
- If you'd like to add a movie open an issue with relevant info
- If you'd like to convert this project to React fork away and we can compare results