3 Days Before The Start of Recurse and My Third Day of JS30 With Wes Bos
Today I watched the full 2 hour tutorial on building a portfolio website from scratch and deploying it using aws s3 buckets by Dennis Ivy, hosted on the Traversy Media YouTube page. I’m very impressed that content this good is free to watch. He went over css grid, css flexbox, css variables, positioning and so many other foundational ways of placing content on a static website. What I enjoyed most was that he took those concepts and showed its usage in implementation through this tutorial. The added cherry on top for me was the interactive element he introduced with a Javascript theme changer using the root css variables.
I do have to say it can be a lot to watch a full 2 hours not being familiar with the concepts he lays out, so here are some shorter videos, helpful links, and interactive content touching on some of those concepts (to be updated as I continue)
- Web Dev Simplified CSS Flexbox 15 Min Tutorial
- Web Dev Simplified CSS Grid 20 Minute Tutorial
- W3Schools Position Property
- FreeCodeCamp Interactive Learning For Responsive Web Design (aka html elements, basic css, html forms)
I also dived into 2 hackerrank certifications. I was very surprised to pass the basic Javascript certification since I did not know how to do the Https GET API request to solve the second problem. I read the documentation to use the get method with https on their website, but getting the JSON data was very confusing and something I still have to go back to. The second certification, the problem solving one, utterly floored me as I was only able to pass 7/13 for the first problem and a measly 4/13 for the second problem. I have to do a lot more hackerrank problem solving problems if I hope to prepare myself for coding interviews.
Finally before writing this blog post, I did day 3 of Wes Bos’s JS30 and it was an enjoyable way to end my programming for the day. Day 3 is working with CSS variables and using them to live update spacing, color, and blur on the webpage (and the concept expands into anything on site). On top of Wes’s implementation of grabbing values from the input and updating the base, I was able to use the localStorage variable I learned from the 2 hour Dennis Ivy video to keep the input states persistent even when the website is reloaded which added a nice touch. I’m thinking of adding these interactive elements to the final portfolio site I end up putting together.