The JavaScript Curriculum

A JavaScript Curriculum for Active Learners

About

This curriculum is meant to equip you with the resources you need to get yourself up to speed with JavaScript as a language, and use it to create full and complete solutions. Motivating yourself to learn something new can be a challenge, thusly this curriculum is focused on the learning-by-doing methodology.

This curriculum heavily realies on NodeSchool.io for the best self-learning experience.

Have lingering questions about why you should be doing JavaScipt? Check out this presentation on Why JavaScript?

Before You Begin

It is highly recommended that your fork this repository, keep track of your learning progress by adding xes inside the [ ] checkboxes and committing them to your own repository.

New to Collaborative & Open Source Programming?

• To collaborate with others and track your own progress, you'll need to create a GitHub account. Create an account
• Install a Git client,
  • Simple:
    • GitHub for Windows
    • GitHub for Mac
  • Advanced:
    • GitExtensions (Windows)
    • Tower (Mac)
    • Github Desktop (Mac/Windows) In pre-release
• Now you can fork this repo, by using the fork button on the top right hand of the GitHub page and start tracking your progress.

Pre-Requisites

• Install Node.js, so you can run the self-learning tools: https://nodejs.org/
  • If you're running on Windows, check out these tips.
• Visit and familiarize yourself with npm
• Get a good text editor/IDE.
  • Text Editor
    • Atom
    • Sublime Text
    • Textmate
    • Brackets
  • IDE (Integrated Development Environment)
    • Visual Studio Code (Mac/Windows)
    • WebStorm (Mac/Windows)

How to Ask for Help

The Internet is a vast cache of information and if you know how to navigatge it well, you can become a very effective learner.

• Always and always Google what you're looking for first. If what you're looking for isn't in the first page of results, then try again with different query.
• Prefer StackOverflow links or got there directly.
• If the above strategies fail, then feel free the create a GitHub issue on this repo.
• Always provide full and complete information when asking for help.
• Specific questions are far more likely to get answered, than general/generic questions.

Absolute Beginners

• Don't how to work the console, command line, CLI or bash? Start with the basics here
• Open up command line/console. Type in node, do you see > ? If yes great, hit Ctrl+C to terminate the currently running node process. If no, then see How to ask for help.
• Type in npm, do you see Usage: npm <command>?
• You're ready to start learning, using the self guided workshoppers. Good luck!
• Learn how to use Git and GitHub basics.
  • Run npm install -g git-it
  • Then git-it
  • Additional help http://jlord.us/git-it/
• Learn JavaScript basics. No previous coding experience required.
  • Run npm install -g javascripting
  • Then javascripting
  • Additional info https://github.com/sethvincent/javascripting

A Re-Introduction to JavaScript

• Introduction to modern JavaScript by Mozilla

Become a Better JavaScript Developer

• Practice Best Practices -- see section below
• Learn the details of Scope, Scope Chains, Closures, and Garbage Collection.
  • Run npm install -g scope-chains-closures
• Learn fundamental functional programming features of JavaScript in vanilla ES5.
  • npm install -g functional-javascript-workshop
• Learn to use promises in JavaScript to handle async operations.
  • npm install -g promise-it-wont-hurt
  • Additional information: Q.js
• Learn Lo-Dash (fork of underscore) to handle your arrays and objects simple!
  • npm install -g lololodash
  • Additional information: Underscore.js has great documentation. Also check out lodash.
• Learn to test your code
  • npm install -g test-anything

Get Started with Node.JS

• Learn the basics of node: asynchronous i/o, http.
• npm install -g learnyounode
• Advanced Node Setup
• For Windows: https://blog.risingstack.com/node-js-windows-10-tutorial
• For Mac/Linux:
  • Manage multiple Node versions with n npm install -g n
  • http://docs.python-guide.org/en/latest/starting/install/osx/
• Learn a web framework
• Hapi.JS npm install -g makemehapi http://hapijs.com/
• Express npm install -g expressworks http://expressjs.com/

Practice Best Practices

• Learn the best practices of writing clean JavaScript code.
• Run npm install -g js-best-practices
• Learn a unit testing framework
• Jasmine
  • Working Example: https://github.com/duluca/minimal-node-web-server/​
    • Run npm test
    • See specs folder for implementation
  • Helpful Resources
    • Spy Cheatsheet
    • How to Spy on JavaScript Methods

Web

• HTML 5
• http://www.w3schools.com/html/html5_intro.asp
• CSS 3
• http://www.w3schools.com/css/css3_intro.asp

UI Frameworks

• ReactJS https://facebook.github.io/react/

Learn Single Page Applications (SPAs)

• Legacy Angular.js https://angularjs.org/
• Angular 4 https://angular.io/
• Building Scalable and Beautiful AngularJS Apps Series: Learn how to properly architect front-end applications
• Leveraging Existing Skills and Pushing the Envelope
• Web App Packaging and Publishing Best Practices
• Organized Code and Scalable Angular Architecture
• Reusable Components, Templates, and Services
• Default Beauty and Great Mobile-First UX with Angular Material
• Navigation Lifecycle, Authentication Hooks, and Role Based Navigation
• Use npm modules and node-style require() in the browser with browserify.
  • npm install -g browserify-adventure

Persist Data

• Learn to use leveldb, a simple key/value store with a vibrant package.
• npm install -g levelmeup

Get the Full Stack Picture

• Check out The JavaScript Promise to understand benefits of working with full stack JavaScript and get access to batteries included open source projects to get your app idea out and running in the cloud.

Advanced JavaScript

• Learn how to use some features from ES6, the next version of JavaScript.
  • npm install -g count-to-6
• Understanding JavaScript Prototypes
  • npm install -g planetproto
• ES6 using Babel
  • npm install tower-of-babel -g
• An Intro to JavaScript ES6 Generators.
  • npm install -g learn-generators
• ES6 Iterators
  • npm install -g esnext-generation

Advanced Node

• Learn about Streams
  • npm install -g stream-adventure
• Learn to use the async package.
  • npm install -g async-you
• Gulp.js
  • http://gulpjs.com/
• Let's learn React.js and server side rendering!
  • npm install -g learnyoureact

Advanced SPAs & Web

• Sass
  • http://sass-lang.com/
• Find your way through the web performance optimization maze!
  • npm install -g perfschool

Advanced Data Persistence

• Learn about CouchDB - the database that completely embraces the web
  • npm install -g learnyoucouchdb
• Getting started with MongoDB and Node.js
  • Getting started with MongoDB and Node.js

Mobile Development

• Cordova https://cordova.apache.org/
• Ionic http://ionicframework.com/
• React Native https://facebook.github.io/react-native/