RFR – After Thoughts


React

Updated Mar 14th, 2022

It didn’t take long to realize that the front end of application built with React was a lot faster. It’s zippy. I see why React is popular but it turns the traditional server and DOM approach on its head. Because of this I can see why people say to hold off on learning React because you do many things totally different.

I definitely want to learn more about this and it seems like it’s definitely the way to go but I think I also need to make sure I fully grasp the traditional server DOM approach. Doing a 50 projects in 50 days type project or just continuing to build in WordPress should have me bulk up those skills, ( I can sprinkle in React a little bit if necessary).

One of the things I really liked about the course and really in combination with the full stack course is just seeing how the back-end API is created and built with Express and Mongo DB and hosted on heroku. That something I wasn’t able to truly wrap my head around yet. This course specifically showed the decoupling of the front-end from back-end. I understood the concept before but this really shined the light on that.

The course makes me really just want to start over and iterate on these more advanced websites. I can definitely see the lineup generator and the car cost app being built with these technologies. eusable components, lazy loading, and see this skeleton with spinner for slower connections is just priceless.

Reusable components, lazy loading, and showing a skeleton with spinner for slower connections is just priceless.

Deploying an express server built in node to Heroku was cool but deploying to Netlify was a highlight of the course with its continuous deployment from github, (you can also do this with heroku). A simple push to the git repo automatically triggering a build script that deploys your site is just so great! Netlify takes the serverless approach that is very scalable and seems very convenient but also opens up a whole new can of worms in cloud functions and lambda functions.

Interesting to deploy to Netlify which is serverless but a recommended next step was to learn Gatsby (static site generator) and Next-JS (ssg but also has server-side rendering for initial skelton and then react takes over) (JAM-Stack). A quick search says that server side rendering is a popular technique for rendering a client side single page application on the server and then sending a fully rendered page to the client This allows for dynamic components to be served as static HTML markup. Clearly I need to do some more digging.

Webpack continues to be an integral skill and at this point I’m really just copying pasting files I’m not really understanding them or able to build them from scratch. Given how integral this seems it’s probably worthwhile to dive a bit deeper.

One area I would probably need to adjust Webpack from this React project to another React project would be the incorporation of CSS. We pasted in pre-written CSS (and html) and leveraged bootstrap so this shouldn’t be too hard but we’ll see.

Converting a pre-existing project to a React projects should be fairly simple given the fact that you’re kind of just pasting in HTML into components that are returning JSX that has html pasted in. Although that’s where there the simplicity likely stops as I definitely need more help on the whole concept of useState, useEffect, useContext and useReducer and useImmerReducer. React is an in-demand skill that, if learned, can take me to the next level as a developer.

Whether you build an open API or not you still need mongoDB, which makes learning that and express and node and heroku important.

You also see the importance that if you have an API built without those technologies you can just build a front end that make requests to the cloud API so that you do not have to worry about the back end.

Animation (checkout Spring)

Forms (checkout Formik)