If you are not a techie yourself, it can be rather overwhelming and confusing to sort through all the options for learning to code. And what exactly what is "learning to code."?

Quick Start Guide

There are so many different types of coding to learn and so many ways to do it. What's the best way? There probably isn't just one. But, we've spent a lot of time going through the various resources and using them to teach children (including our own). So, here are our guidelines.

If your child is third grade or older you can skip Step 1 or just do an abbreviated version of it. Course 2 and 3 from Code.org would fit the bill!

1. Basic Concepts

Using graphical programming tools, children can learn the basics of coding including how to design a program, how loops & conditionals work, what variables are and more. Some good tools include Scratch, Hopscotch and Code.org. You can see a more exhaustive list here.

2. Web Site Development

Starting in 4th or 5th grade - learn basic website development in this order:

Basic HTML
CSS including page layout
JavaScript
Maybe add in some JQuery which is a library built in JavaScript to simplify tasks.
HTML Forms and beginning PHP

3. Real Coding

Start with either Python or Ruby to learn a solid programming language with skills that will allow you to develop complex websites and programs.

Then, if app development is calling start with Swift - Apples new development tool and should be easier for kids to learn than Objective-C or Cocoa. Access to a Mac is required.

Tutorial Websites

These are all sites that are aimed at teaching you how to code via interactive environments on their web site. These sites cover the gamut from Programming Concepts to HTML to JavaScript to Python to SQL and more.

CodeAvengers

CodeAvengers is what my kids started on to learn HTML and CSS. The courses are interactive. They seem to keep playing with their pricing but as of January 2018, they had a free trial then a $29 monthly fee. It has an easy to use interface for allowing students and parents to track their progress. The lessons are well done and suited for kids.

Right now they offer these paths:

HTML/CSS
Javascript
Web Dev - includes JavaScript Interactivity and JQuery
Python
Design - typography (fonts) and color theory
Intro Coding - get a taste of HTML, CSS, JavaScript and Python
Computer Science - fundamentals of programming and development
Game Development - use JavaScript to create games

CodeAcademy

CodeAcademy is well laid and free! Well not as free as it used to be. Most of the basic classes are free but you have to pay Pro for some advanced classes. They also will create "paths" for you to follow that provide support.

The site is easy to use as well. They also have Intensive classes now which bundle skills together.

Build Websites from Scratch - using HTML & CSS
Build Front-End Applications from Scratch - using JavaScript and ReactJS
Build Web APIs from Scracth - using JavaScript and Express.js
Test-Drive Development - learn best practices
Introduction to Data Analysis
Build Website UIs

They have various “skills” that string together a series of classes including:

Make a website: HTML & CSS including Responsive Design and SASS
Make an Interactive Website: HTML with Javascript, JQuery, AngularJS, ReactJS and Learn Node
Learn Rails: Learn to build web apps with Ruby on Rails4.
And more like AngularJS, SQL, Java, Git and the command line for more advanced learners

In addition, they more in-depth offerings on specific language skills including:

HTML & CSS
JavaScript
jQuery
Java
PHP
Python
Ruby
SQL

Code.org

Code.org was started with a mission to bring code to everyone and has an impressive list of heavy hitters giving performances via video including, but certainly not limited to, Bill Gates and Mark Zuckerberg. It uses a drag and drop language called Blockify which is similar to Scratch but has a little more complexity including functions and variables. They started with just three courses but rapidly add on.

This site is great for younger or beginning programmers. They ah

Courses A & B is designed for early readers – ages 4+
Courses C, D, E & F is designed for ages 6+ and introduces basic programming concepts including conditionals, events and loops.
Grades 6-12 - three tutorials - App Lab, Game Lab and Web Lab which teach kids how to create web apps and pages.

All courses come complete with teacher lessons as well as assignments for the students. It is extremely easy to organize classes and to track progress.

Khan Academy

Khan Academy has two things going for it – it’s free and you can set up classes to organize your students and see their progress. Plus, it is well laid out and easy to follow. They have classes in the following subjects:

Intro to Javascript: Drawing and Animation
Advanced JavaScript: Games and Visualizations & Natural Simulations
HTML/CSS: Making webpages
HTML/JavaScript: Making webpages interactive.
Intro to SQL: Querying and Managing Databases

Plus they have classes in math ranging from Kindergarten up to Differential Equations.

Plural Sight

The Odin Project

The Odin Project is a new site that is free (bonus!) and looks pretty useful and interesting. The best thing about it is that in addition to teaching useful skills, it also has tutorials on learning what a web developer does and advice on how to get hired at the end.

While it covers a lot of material – it organizes outside resources so that the courses are not always consistent. Probably not a great starting point for kids. But definitely worth checking out!

It offers the following tutorials:

Introduction to Web Development which covers what a web developer does, jobs in the industry, tools that they use, communities, and tips for becoming a great developer.
Web Development 101: is an wide-spread introduction to the world of web developing. It starts with how a computer works, covers the front end (HTML, CSS, JavaScript, jQuery), the back end (Ruby, testing, database), Web Development Frameworks(Ruby on Rails, Backbone.js) and additional topics(GIT, the Cloud, Security, FTP)
Ruby Programmings
Ruby on Rails
HTML5 and CSS3
JavaScript and jQuery

Code School

Too Vague?

If you want a list of tutorials to try for some of the above sites - check out the links in the boxes below.

How to Learn Website Development

If you look at the sites above - there are many great online sites to learn from. Take a look at these in particular:

CodeAvengers
- Learn HTML/CSS path
- Learn JavaScript path
- Learn Web Dev path - JavaScript Interactivity and JQuery
CodeAcademy
Khan Academy
- HTML/CSS
- JavaScript
- JQuery
Code School
- HTML/CSS
- JavaScript

How to Get Started with "Real" Coding

Again - many of the sites above not only teach website development but also delve into programming and are a great place to start. Take a look at these in particular:

CodeAvengers
- Learn Python path
CodeAcademy
- Python
- Ruby
- SQL: for database management
- Git: for saving and being able to reverse your work
- AngularJS: build web apps
Khan Academy
- Intro to SQL - databases
Code School
- Ruby
- Python
- iOS: with Swift or Objective-C
- Git
- Databases

As you get more advanced you should also check out sites like treehouse.com, udacity.com and coursera.com.