Jonathan Saipe

11 Free Resources To Help You Learn Coding

5 September 2014, Jonathan Saipe



It seems that the whole world is talking about the need to develop coding skills as a long-term solution to the “skills gap” between the number of technology jobs and the people qualified to fill them.

In fact the UK’s Guardian published an article yesterday stating that from the start of the new term, children as young as five will be learning programming skills in the classroom.

To help you further develop your coding skills, take a look at 11 free online resources:

1. Liveweave

Liveweave - HTML, CSS & JavaScript editorLiveweave is one of many free cloud-based code playgrounds. You can write your own HTML, CSS and JavaScript and see the results instantly; and if required team up with friends and colleagues to work collaboratively.

A feature I particularly like is that Liveweave will prompt you with HTML and CSS attributes and options when you start typing your code, helping you learn as you go. This means you have a dynamic HTML and CSS reference library and learning environment readily available.

Furthermore, if you happen to make a mistake, Liveweave will provide a visual indication that something isn’t quite correct. In my view this is a great learning resource.

Take a look at Liveweave »

Alternatives: Mozilla Thimble, CSS Deck, JS Fiddle, CodePen, JS Bin, Tinkerbin, WriteCodeOnline, Dabblet

2. Codecademy

I was introduced to Codecademy by an IT colleague who wanted to spend his lunch hour learning to code. So, I had a go myself and was impressed.

Codecademy provides a simple-to-use interface, with interactive exercises to help you learn to code from scratch or refine your current knowledge. They cover a comprehensive range of programmatic languages including: HTML, CSS, JavaScript, jQuery, PHP, Python, Ruby.

The level is fairly rudimentary, so it’s ideal for beginners or anyone who simply wants to get a taste of the fundamentals.

Codecademy - learn how to code online
Take a look at Codecademy »

3. Code School

Code School, a US-based company, offers a multitude of online screencasts combined with “challenges” to help you develop your coding knowledge and skills. Similar to Codecademy, their screencasts cover Ruby, JavaScript, HTML/CSS (including responsive design) as well as iOS app development with Objective-C.

Whilst some of the content is free, you have to enrol at $29 per month to get unlimited access to all of their content.
Code School logo
Take a look at Code School »

4. The Code Player

The Code Player approaches things slightly different by providing, as they mention on their site, “video style walkthroughs showing cool stuff being created from scratch.” So, for example, if you want to learn how to code a 3D HTML form, or create a Matrix style rain animation, you can either view the code, or play a video walkthrough of the code being written in real-time or sped up.

It’s pretty funky and a fun way to learn. The examples, however, are definitely for more experienced HTML, CSS & JavaScript programmers, so possibly one to avoid if you are starting from scratch.

The Code Player logo
Take a look at The Code Player »

5. Programmr

Programmr targets more experienced developers by providing online examples and some exercises around a fairly large range of languages including: JAVA, C#, PHP, Ruby and JQuery. Programmr also offers content on mobile technologies to help you develop your iOS and Android app development skills.

Whilst its interface isn’t as slick as some of its counterparts, the larger range of languages makes up for this shortfall.

Programmr logo
Take a look at Programmr »

6. Apple Developer Tools

Whether you’re a beginner or a more established developer, if you’re looking to learn about coding iOS and Mac apps, the iOS and Mac Dev Center is a must.

Apple provides a full range of content from video-based tech talks, to developer libraries, guidelines and technical notes. You can also learn the process of preparing your apps for review and release in the Apple Store.

Apple Developer Tools logo
Take a look at Apple Developer Tools »

7. Scratch

Scratch logoLast year, both of my kids came home from school and introduced me to Scratch – a platform they had used in the classroom.

Scratch is great! I love it. It was created by the Lifelong Kindergarten Group at the MIT Media Lab to provide an accessible and creative way of teaching young people the logic and principles of coding. With Scratch, you can program your own interactive stories, games and animations — and share your creations with others via the MIT online community.

I found it great fun to sit down with my kids and figure out programmatic problems. Obviously, they were far better than me!

Take a look at Scratch »

8. Hopscotch

Hopscotch is the only app listed here and is aimed at teaching kids the principles of coding. Its graphical programming language has been specifically designed for use on iPads, allowing the user to drag and drop elements, to catalyse learning in a simple visual environment. In this sense it is very similar to Scratch, but purely mobile based.

Given its audience, it purposely avoids script based coding, where learners would traditionally get tripped up by syntax errors or typos.

Hopscotch logo
Take a look at Hopscotch »

9. Mozilla Developer Network

Mozilla Developer Network logoDespite appearing a little unwieldy at first, the Mozilla Developer Network provides a comprehensive set of resources ranging from basic documentation for budding HTML coders, to information on web apps and unsurprisingly Firefox OS.

It wouldn’t be my first port of call for a newbie, but if you have a little experience behind you, then check it out.

Take a look at Mozilla Developer Network »

10. W3Schools

I’ve been visiting W3Schools since my HTML coding days back in the late 90’s. Yes I’m that old! W3Schools has been around for donkey’s years, and its popularity is due to its simplicity. If you want the ideal programmer’s reference guide, it’ll most likely have the information you want. No bells and whistles, just easy-to-find content.

In addition to the reference material, it contains lots of “try it yourself” examples combining a code playground and WYSIWYG editor to see the fruits of your labour. This resource suits all levels and definitely gets my thumbs up.

W3Schools logo
Take a look at W3Schools »

11. Google Developers

Last but not least is the Google Developers hub. Probably the most useful section is the product section containing reference material, API documentation and dev tools for its core products such as Google Maps, Chrome, Google Analytics and even Google Glass.

You may also want to check out the Google University Consortium, which contains information on their mobile, web development and programmers courses as well as discussion boards and developer tools.

Google Code University

If you’re looking to learn more about web coding, Jonathan Saipe runs Emarketeers’ Website Coding For Beginners training course.