Google Homepage Clone

I built my first ever project following with the Odin Project syllabus:

I used HTML and CSS to re-create the Google homepage. The project focuses on arranging the page visually and not actually building in any functionality (so the links don’t go anywhere and the search box doesn’t work).

It was much, much more difficult than I expected.

I also used the command line and Git and GitHub the whole time, so you can see all of my commits. I tried to copy the rules for making commits and writing commit messages.

I kept using a lot of trial and error and I still feel like I don’t quite understand all the display and position attributes fully and their behavior sometimes confused me.

It was extremely fun but extremely challenging.

It is live here.

Advertisements

Android Logo in CSS

Following the Odin Project syllabus I followed along with this video on Code Player (a website where you can watch and download other people’s code).

I made the Android logo entirely with CSS and it’s arms, legs and head move when you hover over them.

I tried it out first on CodePen (an online tool for writing code which I was introduced to by someone at a coding meetup a few weeks ago).

I reviewed my Git and GitHub by tracking my html and css documents with git and then pushing them to GitHub, editing it and making commits here.

I enjoyed creating something – even though it was copying something someone else made.

I’m thinking at the moment if there’s anything else I could make in a similar way just to practice my CSS!


See the Pen Android Logo in HTML/CSS by rebeccode (@rebeccode) on CodePen.