Front End Learning resources

1_getting_started_with_dev.md

Getting started with front-end development

Books should be available in Siili library, also in dead-trees format. Some of the sites are paywalled but worth it, so prefer these over free copies. If something is missing, please have it bought.

Thinking and concepts

• Responsive Web Design by A Book Apart
• Mobile First by A Book Apart
• Prototyping by Rosenfeld Media

Workflows and tools

• To get you started without scary tool installs and command line interface, you can use Prepros.io to play with modern web development workflow, packaged in one app.
• Mac is for web development, Linux is for web serving, and Windows is for testing web sites with Internet Explorer.
• Front-End tooling workflowsPresentation by Addy Osmani
• Sublime Text 3 or your favorite text editor.
• If are coming from back-end background, and really, really prefer an IDE type of environment, you could give Webstorm a try. If use IntelliJ Idea, you can use that. It gives you all that WebStorm does + the Java support.

Javascript

• Eloquent Javascript Good start if you have programming background.
• Codeschool Javascript Path
• Frontendmasters

HTML & CSS

• Codeschool HTML/CSS Path
• HTML5 for web designers
• CSS3 for web designers

SVG

• http://www.lukew.com/ff/entry.asp?1921

2_intermediate.md

Intermediate and advanced resources

• Chrome dev tools Video
• Javascript The Good Parts This is a classic, and a bit controversial, but a must-read nonetheless.
• Javascript allonge
• Secrets of javascript Ninja

3_Angular.md

Angular.js

• [https://www.youtube.com/watch?v=i9MHigUZKEM]
• [https://egghead.io/
• [http://www.amazon.com/Mastering-Web-Application-Development-AngularJS-ebook/dp/B00EQ67J30/ref=sr_1_8?ie=UTF8&qid=1407842895&sr=8-8&keywords=angular+js]
• [https://www.youtube.com/watch?v=i9MHigUZKEM]

3_Inforviz.md

Information visualization

D3.js has got a lot of exellent tutorials, that are a very good starting point.

• D3.js

###Books about Information visualization

• Envisioning Information, Edward R. Tufte
• Information Dashboard Design 2nd ed.
• Visual Display of Quantitative Information, Edward R. Tufte
• Visual Explanations, Edward R. Tufte
• Numbers in Graphic Design
• Visual Complexity
• Data Flow 1 and Data Flow 2
• Show me the numbers

3_styleguide.md

Living styleguides

3_Testing.md

Testing

Test-Driven-Development

• Write specifications, not scripts
• Introducing BDD
• Jasmine

Browser testing

• www.modern.ie project lets you test different IE versions with virtual machines.
• Virtual Box seems to work in this use lot better than the paid alternatives.

To be added

• Ruby / Middleman / Guard
• Node / Express / Gulp setup
• REST
• MEAN stack
• Ember.js
• websockets & real time web
• Intro to Preprosessing languages Haml, Jade, Slim, Sass, Stylus, Less, Coffeescrip
• TDD and BDD, Jasmine
• Style guides and component-based approach
• heroku / git

Large collection of JavaScript resources http://superherojs.com