Learning HTML5, CSS3, Javascript in a Week

Coding A B C's

So I’ve been (trying) to learning how to code for the last week. I’ve been purchasing layouts and using templates on my blogs for years and wanted to learn how to do it for myself – to tailor make it to enhance the experience of my readers by making it more accessible and user-friendly.

The task was a daunting one, I’m not going to lie.

Let me preface this by saying I had some rudimentary knowledge about HTML. During the Neopets-playing days, I tried to learn a little bit of HTML to customise my “pet shop,” but needless to say it didn’t really go anywhere.The only thing I managed to do was to change my website visitor’s cursor to a crosshair and customise the font colours; I didn’t know anything about CSS, beyond the fact that I needed to know it to customise my layout; some quick Googling told me that knowledge of PHP and JavaScript were needed to do cool things on websites.

So what is the difference between HTML5, CSS3 and JavaScript?

From what I’ve learned so far, HTML governs the content, whereas CSS customises the layout of the website. I still haven’t figured out JavaScript yet though.

(The image above is an example of a bit of JavaScript I coded [as part of an assignment] for a game of “stone paper scissors” played against a computer. This is an example of if/else rules in JavaScript in play.)

Challenges

The one language that really tripped me was JavaScript because of the logic and arguments involved in them (and because I’m really bad at closing my curly brackets). I had to get le boyfriend to help me out in a few tight spots.

Resources

Some (free) online resources I turned towards were W3WSchools (which maintains the stands of the world wide web) and codeacademy (a website that teaches web developer languages) that has a lot of exercises on the way (ie. coding the “stone paper scissors” game up top) that help you understand coding. If you really want to throw yourself into it, teamtreehouse is another great resource, but is a members only (monthly-fee) web resource. The one good thing about them is that they also have videos and extra content that codeacademy doesn’t have.

I flipped through a few books in Indigo and found myself really enjoying and learning a lot from Jon Duckett’s manual for HTML5 and CSS3.  It’s a very clear and streamlined way of learning code. I highly recommend it.

Tip: Although it’s perfectly fine to use Notepad or Notepad++, the program I’m using to write my codes in is Sublime. It’s really handy because it reminds you to close your bracket to ensure the code runs!

Example of JavaScript

var age = prompt (“What’s your age?”);
if (age<=13) {
console.log (“You can play, but I take no responsibility for the                 shenanigans you’re about to get into”);
}
else {
console.log (“Go go go!”);
}

This code basically prompts the reader (pop up) to enter their age when they go into the website. if their age is younger than 13, then the system prints “You can play, but I take no responsibility…”. Otherwise (else)  it will print “Go go go!” –> see, not so bad, right?

If you want to learn code with me, feel free to join me at codeacademy, or take a coursera course with me!

More updates on coding to come!

Leave a Reply

Your email address will not be published. Required fields are marked *