---
_db_id: 176
content_type: topic
ready: true
title: Web Dev learning materials
---

You are expected to spend your free time learning and practicing your web development skills. Here are some resources for you. Different people tend to prefer different resources because they support different styles of learning.

You should know HTML, CSS and JavaScript (including ES6 syntax).

If you are prepping to attend the Umuzi bootcamp we suggest you concentrate on the first 2 links below and concentrate on the JavaScript language.

## Basics

- [FreeCodeCamp](https://www.freecodecamp.org/): This one is great if you've never coded before. It holds your hand through the whole process
- [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide) - Most comprehensive javascript reference guide on the internet.
- [W3Schools](https://www.w3schools.com/): This is also very friendly for beginners but teaches things in a more exploratory way
- [CodeWars](https://www.codewars.com/): Practice makes perfect
- [JS re-introduction](https://developer.mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript) - Compact introduction covering types, variables, operators, control structures, functions and closures.
- [Hacker Rank](https://www.hackerrank.com/) - Practice coding, prepare for interviews, and get hired.
- [Simplified JavaScript Jargon](http://jargon.js.org) - Glossary which explains all the buzzwords from the JavaScript eco system.

> Once you have the basics down then you need to start learning ES6, this is a more modern version of JavaScript and has a few new concepts.

- [Exploring ES6](http://exploringjs.com/es6.html) - Good introduction with in-depth chapters.
- [Exploring ES2016 and ES2017](http://exploringjs.com/es2016-es2017.html) - Follow up of »Exploring ES6«.
- [Setting up ES6](http://exploringjs.com/setting-up-es6.html) - Explains how to set up ES6 projects that are transpiled to ES5.
- [ES6 Overview](https://ponyfoo.com/articles/2-es6) - Bullet point overview including in-depth articles.
- [ES6 Katas](http://es6katas.org) - Learn ES6 by solving unit test online.
- [Practical ES6](https://github.com/mjavascript/practical-es6) - eBook with practical examples and advices.
- [30 seconds of code](https://github.com/Chalarangelo/30-seconds-of-code) - Useful ES6 snippets that you can understand in 30 seconds or less.

> We find the following bits and pieces really useful. Make sure you really understand this stuff:

- [Classes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes) - `Javascript Classes` description and use cases.
- [Arrow functions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions) - `Arrow functions` description and use cases.
- [let](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let) - `let` description and use cases.
- [const](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const) - `const` description and use cases.
- [Modern JavaScript Cheatsheet](https://github.com/mbeaudru/modern-js-cheatsheet) - Helps developers with basic knowledge to get familiar with modern codebases.
- [ECMAScript Language Specification](http://ecma-international.org/publications/standards/Ecma-262.htm) - The standard JavaScript is based on. Only for very advanced learners.
- [Spread Operator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax) - `...` Spread Operator description and use cases.
- [Ternary Operator](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator) - `?` Ternary Operator description and use cases.