├── .gitignore └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | ~* 3 | *.bak 4 | *.tmp 5 | *.log 6 | node_modules/ 7 | npm-debug.log 8 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Learning Front End Development 2 | I find I get asked a lot about how to learn more front end development. I wanted to put together a good list of resources that can help get someone started. 3 | 4 | Pull requests welcomed! 5 | 6 | ##Web Theory 7 | - [A Dao of Web Design](http://alistapart.com/article/dao) 8 | - [Responsive Web Design](http://alistapart.com/article/responsive-web-design) 9 | - [Web Field Manual](http://webfieldmanual.com/) 10 | 11 | ##HTML 12 | HyperText Markup Language, commonly referred to as HTML, is the standard markup language used to create web pages. 13 | 14 | ###Articles 15 | - [HTML5 Semantics](http://www.smashingmagazine.com/2011/11/html5-semantics/) 16 | 17 | ###Tools 18 | - [Modernizr](https://modernizr.com/) 19 | 20 | 21 | ##CSS 22 | Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language. 23 | 24 | ###Preprocessors 25 | ####[SASS](http://sass-lang.com/) 26 | - [Getting Started with Sass](https://scotch.io/tutorials/getting-started-with-sass) 27 | - [How to start using Sass and Compass in 10 minutes](https://blog.gaya.ninja/articles/how-to-start-using-sass-and-compass-in-10-minutes/) 28 | - [SassySass](http://www.sassysass.com/) 29 | - [SassyClean](https://github.com/ryanburgess/grunt-sassyclean) 30 | - [Sass Style Guide](http://css-tricks.com/sass-style-guide/) 31 | - [MetaFizzy Effect with Sass](http://css-tricks.com/metafizzy-effect-with-sass/) 32 | - [Conditional Media Query Mixins](http://css-tricks.com/conditional-media-query-mixins/) 33 | - [Making Sass talk to JavaScript with JSON](http://css-tricks.com/making-sass-talk-to-javascript-with-json/) 34 | - [Is Libsass, the lightning fast Sass compiler ready for prime time?](http://benfrain.com/libsass-lightning-fast-sass-compiler-ready-prime-time/) 35 | 36 | ####[LESS](http://lesscss.org/) 37 | 38 | ####[Stylus](https://learnboost.github.io/stylus/) 39 | 40 | ####[Myth](http://www.myth.io/) 41 | 42 | ###Postprocessors 43 | 44 | ####[PostCSS](https://github.com/postcss/postcss) 45 | 46 | ####[pleeease](http://pleeease.io/) 47 | 48 | ###Articles 49 | - [Preventing the Performance Hit from Custom Fonts](http://css-tricks.com/preventing-the-performance-hit-from-custom-fonts/) 50 | - [Why Responsive Images Is So Hard](https://www.readability.com/articles/paaucghp) 51 | - [In Defense Of Rem Units](http://techtime.getharvest.com/blog/in-defense-of-rem-units) 52 | - [Bandwidth Media Queries? We Don’t Need ’Em!](http://mobile.smashingmagazine.com/2013/01/09/bandwidth-media-queries-we-dont-need-em/) 53 | - [CSS-Only Responsive Layout with Smooth Transitions](http://tympanus.net/codrops/2012/06/12/css-only-responsive-layout-with-smooth-transitions/) 54 | - [Styling your apps with Twitter Bootstrap](http://www.adobe.com/devnet/html5/articles/twitter-bootstrap.html) 55 | - [Animating SVG CSS](http://css-tricks.com/animating-svg-css/) 56 | 57 | ###Architecture 58 | - [SMACSS](http://smacss.com) 59 | - [BEM](https://en.bem.info/method/) 60 | - [Atomic Design](http://bradfrost.com/blog/post/atomic-web-design/) 61 | 62 | ###Tools 63 | - [Normalize.css](http://nicolasgallagher.com/about-normalize-css/) 64 | 65 | 66 | ##JavaScript 67 | JavaScript is a high-level, dynamic, untyped, and interpreted programming language. 68 | 69 | ###Articles 70 | - [JavaScript the right way](http://jstherightway.org/) 71 | - [Getting Over jQuery](http://blog.ponyfoo.com/2013/07/09/getting-over-jquery) 72 | - [You Might Not Need jQuery](http://youmightnotneedjquery.com/) 73 | - [A Dive Into Plain JavaScript](http://blog.adtile.me/2014/01/16/a-dive-into-plain-javascript/) 74 | - [Understanding JavaScript OOP](http://robotlolita.github.io/2011/10/09/understanding-javascript-oop.html) 75 | - [A Deeper Look at Objects in JavaScript](http://www.kirupa.com/html5/a_deeper_look_at_objects_in_javascript.htm) 76 | - [Deploying JavaScript Applications](https://alexsexton.com/blog/2013/03/deploying-javascript-applications/) 77 | - [Revisiting JavaScript Objects](http://www.laktek.com/2012/12/29/revisiting-javascript-objects/) 78 | - [Learning JavaScript Design Patterns](http://addyosmani.com/resources/essentialjsdesignpatterns/book/#factorypatternjavascript) 79 | - [Journey Through The JavaScript MVC Jungle](http://coding.smashingmagazine.com/2012/07/27/journey-through-the-javascript-mvc-jungle/) 80 | - [Best Practices When Working With JavaScript Templates](http://code.tutsplus.com/tutorials/best-practices-when-working-with-javascript-templates--net-28364) 81 | - [Object properties in JavaScript](http://www.2ality.com/2012/10/javascript-properties.html) 82 | - [JavaScript Garden](http://bonsaiden.github.io/JavaScript-Garden/) 83 | - [Codecademy Self-Paced JavaScript Course](http://www.codecademy.com/tracks/javascript) 84 | - [Speaking JavaScript](http://speakingjs.com/es5/index.html) 85 | - [Debugging Asynchronous JavaScript with Chrome DevTools](http://www.html5rocks.com/en/tutorials/developertools/async-call-stack/) 86 | - [Choosing a JS Framework](http://todomvc.com/) 87 | 88 | ###Books 89 | - [Eloquent JavaScript](http://eloquentjavascript.net/) 90 | - [Learning JavaScript Design Patterns](http://www.addyosmani.com/resources/essentialjsdesignpatterns/book/) 91 | - [You Don't Know JS](https://github.com/getify/You-Dont-Know-JS) 92 | - [Up & Going](https://github.com/getify/You-Dont-Know-JS/blob/master/up%20&%20going/README.md#you-dont-know-js-up--going) 93 | - [Scope & Closure](https://github.com/getify/You-Dont-Know-JS/blob/master/scope%20&%20closures/README.md#you-dont-know-js-scope--closures) 94 | - [this & Object Prototypes](https://github.com/getify/You-Dont-Know-JS/blob/master/this%20&%20object%20prototypes/README.md#you-dont-know-js-this--object-prototypes) 95 | - [Types & Grammar](https://github.com/getify/You-Dont-Know-JS/blob/master/types%20&%20grammar/README.md#you-dont-know-js-types--grammar) 96 | - [Async & Performance](https://github.com/getify/You-Dont-Know-JS/blob/master/async%20&%20performance/README.md#you-dont-know-js-async--performance) 97 | - [JavaScript Allongé](https://leanpub.com/javascriptallongesix) 98 | 99 | 100 | ###Frameworks 101 | ####[React](http://facebook.github.io/react/) 102 | - [Learning React.js: Getting Started and Concepts](https://scotch.io/tutorials/learning-react-getting-started-and-concepts) 103 | - [http://ryanclark.me/getting-started-with-react/](http://ryanclark.me/getting-started-with-react/) 104 | - [Falcor: Simplifying Your Data (video)](https://www.youtube.com/watch?v=nCksc3tdM-A) 105 | - [6 Reasons Why We Love React.js](https://www.syncano.io/blog/reactjs-reasons-why-part-1/) 106 | 107 | ####[Backbone.js](http://backbonejs.org/) 108 | - [Getting Started with Backbone.js](http://code.tutsplus.com/tutorials/getting-started-with-backbone-js--net-19751) 109 | - [Backbone.js Tips And Patterns](http://coding.smashingmagazine.com/2013/08/09/backbone-js-tips-patterns/) 110 | - [Developing Backbone.js Applications](http://addyosmani.github.io/backbone-fundamentals/) 111 | 112 | ####[Angular.js](https://angularjs.org/) 113 | - [How to Learn AngularJS - Your AngularJS Sherpa](http://www.ng-newsletter.com/posts/how-to-learn-angular.html) 114 | - [Building a Web App From Scratch in AngularJS](http://code.tutsplus.com/tutorials/building-a-web-app-from-scratch-in-angularjs--net-32944) 115 | - [AngularJS Tutorial: Learn to Build Modern Web Apps](http://www.thinkster.io/angularjs/GUIDJbpIie/angularjs-tutorial-learn-to-build-modern-web-apps) 116 | 117 | ####[Ember.js](http://emberjs.com/) 118 | - [An In-Depth Introduction To Ember.js](http://coding.smashingmagazine.com/2013/11/07/an-in-depth-introduction-to-ember-js/) 119 | - [Flame on! A beginner's guide to Ember.js](http://www.adobe.com/devnet/html5/articles/flame-on-a-beginners-guide-to-emberjs.html) 120 | 121 | ####[Polymer](https://www.polymer-project.org/) 122 | 123 | ####[jQuery](https://jquery.com/) 124 | - [A guide to the basics of jQuery](http://jqfundamentals.com/) 125 | - [Learning jQuery](http://www.learningjquery.com/) 126 | 127 | ####[Meteor](https://www.meteor.com/) 128 | - [Learn Meteor Fundamentals and Best Practices](http://andrewscala.com/meteor/) 129 | - [Writing your first Meteor application](http://sebastiandahlgren.se/2013/07/17/tutorial-writing-your-first-metor-application/) 130 | - [Design a Complete Authentication System with Meteor](https://waaave.com/tutorial/meteor/design-a-complete-authentication-system-with-meteor/) 131 | - [Building a customized accounts UI for Meteor](http://blog.benmcmahen.com/post/41741539120/building-a-customized-accounts-ui-for-meteor) 132 | 133 | ####[Knockout](http://knockoutjs.com/) 134 | - [Introducing Knockout, a UI library for JavaScript](http://blog.stevensanderson.com/2010/07/05/introducing-knockout-a-ui-library-for-javascript/) 135 | 136 | 137 | ##Node.js 138 | As an asynchronous event driven framework, Node.js is designed to build scalable network applications. 139 | 140 | ###Articles 141 | - [Node.js for beginners](http://code.tutsplus.com/tutorials/nodejs-for-beginners--net-26314) 142 | - [Node.js Best Practices](http://blog.risingstack.com/node-js-best-practices/) 143 | - [Why use Node](http://www.toptal.com/nodejs/why-the-hell-would-i-use-node-js) 144 | - [Node Control Flow](http://book.mixu.net/node/ch7.html) 145 | - [Why use closures](http://howtonode.org/why-use-closure) 146 | - [Node Best Practices](http://blog.risingstack.com/node-js-best-practices/) 147 | - [Error Handling in Node](http://www.joyent.com/developers/node/design/errors) 148 | - [Awesome Node resources](https://github.com/sindresorhus/awesome-nodejs) 149 | - [Node.js async in practice: When to use what?](http://www.sebastianseilund.com/nodejs-async-in-practice) 150 | - [Using $scope.$watch and $scope.$apply](http://stackoverflow.com/questions/15112584/using-scope-watch-and-scope-apply) 151 | - [Felix's Node.js Style Guide](http://nodeguide.com/style.html) 152 | - [Real Time Web Analytics with Node.js and Socket.IO](http://coenraets.org/blog/2012/10/real-time-web-analytics-with-node-js-and-socket-io/) 153 | - [Node RESTful API Authentication](http://stackoverflow.com/questions/14572600/passport-js-restful-auth) 154 | - [Projects, Applications, and Companies Using Node (great reference material)](https://github.com/joyent/node/wiki/Projects,-Applications,-and-Companies-Using-Node) 155 | - [Full stack javascript with MEAN and Yeoman](http://addyosmani.com/blog/full-stack-javascript-with-mean-and-yeoman/) 156 | - [MEAN.js](https://github.com/meanjs/mean) 157 | - [RisingStack Node.js Style Guide](https://github.com/RisingStack/node-style-guide) 158 | 159 | ###Videos 160 | - [Node explained (video)](https://www.youtube.com/watch?v=L0pjVcIsU6A) 161 | 162 | ###Tutorials 163 | - [Node School](http://nodeschool.io/) 164 | - [Node Async Tutorial](http://justinklemm.com/node-js-async-tutorial/) 165 | 166 | ###Frameworks 167 | - [Express](http://expressjs.com/) 168 | - [Hapi](http://hapijs.com/) 169 | - [Restify](http://restify.com/) 170 | 171 | ###Templating 172 | - [Dust](http://www.dustjs.com/) 173 | - [Jade](http://jade-lang.com/) 174 | - [Handlebars](http://handlebarsjs.com/) 175 | 176 | ###Architecture 177 | - [Hackathon Starter](https://github.com/sahat/hackathon-starter) 178 | - [Boilerplate (barebones)](https://github.com/JonathanZWhite/node-boilerplate) 179 | 180 | ##JavaScript Testing 181 | - [Mocha](https://mochajs.org/) 182 | - [Karma](http://karma-runner.github.io/) 183 | - [Arrow](https://github.com/yahoo/arrow) 184 | - [Jasmine](http://jasmine.github.io/) 185 | 186 | ##Accessibility 187 | ###Articles 188 | - [Using WAI-ARIA Landmarks – 2013](http://blog.paciellogroup.com/2013/02/using-wai-aria-landmarks-2013/) 189 | - [Coding Towards Accessibility](http://24ways.org/2013/coding-towards-accessibility/) 190 | - [Using the HTML title attribute](http://blog.paciellogroup.com/2013/01/using-the-html-title-attribute-updated/) 191 | - [HTML5 Accessibility Chops: notes on using ARIA](http://blog.paciellogroup.com/2012/06/html5-accessibility-chops-using-aria-notes/) 192 | - [Fixing “Skip to content” links](http://www.nczonline.net/blog/2013/01/15/fixing-skip-to-content-links/) 193 | - [Using the HTML title attribute](http://blog.paciellogroup.com/2010/11/using-the-html-title-attribute/) 194 | - [Accessibility and Building a web for everyone because sometimes it's not all about us](http://negativitysandwiches.com/accessibility-and-building-a-web-for-everyone-because-sometimes-its-not-all-about-us/) 195 | - [Easy Checks for Website Accessibility](http://www.sitepoint.com/easy-checks-website-accessibility/) 196 | - [Ethical Dilemmas in Web Accessibility](http://www.sitepoint.com/ethical-dilemmas-web-accessibility/) 197 | 198 | ##Tools 199 | ###[Git](https://git-scm.com/documentation) 200 | - [Git tips from the trenches](https://ochronus.com/git-tips-from-the-trenches/) 201 | - [Git for Grown-ups](http://24ways.org/2013/git-for-grownups/) 202 | - [Get Started With GitHub Pages](http://24ways.org/2013/get-started-with-github-pages/) 203 | - [The Git Parable](http://tom.preston-werner.com/2009/05/19/the-git-parable.html) 204 | - [A Successful Git Branching Model](http://nvie.com/posts/a-successful-git-branching-model/) 205 | - [A simple Git deployment strategy for static sites](http://nicolasgallagher.com/simple-git-deployment-strategy-for-static-sites/) 206 | - [How to Deal with Merge Conflicts in Git](http://css-tricks.com/deal-merge-conflicts-git/) 207 | 208 | ###[Sublime](http://www.sublimetext.com/) 209 | - [Best of Sublime Text 3: Features, Plugins, and Settings](http://scotch.io/bar-talk/best-of-sublime-text-3-features-plugins-and-settings) 210 | - [AngularJS - AngularJS code completion, snippets, go to definition, quick panel search, and more.](https://sublime.wbond.net/packages/AngularJS) 211 | - [SublimeLinter-jshint - SublimeLinter plugin for JavaScript, using jshint.](https://sublime.wbond.net/packages/SublimeLinter-jshint) 212 | - [SublimeLinter-jsxhint - SublimeLinter 3 plugin for JSX (React.js), using jsxhint.](https://sublime.wbond.net/packages/SublimeLinter-jsxhint) 213 | - [Setting up the .subl command in terminal](http://stackoverflow.com/questions/10196449/installing-sublime-texts-command-line-tool-subl-in-terminal-permission-denie) 214 | - [HTMLBeautify - A plugin for Sublime Text that formats (indents) HTML source code. It makes code easier for humans to read.](https://sublime.wbond.net/packages/HTMLBeautify) 215 | - [JavascriptBeautify - js-beautify for sublime](https://sublime.wbond.net/packages/Javascript%20Beautify) 216 | - [JSX - Language Definitions for JSX files.](https://sublime.wbond.net/packages/JSX) 217 | - [LESS - LESS syntax highlighting for Sublime Text.](https://sublime.wbond.net/packages/LESS) 218 | - [NodeJS - nodejs snippets and bindings for Sublime Text 2](https://sublime.wbond.net/packages/Nodejs) 219 | - [Package Control - A full-featured package manager](https://sublime.wbond.net/packages/Package%20Control) 220 | - [Predawn - Predawn is a dark interface and syntax theme for Sublime Text.](https://sublime.wbond.net/packages/Predawn) 221 | - [Sublime Linter - Interactive code linting framework for Sublime Text 3](https://sublime.wbond.net/packages/SublimeLinter) 222 | - [SublimeLinter-javac - SublimeLinter 3 plugin for Java, using javac -Xlint.](https://sublime.wbond.net/packages/SublimeLinter-javac) 223 | 224 | 225 | ###[Atom](http://www.sublimetext.com/) 226 | 227 | ###[Vim](http://www.vim.org/) 228 | - [VIM Adventures](http://vim-adventures.com/) 229 | - [MacVim](https://github.com/macvim-dev/macvim)* 230 | - [Maximum Awesome](https://github.com/square/maximum-awesome) 231 | - [The NERD Tree](https://github.com/scrooloose/nerdtree) 232 | 233 | ###[Grunt](http://gruntjs.com/) 234 | - [Writing an awesome build script with Grunt](http://www.sitepoint.com/writing-awesome-build-script-grunt/) 235 | - [Grunt for People Who Think Things Like Grunt are Weird and Hard](http://24ways.org/2013/grunt-is-not-weird-and-hard/) 236 | - [Setting up Sass with Grunt](http://culttt.com/2013/11/18/setting-sass-grunt/) 237 | - [Grunt.js Workflow](http://merrickchristensen.com/articles/gruntjs-workflow.html) 238 | - [Grunt And Gulp Tasks For Performance Optimization](http://yeoman.io/blog/performance-optimization.html) 239 | - [Getting started with Grunticon](http://blog.iconfinder.com/get-started-with-grunticon/) 240 | 241 | ###[Gulp](http://gulpjs.com/) 242 | - [An Introduction to Gulp.js](http://www.sitepoint.com/introduction-gulp-js/) 243 | - [Managing Your Build Tasks With Gulp.js](http://code.tutsplus.com/tutorials/managing-your-build-tasks-with-gulpjs--net-36910) 244 | - [Quick intro to Gulp.js](http://www.codefellows.org/blogs/quick-intro-to-gulp-js) 245 | 246 | ###[Webpack](https://webpack.github.io/) 247 | 248 | ###[npm](https://www.npmjs.com/) 249 | 250 | ###[Bower](http://bower.io/) 251 | 252 | ###[Yeoman](http://yeoman.io/) 253 | 254 | ###[iTerm 2](https://www.iterm2.com/) 255 | 256 | ###[tmux](https://tmux.github.io/) 257 | 258 | ###[Homebrew](http://brew.sh/) 259 | 260 | \* Can be installed with Homebrew 261 | 262 | ##Resource sites 263 | - [Hacker News](https://news.ycombinator.com/) 264 | - [Smashing Magazine](http://www.smashingmagazine.com/) 265 | - [CSS Tricks](https://css-tricks.com/) 266 | - [Code Responsible](https://coderesponsible.com/) 267 | - [Hack Hands](https://hackhands.com) 268 | - [1st Web Designer](http://www.1stwebdesigner.com/) 269 | 270 | 271 | ##Podcasts 272 | - [JS Jabber](https://devchat.tv/js-jabber) 273 | - [Shop Talk](http://shoptalkshow.com/) 274 | - [The Changelog](https://changelog.com/podcast/) 275 | - [Node Up](http://nodeup.com/) 276 | - [Ruby Rogues](https://devchat.tv/ruby-rogues/) 277 | - [The Big Web Show](http://5by5.tv/bigwebshow/) 278 | - [Boagworld](https://boagworld.com/show/) 279 | - [The Web Ahead](http://5by5.tv/webahead) 280 | - [FiveJS](https://fivejs.codeschool.com/) 281 | 282 | ##Influencers 283 | 284 | ###Who to follow on Twitter 285 | - [@paul_irish](http://twitter.com/paul_irish) 286 | - [@csswizardry](https://twitter.com/csswizardry) 287 | - [@substack](https://twitter.com/substack) 288 | - [@aarron](https://twitter.com/aarron) 289 | - [@SaraSoueidan](https://twitter.com/SaraSoueidan) 290 | - [@trevnorris](https://twitter.com/trevnorris) 291 | - [@brad_frost](https://twitter.com/brad_frost) 292 | - [@sebmck](https://twitter.com/sebmck) 293 | - [@codepo8](https://twitter.com/codepo8) 294 | - [@aerotwist](https://twitter.com/aerotwist) 295 | - [@LeaVerou](https://twitter.com/LeaVerou) 296 | - [@davidwalshblog](https://twitter.com/davidwalshblog) 297 | - [@Souders](https://twitter.com/Souders) 298 | - [@floydophone](https://twitter.com/floydophone) 299 | - [@nikmd23](https://twitter.com/nikmd23) 300 | - [@nickla](https://twitter.com/nickla) 301 | - [@jina](https://twitter.com/jina) 302 | - [@chriscoyier](https://twitter.com/chriscoyier) 303 | - [@mjackson](https://twitter.com/mjackson) 304 | - [@zeldman](https://twitter.com/zeldman) 305 | - [@LeaVerou](https://twitter.com/LeaVerou) 306 | - [@feather](https://twitter.com/feather) 307 | - [@rem](https://twitter.com/rem) 308 | - [@getify](https://twitter.com/getify) 309 | 310 | ###Who to follow on Github 311 | - [@petehunt](https://github.com/petehunt) 312 | - [@paulirish](https://github.com/paulirish) 313 | - [@bradfrost](https://github.com/bradfrost) 314 | - [@codepo8](https://github.com/codepo8) 315 | - [@mdo](https://github.com/mdo) 316 | - [@sindresorhus](https://github.com/sindresorhus) 317 | - [@substack](https://github.com/substack) 318 | - [@addyosmani](https://github.com/addyosmani) 319 | - [@tj](https://github.com/tj) 320 | - [@chriscoyier](https://github.com/chriscoyier) 321 | - [@LeaVerou](https://github.com/LeaVerou) 322 | - [@remy](https://github.com/remy) 323 | 324 | 325 | ##Conferences 326 | - [CSS DevConf](http://cssdevconf.com) 327 | - [Fluent](http://conferences.oreilly.com/fluent/javascript-html-us) 328 | - [Forward JS](http://forwardjs.com/) 329 | - [JS Conf](http://jsconf.com/) 330 | - [React Rally](http://www.reactrally.com/) 331 | - [Node Summit](http://nodesummit.com/) 332 | - [MozCon](https://moz.com/mozcon) 333 | 334 | 335 | ##Learning sites 336 | - [Frontend Masters](https://frontendmasters.com/) 337 | - [Pluralsight](https://www.pluralsight.com/) 338 | - [Lynda](http://www.lynda.com/) 339 | 340 | ##Proposed Learning Track & Tips 341 | - These resources are meant to be completed sequentially 342 | - Some resources will be very short to read and/or complete while others could take 1 - 3 months (e.g. Eloquent Javascript) 343 | - After each HTML, CSS, or Javascript resource, build a project to flex your coding muscles and put your skills to action 344 | 345 | ###Tips 346 | - Take notes when learning new concepts and revisit notes weekly 347 | - Create flashcards of javascript syntax and commonly used design patterns 348 | - Learn the history of the web and javscript [here](https://www.youtube.com/watch?v=JxAXlJEmNMg&list=PL7664379246A246CB) 349 | - Do not get discouraged if you do not understand a concept immediately, just take a break and reread/retry in 5 minutes 350 | - Attend Meetups and volunteer your time to any interesting projects 351 | - Never stop learning 352 | 353 | | Resource | Subject | Descripton | 354 | | ---| ---| --- | 355 | | [HTML & CSS Overview](http://learn.shayhowe.com/) | HTML/CSS| Substantial Overview of HTML & CSS | 356 | | [30 CSS Selectors](http://code.tutsplus.com/tutorials/the-30-css-selectors-you-must-memorize--net-16048) | CSS | Overview of CSS Selectors | 357 | | [Finish HTML & CSS Sections](http://freecodecamp.com)| HTML/CSS| Compelete CSS & HTML Sections of FreeCode Camp| 358 | | [Command Line Introduction](http://cli.learncodethehardway.org/book/) | Bash | Introduction to Bash | 359 | | [GitBook](https://git-scm.com/book/en/v2)| Git/Github | Read Chapter 1 - 6 | 360 | | [Eloquent Javascript](http://eloquentjavascript.net/) | Javascript | Read and complete exercises chapters 1 -20, read chapter 21 | 361 | | [Companion Notes to Eloquent Javascript](http://watchandcode.com/courses/eloquent-javascript-the-annotated-version) | Javascript | Chapter 5 - 8 can be diffcult this course offers notes to these chapters | 362 | | [SASS Introduction](http://sass-lang.com/documentation/file.SASS_REFERENCE.html) | SASS | Begin Using SASS | 363 | | [Modular SASS/CSS](http://vanseodesign.com/css/smacss-introduction/Z) | CSS | Begin using SMACSS for modular/organized styling | 364 | | [Node.js For Front End](http://jsforallof.us/2015/02/12/utilising-node-and-npm-for-front-end-development-workflow/)| Node.js | Intro to Node.js for front end | 365 | | [NPM](http://www.sitepoint.com/beginners-guide-node-package-manager/)| Build Tools | Introduction to Node Package Manager | 366 | | [Browserify](https://github.com/substack/browserify-handbook) | Build Tools | Introduction to Browserify | 367 | | [Gulp](http://gulpjs.com/) | Build Tools | Introduction to Gulp | 368 | | [React.js](https://facebook.github.io/react/) | Library | Introduction to React JS View Library | 369 | | [Jasmine](http://jasmine.github.io/2.4/introduction.html) | Testing | Introduction to testing frameworks | 370 | | [ESLint](http://eslint.org/) | Build Tools | Utilize javascript linters | 371 | | [Performance Fundamentals](https://developers.google.com/web/fundamentals/performance/) | Performance | Learn how webpages are rendered | 372 | | [ES6](https://babeljs.io/docs/learn-es2015/) | Javascript | Learn ES6/ES2015 | 373 | | [Babel](https://babeljs.io/) | Build Tools | Turns your ES6 code to ES5 code | 374 | | [JS Design Patterns](https://addyosmani.com/resources/essentialjsdesignpatterns/book/) | Javascript | Introduction to Common Design Patterns | 375 | | [JS Tooling](https://www.manning.com/books/javascript-application-design) | Build Tools | Overview of what tools need to be put into place to create a full fledged app | 376 | | [Single Page Application Overview](http://singlepageappbook.com/) | Architecture | Overview of Design of a traditional SPA | 377 | 378 | 379 | ## Contributing 380 | 1. Fork it 381 | 2. Create your feature branch (`git checkout -b my-new-feature`) 382 | 3. Commit your changes (`git commit -am 'Add some feature'`) 383 | 4. Push to the branch (`git push origin my-new-feature`) 384 | 5. Create new Pull Request 385 | --------------------------------------------------------------------------------