Day 3 - Some Early Projects
Joëlle
Posted on October 11, 2019
As I am learning from videos, a lot of the projects have been planned and I don't get to hear the decisions made about the markup. With a code along, you don't think about how you want to approach the project.
After every major concept that I learn, I usually try to find something that I can recreate on my own. The main criteria is that it's a project that I don't have access to solutions or how someone else did it. I would choose a site or think of something and I will start coding.
Here are a few small pages that I have recreated on my own:
1- Restaurant Homepage
This was inspired by the Bareburger website. I had just started learning CSS and done a few projects with the course. I did this the hard way but this is where I started to really understand how to use divs and positioning.
2- Presentation website
Another project is a presentation site. This was mostly working with media queries, image overlay and CSS variable.
You can find a video here:
https://twitter.com/jojonwanderlust/status/1173079788489183233
3- YouTube Homepage
This last attempt was a little different because I learned Flexbox and CSS Grid and I spent sometime thinking about how I wanted to layout the markup. I wanted to recreate the YouTube homepage. I have not completed it as I want to add more pages and continue to practice. I wanted to add this as I am super proud of how it came out.
I used Font Awesome for the icons and they are wrapped in a tags. As such I created 4 columns to display the different sections. Then for columns 2-4, I displayed them as flex to have the elements lined up in a row.
As I am going on this journey, I get frustrated when something doesn't work and I start to question if I am learning at all. I usually try for a while to solve the issue then I leave it alone and return to it and work through the logic of what I am trying to do.
I never thought I would enjoy puzzles like that but I love trying different solutions and see what changes and how I can fix something.
On to the next one!
Posted on October 11, 2019
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.