First Project

I’ve finally finished the first project for the Odin Project! The assignment was to copy Google’s homepage- you can check out the result here. Of course, the search box doesn’t actually work, but the assignment was all about making it look like the homepage. It was great as a project because we essentially had a mockup [the real Google homepage!] and it used a variety of HTML and CSS, applied in realistic ways.

There were some pretty confusing moments for me- mostly surrounding which shade of gray to use [so many!] and there were a couple of times where typos had me banging my head against the wall, so defo going to be more careful in the future. I know I can be a perfectionist, but there’s still one thing that I’m not happy with: the microphone icon inside the search bar. The .gif file from Google displays the icon as black, so to achieve the grey color I had to change the opacity, but that also affects the text typed into the search bar. This wouldn’t be a problem on the real page, because as soon as you start typing it switches to a results page. I would have liked to have worked something out, but I think it’s probably more important to proceed in the course instead of getting hung up on something tiny like that [saying that, I can see myself looking this up some more over the weekend!]

I’ve also started using Sublime Text 2 as my go-to text editor, so it was the perfect opportunity to use it on a project start to finish. It went pretty smoothly, apart from some trouble with .CSS files at the beginning. I’m making much more of an effort to get comfortable with Sublime- little things like using keyboard shortcuts. I’m even tempted to say that purely out of the box I’m finding it easier to use than the previous text editor I was using, Notepad++, but I think a lot of that has to do with me telling myself that I’m going to be using Sublime for the duration of the Odin Project, so I had better like it!

I just finished my assignment this evening, so now I’m off to knit a couple rows and get some sleep, but I’m excited to see what’s going to be in the next part of the Odin Project!

7 thoughts on “First Project

  1. You did a great job on your Google markup. I was confused until I continue reading. Honestly, apart from the smaller font, I can’t really tell the difference. A month ago, I received an email from a rep from the Odin Project. I took their “create a splash page” course and really enjoyed it. Which course are you taking?

    Liked by 1 person

    • Thanks! I really enjoyed it as a project and actually had to stop myself from trying to get it pixel perfect! I’m going to try to get through the whole curriculum, but right now I’m on Web Development 101 (still in the front-end section) Glad to hear from someone who’s used and enjoyed the Odin Project! 🙂


    • I’m using the Odin Project (coupled with some outside reading and videos) – and following the web development course. I really like the idea of open source, and that was one of the things that really drew me to the Odin Project.


  2. Pretty realistic! Very good job, actually looks like mine, except I don’t have a microphone on my computer so I don’t see the icon on Google, and didn’t put it in mine. Also, a nice free text editor you should try out as well is Brackets (

    Liked by 1 person

    • Thanks, I’m trying to stick with sublime for now, just because that’s the one that’s been recommended, and I know that it’s really popular. Apart from that, I also like notepad++, but I’m really trying to get settled and make sum like mine.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s