Info Film : React Edition

A simple film catalog website, now built with React

November 2021 — November 2021

Summary

A simple film catalog website, now built with React. A continuation of the previous task from GDSC ITB.

Developer Diaries

Into the Framework

Not too long after I was made familiar with vanilla web development (in retrospect, I don't think I was familiar enough at this point to move into framework but here I was), I finally moved into the next path in (front-end) web development, the many millions of Javascript front-end framework. In its session on front-end framework, GDSC taught React (which is funny because Google created Angular), most likely due to its ubiquitousness. And I am grateful that they did because I now thinks that React is a great framework for beginner in the same manner that C++ is a great language for everyone starting programming. It is indeed hard, but once you're used to it or at least familiar with it, it's much easier to learn other front-end frameworks. Not to mention that it is popularly used in production.

I would be lying if I say the process of learning React wasn't painful. Most of the pain didn't come from this project, but from my attempt at porting Take A Path to React prior to this project (which failed, that's why it's not featured here). By the time I work on this project, I was much more familiar and used to this framework that I finished it in one sitting in an afternoon.

It was a heck of a lot of fun though learning new stuff such as (beginner) global state management using useContext + useState and CSS-in-JS (styled components). This project definitely built a solid foundation for my (treacherous) journey into front-end frameworks

Deployment

Because in my previous projects I used Github Pages for deployment, I did the same thing for this project. In retrospect, I should've deployed it in services such as Vercel or Netlify. It would've saved me quite a few headaches down the line in my next projects. Github Pages is fine for static sites, but at some point you need something more sophisticated, this should've been that point. The silver lining is that deploying this to Github Pages made me grasp (to a limited extent since I was still new to frameworks, let alone how they work) how framework code gets translated to vanilla, because that is what browser serves at the end of the day.

Gallery