Nicholas Johnson
Engineer / Trainer / BSc AI
JavaScript is the democratic language of the internet. It supports all coding styles and all skill levels. There's nothing else like it, it's a magnificent little language with a pure soul and a few wonky bits around the edge. It has grown with us over the years, imposing no restrictions and letting us discover new ways of working almost every day.
I was lucky enough to pick up JavaScript in 1997, when it was first coming out in Netscape. Back then it was a weird little beast that no one quite knew what to do with. I've been using ever since, and I like to think we've grown together.
This short course assumes you’re already proficient in at least one language. In it, we focus on the tiny soul of JavaScript, a small set of rules, from which everything else logically follows.
Most tutorials skip to the end, they tell you the magic words to type to make a blog or an app. This course doesn’t do that, instead we start with the half dozen principles on which the language is founded, and build up to the rest of it. There’s actually not very much to know, it’s a tidy little language.
React components are supposed to be modular and stackable, just like html. We achieve nesting in React components by passing children as an implicit prop to our component, but what if we want to do more than simply dump those children on to the page? What if we want to manipulate them in some way? Enter React.Children.map
A Static site generator is a piece of software that lets you write pages, ideally in Markdown, then press a button to create a nested folder full of HTML that you can drop onto any old hosting environment. Static sites are fast, just HTML and CSS. They are trivial to make accessible, you actually don’t need any JavaScript at all.
My criteria for selecting a static site generator were as follows…
Babel is a JavaScript transpiler that converts edge JavaScript into plain old ES5 JavaScript that can run in any browser (even the old ones).
It makes available all the syntactical sugar that was added to JavaScript with ES6 and ES7, including classes, fat arrows, multiline strings, generators, and many more.
You can convert prety much any modern JavaScript features into code that will run on any browser, even the really old ones. This is fantastic news if you need to support older browsers, mobile browsers, Safari, IE11, or anything other than edge Chrome.
TL;DR: AngularJS is a complex, monolithic framework that makes lots of choices for you. React is a DOM manipulation library that fits into a dynamic evolving ecosystem. Both are actually rather good.
AngularJS and Angular are philosophically different. Angular 1 is at heart a DOM compiler. We write HTML, and the Angular compiler takes care of compiling it into a web application. It was a tidy little thing, and very small.
Over time Angular 1 was used to create larger and larger applications. We started arranging our code into components. We repurposed directives to make them serve as components, then used isolate scope to separate them one from another.
Angular 2 is the logical endpoint of this transformation. It is no longer a DOM compiler. Instead, it’s an component driven architecture with batteries included.
Getters and setters let us create read only attributes of JSON objects. They work in all current browsers (except IE8), so you can use them today.
Mongo has taken some heavy flak, particularly from the SQL crowd. It’s missing a few features, has bugs, and does things in an unfamiliar way. If your data is tree shaped, you like JavaScript, and you can live without transactions, it might still be the right tool.
Today’s Angular is the angularInit function: the thing that makes ng-app work. It selects elements, discovers the root module name, then shells out to bootstrap.
Organising JavaScript in a larger app becomes quite painful quite quickly. The issue is that order of inclusion matters. If I write a service that belongs to a module, I’d better make sure I have created my module before I try to append the service to it or my code will collapse in a messy heap. As we get more and more modules and more and more files, this becomes progressively harder.
Backbone is a the grand-daddy of all the JavaScript MVC frameworks. It’s the progenitor of frameworks like Ember, Angular, even Meteor. It’s a sensibly put together library full of tools to help you organise your web application, a toolkit for tidy JavaScript.
JQuery is a library written in JavaScript which is primarily about DOM manipulation. It lets you find parts of a web page and make changes to them with very little code. It’s wildly popular and is used extensively across the Internet. It also forms the basis of other larger frameworks. If you’re serious about web development you need to know jQuery.
Looking at Rails or Angular there’s a tendency to think of MVC as something rather complicated and difficult to achieve, something that really demands a framework.
In fact, MV* style JavaScript really is trivially easy to write. It’s a pattern I’ll often drop into if I need to make anything beyond the basics, but I don’t want to break out Angular’s big guns.
In this post, we’ll create a simple MV pattern. We’ll build a Model and a View and wire these together using events.
This short course assumes you’re already proficient in at least one language. In it, we focus on the tiny soul of JavaScript, a small set of rules, from which everything else logically follows.
Most tutorials skip to the end, they tell you the magic words to type to make a blog or an app. This course doesn’t do that, instead we start with the half dozen principles on which the language is founded, and build up to the rest of it. There’s actually not very much to know, it’s a tidy little language.
Starts from nothing. Variables, loops, functions and arrays: the building blocks everything else is made of. It won’t teach you a Twitter clone in thirty minutes. It will teach you the ways of code.
Mrs Potts is in a pickle. Won’t someone help her?
12 lessons
Suitable for new coders and non-coders
Learn the democratic language of the internet with simple exercises
Escape tutorial hell
Make sandwiches
Free forever, no signup required!
Won’t anyone help Mrs Potts?
You already know how to code, but JavaScript does things rather differently. We start with the tiny soul of the language: a small set of rules from which everything else follows. This is JavaScript for smart people, not a skip-to-the-end tutorial.
Most courses tell you the magic words to type to make a blog. This one doesn’t. There’s actually not very much to know. It’s a tidy little language.
