# Learning Resources

* [HTML/CSS](#htmlcss)
* [JavaScript](#javascript)
  * [ES5](#es5)
  * [ES6 and Beyond](#es6-and-beyond)
* [NodeJS](#nodejs)
* [Devops](#devops)
* [Front-End Frameworks](#front-end-frameworks)
  * [Angular](#angular)
  * [React](#react)
  * [Other](#other)
* [Ruby/Rails](#rubyrails)
* [Workflow](#workflow)
  * [Tooling](#tooling)
* [Computer Science](#computer-science)
* [Paid General Resources](#paid-general-resources)
* [Interview Prep](#interview-prep)
* [Freelancing](#freelancing)
* [Other](#other)

## HTML/CSS

* Go small and create examples with interactive editors, like [Codepen](http://codepen.io). Then, embed them into your portfolio! Some ideas:
  * Create flags of the world using HTML/CSS or SVG
  * Create a responsive grid framework
  * Try duplicating [popular pens](http://codepen.io/pens/), or get inspiration to create your own masterpieces
* [DRY CSS](http://vanseodesign.com/css/dry-principles/)
* [HTML/CSS Style Guide by @mdo](http://codeguide.co/)
* Follow the [CSS Tricks](https://css-tricks.com) blog and try out new selectors. Some great CSS Tricks pages:
  * [Code Snippets](https://css-tricks.com/snippets/)
  * [CSS Selector and Property Almanac](https://css-tricks.com/almanac/)
* Additional CSS Frameworks
  * [Foundation](http://foundation.zurb.com/)
  * [Pure.css](http://purecss.io/)
  * [Skeleton](http://getskeleton.com/)
  * Make your own! Start small and build it up

## JavaScript

### ES5

* Videos
  * Watch this video on the JavaScript Event Loop. A **must** if you want to gain a deeper understanding of JavaScript
    * [What the heck is the event loop anyways?](https://www.youtube.com/watch?v=8aGhZQkoFbQ)
  * [FunFunFunction's JavaScript videos](https://www.youtube.com/channel/UCO1cgjhGzsSYb1rsB4bFe4Q)
  * [JSConf - JavaScript conference videos](https://www.youtube.com/user/jsconfeu)
* [You Don't Know JS](https://github.com/getify/You-Dont-Know-JS) - This series will elevate your JavaScript knowledge to a new level
* [Understanding 'this'](https://journeyintojavascript.quora.com/understanding-this-once-and-for-all)
* Articles with JavaScript must-knows
  * [CodeMentor: Top 10 JavaScript Must-Knows](https://www.codementor.io/javascript/tutorial/top-ten-things-beginners-must-know-javascript)
  * [10 Interview Questions Ever JS Developer Should Know](https://medium.com/javascript-scene/10-interview-questions-every-javascript-developer-should-know-6fa6bdf5ad95)
* [Javascript for Kids](https://www.amazon.com/JavaScript-Kids-Playful-Introduction-Programming/dp/1593274084) (PDF [here](http://www.r-5.org/files/books/computers/overviews/for-kids/Nick_Morgan-JavaScript_for_Kids-EN.pdf))
* [Javascript: The Good Parts](https://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742) (PDF [here](https://github.com/NorthPaulo/research/blob/master/Frontend-books%26research/JavaScript%20-%20The%20Good%20Parts%20-%20Douglas%20Crockford%20-%20May%202008.pdf))
* [Eloquent Javascript](https://www.amazon.com/Eloquent-JavaScript-Modern-Introduction-Programming/dp/1593272820) (PDF [here](https://eloquentjavascript.net/Eloquent_JavaScript.pdf))
* [Javascrip30](https://javascript30.com/) (Or really any course by wes bos.)

### ES6 and Beyond

* [TypeScript](http://www.typescriptlang.org/)
* [ES6 Features](https://github.com/lukehoban/es6features) - ES6 becoming more and more prevalent, so become familiar with it
* [Learn ES6 w/Egghead.io (free)](https://egghead.io/courses/learn-es6-ecmascript-2015)

## NodeJS

* [NodeSchool](http://nodeschool.io/) - Learn more about Node I/O, modules, and streams. Amazing examples, 10/10.
* [Node Hackathon Starter](https://github.com/sahat/hackathon-starter) - Auth + API examples + test suite, **out of the box**. Great for quick projects
* Microservices: Creating isolated applications that perform single tasks. Basically, they're Express applications that are simple and well-defined, with a couple routes.
  * [Intro to Microservices](https://auth0.com/blog/an-introduction-to-microservices-part-1/)
  * FreeCodeCamp microservice projects (note that these are open-ended projects, not tutorials)
    * [Timestamp Microservice](https://www.freecodecamp.com/challenges/timestamp-microservice)
    * [Request Header Parser Microservice](https://www.freecodecamp.com/challenges/request-header-parser-microservice)
    * [URL Shortener Microservice](https://www.freecodecamp.com/challenges/url-shortener-microservice)
    * [File Metadata Microservice](https://www.freecodecamp.com/challenges/file-metadata-microservice)

## Devops

* [Amazon Web Services](https://aws.amazon.com/) - AWS provides a 12-month free tier for getting started with cloud services, as well as a plethora of documentation for using their services
  * [Deploying a MEAN app to EC2](https://scotch.io/tutorials/deploying-a-mean-app-to-amazon-ec2-part-1)
  * [Using S3 for image uploads](https://devcenter.heroku.com/articles/s3)
* [Docker](https://www.docker.com/) - Docker is a tool for deploying applications in sandboxed containers, which provide a level of isolation between applications
  * [Getting started tutorial](http://www.docker.io/gettingstarted/#h_tutorial)
* [Heroku Application Architecture](https://devcenter.heroku.com/categories/application-architecture) - note that a lot of these concepts exist in AWS and elsewhere
  * [Scheduled jobs](https://devcenter.heroku.com/articles/scheduled-jobs-custom-clock-processes)

## Front-End Frameworks

### Angular

* [Angular Fundamentals w/Egghead.io (free)](https://egghead.io/courses/angularjs-app-from-scratch-getting-started)
* Angular 1.x Testing
  * [Unit and End-to-End Testing](http://www.sitepoint.com/unit-and-e2e-testing-in-angularjs/)
* [Angular 2](https://angular.io/)

### React

* [React Fundamentals w/Egghead.io (free)](https://egghead.io/courses/react-fundamentals)
* [React + Redux w/Egghead.io (free)](https://egghead.io/courses/getting-started-with-redux)
* [create-react-app](https://facebook.github.io/react/blog/2016/07/22/create-apps-with-no-configuration.html)

### More

* [D3](http://d3js.org/)
* [Ember](http://emberjs.com/)
* [Backbone](http://backbonejs.org/)
* [Knockout](http://knockoutjs.com/)

## Ruby/Rails

* [Rails Casts](http://railscasts.com/)
* [Rails Deep Dive](https://leanpub.com/ddr)
* [Rails Guide (always invaluable)](http://guides.rubyonrails.org/)
* Sinatra, an Express-like framework for Ruby
  * [Sinatra Homepage](http://www.sinatrarb.com/)
  * [Sinatra Tutorials](http://www.rubyinside.com/sinatra-29-links-and-resources-for-a-quicker-easier-way-to-build-webapps-1371.html)

## Workflow

Increasing Development Speed

* [Touch typing](http://typing.lk/)
* [Programming language typing](https://typing.io/)
* Nerd out on some VS Code extensions like [these ones](https://blog.bitsrc.io/16-unique-vscode-extensions-every-developer-should-have-in-2020-c4dcdb74506a)
* [Sublime Shortcuts](http://docs.sublimetext.info/en/latest/reference/keyboard_shortcuts_osx.html)
* Many people swear by VIM as their text editor (due to keyboard shortcuts)
  * [Learn vim](http://www.openvim.com/)
* [Dash (documentation plugin)](https://kapeli.com/dash)
  * [Dash Sublime plugin](https://github.com/farcaller/DashDoc)
* Sublime plugins (`COMMAND + SHIFT + P`, to bring up this up in Sublime)
  * AngularJS
  * SASS
  * Babel
  * EJS
  * Bootstrap 3 Snippets
  * BracketHighlighter
  * Color Highlighter
  * ColorPicker
  * EditorConfig
  * Emmet
  * JSX
  * Jade
  * Markdown Preview
  * [More at Package Control](https://packagecontrol.io/)

### Tooling

* [Review and refine git branching](http://pcottle.github.io/learnGitBranching/)
* [Practical git for everyday professional use w/Egghead.io (free)](https://egghead.io/courses/practical-git-for-everyday-professional-use)
* [Beginner's Guide to Webpack](https://medium.com/@dabit3/beginner-s-guide-to-webpack-b1f1a3638460#.8wrecbpev) - module bundling for front-end dependencies
* [Setting up Babel (ES6) with Node](https://babeljs.io/docs/setup)

## Computer Science

* [The Idiots Guide to Big O](http://www.corejavainterviewquestions.com/idiots-guide-big-o/)
* [Big O Cheat sheet for data structures and algorithms](http://bigocheatsheet.com/)
* [Data Structures Video Series](https://www.youtube.com/watch?v=92S4zgXN17o\&list=PL2_aWCzGMAwI3W_JlcBbtYTwiQSsOTa6P)
* [VisuAlgo](http://visualgo.net/) - data structure and algorithm visualizations
* [Learn2Sort](https://learn2sort.herokuapp.com/) (Make a PR to add a new sort to this app [here](https://github.com/TaylorDarneille/learn2sort))
* [Grokking Algorithms](https://www.amazon.com/Grokking-Algorithms-illustrated-programmers-curious/dp/1617292230)

## Paid General Resources

These are some great educational resources for continued learning. Note that these are paid resources

* [Egghead.io - videos](https://egghead.io)
* [PluralSight - videos](https://www.pluralsight.com/browse/software-development)
* [Treehouse - videos](https://teamtreehouse.com/)
* [CodeSchool - videos](https://www.codeschool.com/)
* [Safari Books](https://www.safaribooksonline.com/home/)
  * Free if you have a Seattle Public Library card
  * Basically the entire tech section in a bookstore

## Interview Prep

* Review your Github and be able to explain your coding choices
  * This may involve cleaning up previous assignments/projects by fixing bugs, improving styling, and making sure things are deployed
* Review the [interview questions assignment](https://github.com/WDI-SEA/interview-questions).
* Review other common interview questions. Make sure that if you are **interviewing for a specific role or set of technologies**, that you find interview questions on those technologies. For example, a Rails job will require you to know more about Ruby and Rails. A front-end job will require you to know more about HTML/CSS/JavaScript.
  * [Glassdoor](http://www.glassdoor.com/Interview/index.htm) (look up the company you're applying for)
* Practice coding challenges and whiteboarding
  * [Hackerrank](https://www.hackerrank.com/)
  * [Code Wars](https://www.codewars.com/)
  * [Coder Byte (first few are free)](http://www.coderbyte.com/)

## Freelancing

Note that if you're freelancing, it may involve writing contracts, managing money coming in/out, pricing yourself, etc. Here are some links that may come in handy.

* [Bonsai - contracts, invoicing, and payments](https://www.hellobonsai.com/)
* [Wave - small business accounting and invoices](https://www.waveapps.com/)
* [Toggl - time tracking software](https://toggl.com/)
* [Trello - tracking projects](https://trello.com/)
* [Treehouse - learn Wordpress in order to create a CMS for clients](http://teamtreehouse.com/)

## Other

* [Syntax Podcast](https://syntax.fm/)
* Subscribe to [FreeCodeCamp](https://www.freecodecamp.org/news/)'s Newsletter