Cody Lindley

Front-end Developer Handbook 2017

b3714769440has quoted4 months ago
Don't learn jQuery, learn the DOM. Don't learn SASS, learn CSS. Don't learn HAML, learn HTML. Don't learn CoffeeScript, learn JavaScript. Don't learn Handlebars, learn JavaScript ES6 templates. Don't just use Bootstrap, learn UI patterns.
Регина Мешковаhas quoted2 years ago
Don't learn jQuery, learn the DOM. Don't learn SASS, learn CSS. Don't learn HAML, learn HTML. Don't learn CoffeeScript, learn JavaScript. Don't learn Handlebars, learn JavaScript ES6 templates. Don't just use Bootstrap, learn UI patterns.
Регина Мешковаhas quoted2 years ago
Learn CLI/command line
Learn the practice of software engineering (i.e., Application design/architecture, templates, Git, testing, monitoring, automating, code quality, development methodologies).
Get opinionated and customize your tool box with whatever makes sense to your brain (e.g. Webpack, React, and Redux).
Learn Node.js
Регина Мешковаhas quoted2 years ago
Learn HTML
Learn CSS
Learn JavaScript
Learn DOM
Learn JSON and data APIs
Learn the fundamentals of user interface design (i.e. UI patterns, interaction design, user experience design, and usability).
Регина Мешковаhas quoted2 years ago
Learn, roughly, how the web works. Make sure you know the "what" and "where" of Domains, DNS, URLs, HTTP, networks, browsers, servers/hosting, JSON, data APIs, HTML, CSS, DOM, and JavaScript.
svetahas quoted3 years ago
Tools for Finding Tools
built with
javascripting.com
js.coach
microjs.com
npms
stackshare.io
Unheap
svetahas quoted3 years ago
Tasking (aka Build) Tools
Tasking/Build Tools: 1
Gulp
Broccoli.js
Opinionated Tasking/Build pipeline tools:
Brunch
Mimosa
Lineman
svetahas quoted3 years ago
Code/GitHub Collaboration & Communication:
Gitter
svetahas quoted3 years ago
Hosting Tools
General
AWS [$]
DigitalOcean [$]
Heroku [free to $]
Static
Firebase Hosting
netlify [free to $]
Bitballoon
Surge [free to $]
Forge [$]
svetahas quoted3 years ago
Module/Package Repository Tools
NPM
yarn
svetahas quoted3 years ago
Module Loading/Bundling Tools
Browserify
Rollup
SystemJS
webpack
http://www.webpackbin.com/
svetahas quoted3 years ago
Front-End Data Storage Tools (i.e. Data storage solution in the client)
AlaSQL
Dexie.js
ForerunnerDB
LocalForage
LokiJS
Lovefield
lowdb
Pouchdb
NeDB
YDN-DB
svetahas quoted3 years ago
JSON Tools
Online Editors:
JSONmate
json.browse()
Formatter & Validator:
jsonformatter.org
JSON Formatter & Validator
Query Tools:
DefiantJS
JSON Mask
ObjectPath
Generating Mock JSON Tools:
JSON Generator
svetahas quoted3 years ago
JSON Tools
Online Editors:
JSONmate
json.browse()
Formatter & Validator:
jsonformatter.org
JSON Formatter & Validator
Query Tools:
DefiantJS
JSON Mask
ObjectPath
Generating Mock JSON Tools:
JSON Generator
Mockaroo
svetahas quoted3 years ago
Animation Tools
Animate
Anime
Dynamics.js
GreenSock-JS
Magic
TweenJS
Velocity.js
Polyfills/Shims:
web-animations-js
Animation References:
canianimate.com
svetahas quoted3 years ago
Graphics (e.g., SVG, canvas, webgl) Tools
General:
Fabric.js
Two.js
Canvas:
EaselJS
Paper.js
SVG:
d3
GraphicsJS
Raphaël
Snap.svg
svg.js
svetahas quoted3 years ago
JS Libraries:
d3
sigmajs
Widgets & Components:
amCharts [free to $]
AnyChart [Non-commercial free to $]
C3.js
Chartist-jsj
Chart.js
Epoch
FusionCharts [$]
Google Charts
Highcharts
svetahas quoted3 years ago
Templating to Virtual DOM:
JSX
t7
svetahas quoted3 years ago
Templating/Data Binding Tools
Just Templating:
doT.js
Handlebars
htmlbars
Nunjuncks
Templating and Reactive Data Binding:
Deku
jquerymy.js
ractive.js
react.js
riot
Rivets.js
svetahas quoted3 years ago
General Front-End Development Tools
Development Tools:
Browsersync
CodeKit
Prepros
fb2epub
Drag & drop your files (not more than 5 at once)