Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/JonathanZWhite/frontend-resources


https://github.com/JonathanZWhite/frontend-resources

Last synced: 7 days ago
JSON representation

Awesome Lists containing this project

README 

        
Web-Development-Resources

=========================



A curated list of resources and tutorials for web developers.

It entails the frontend and Backend engineering development.

This  will serve as a guide to everyone who is interested in web be it the design or the development 

details. 



##Table of Contents



frontend-resources

==================



- [HTML](#html)

- [CSS](/README.md#css)

  - [Preprocessors](/README.md#preprocessors)

- [Javascript](/README.md#javascript)

  - [Reading Material](/README.md#reading-material)

  - [Tutorials](/README.md#tutorials)

  - [Libraries](/README.md##libraries)

  - [Frameworks](/README.md#frameworks)

    - [Angular](/README.md#angular)

    - [React](/README.md#react)

    - [Polymer](/README.md#polymer)

- [UI/UX Design](/README.md#uiux-design)

  - [Inspiration](/README.md#inspiration)

  - [Reading Material](/README.md#reading-material)

  - [Resources](/README.md#resources)

- [Workflow and Tools](/README.md#workflow)

  - [Sublime](/README.md#workflow)

  - [Yeoman Generator](/README.md#yeoman-generator)

  - [JSHint](/README.md#js-hint)

  - [Grunt](/README.md#grunt)

  - [Bower](/README.md#bower)

  - [LESS](/README.md#less)

- [Extra Resources](/README.md#extra-resources)

  - [Reading Material](/README.md#reading-material-1)



Backend-resource

=================

- [Node](/README.md#node)

  - [Tutorials](/README.md#tutorials-1)

  - [Frameworks](/README.md#frameworks-1)

  - [MEAN Stack](/README.md#mean-stack)

  - [Architecture](/README.md#architecture)

  - [Templating](/README.md#templating)

  - [Testing](/README.md#testing)

- [Ruby](/README.md#ruby)

  - [Tutorials](/README.md#tutorials-2) 

  - [Frameworks](/README.md#frameworks-2)

- [PHP](/README.md#php)

  - [Tutorials](/README.md#tutorials-3)

  - [Frameworks](/README.md#frameworks-3)

- [Databases](/README.md#databases)



Others(Optional)

=================

 - [Version Control](/README.md#version-control)

 - [HTML, CSS and JS Guidelines](#frontend-guidelines)

 

content

=======



> Please pay attention to the details of each section.



##HTML

- [Semantic Markup](http://www.smashingmagazine.com/2011/11/18/html5-semantics/)

- [Standards for flexible HTML and CSS](http://codeguide.co/)

- []()



##CSS 

Cascading Style Sheets (CSS) is a style sheet language used for describing the look and formatting of a document written in a markup language. 

- [Animate.css (crossbrowser animations)](http://daneden.github.io/animate.css/)

- [Codrops playground (inspirational css effects)](http://tympanus.net/codrops/category/playground/)



###Preprocessors

- [Less](http://lesscss.org/)

- [Sass](http://sass-lang.com/)



##Javascript

JavaScript (JS) is a dynamic computer programming language.[5] It is most commonly used as part of web browsers, whose implementations allow client-side scripts to interact with the user, control the browser, communicate asynchronously, and alter the document content that is displayed.



###Tutorials

- [Code Academy](http://www.codecademy.com/en/tracks/javascript)

- [Object oriented javascript (quick overview)](http://code.tutsplus.com/tutorials/the-basics-of-object-oriented-javascript--net-7670)

- [Module design pattern](http://css-tricks.com/how-do-you-structure-javascript-the-module-pattern-edition/)



###Reading Material

- [Professional Javascript for Web Developers (includes design patterns and best practices)](http://www.amazon.com/Professional-JavaScript-Developers-Nicholas-Zakas/dp/1118026691)

- [How does Javascript prototyping work](http://stackoverflow.com/questions/572897/how-does-javascript-prototype-work)

- [Prototype vs Revealing Module Pattern](http://www.stevefenton.co.uk/Content/Blog/Date/201312/Blog/JavaScript-Prototype-Vs-Revealing-Module-Pattern/)

- [Javascript scoping and hoisting](http://www.adequatelygood.com/JavaScript-Scoping-and-Hoisting.html)

- [Structuring a complex JSON schema](http://spacetelescope.github.io/understanding-json-schema/structuring.html)

- [A overview of Angular, Ember and Backbone](http://www.airpair.com/js/javascript-framework-comparison)



###Libraries



- **[jQuery](http://jquery.com/)** - Javascript library that makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers.



- **[YUI](https://yuilibrary.com/)** - open-source JavaScript library for building richly interactive web applications using techniques such as Ajax, DHTML, and DOM scripting.



- **[D3.js](http://d3js.org/)** - D3.js (or just D3 for Data-Driven Documents) is a JavaScript library that uses digital data to drive the creation and control of dynamic and interactive graphical forms which run in web browsers.



- **[Three.js](https://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&uact=8&ved=0CB4QFjAA&url=http%3A%2F%2Fthreejs.org%2F&ei=X6CLVOL2FIOqggTtpYKoDQ&usg=AFQjCNHakSkkOA_Y3WLNBlsxGYWV7af4Mw&sig2=WbHHKpPmhhPZ7ETyLKkmsw&bvm=bv.81828268,d.eXY)** - JavaScript 3D Library which makes WebGL simpler.



- **[Chart.js](http://www.chartjs.org/)** - Simple, clean and engaging charts for designers and developers



###Frameworks



####[Angular](https://angularjs.org/)

AngularJS is an open-source web application framework, maintained by Google and community, that assists with creating single-page applications, one-page web applications that only require HTML, CSS, and JavaScript on the client side. Its goal is to augment web applications with model–view–controller (MVC) capability, in an effort to make both development and testing easier.



**Motivation**

- [Why Angular over jQuery](http://stackoverflow.com/questions/18414012/why-use-angularjs-instead-of-jquery)

- [From jQuery to Angular mindset](http://stackoverflow.com/questions/14994391/how-do-i-think-in-angularjs-if-i-have-a-jquery-background)



**Getting Started**

- [Angular-cat](https://docs.angularjs.org/tutorial/step_00)

- [AngularJS Tutorial: A Comprehensive 10,000 Word Guide](http://www.airpair.com/angularjs)

- [Angular in 60-ish minutes (video)](https://www.youtube.com/watch?v=i9MHigUZKEM)

- [Scotch - AngularJS tutorials](http://scotch.io/tag/angular-js)

- [Egghead - AngularJS tutorials](https://egghead.io/technologies/angularjs)

- [Year of - Moo AngularJS tutorials](http://www.yearofmoo.com/)



**Style**

- [AngularJS Style Guide](https://github.com/johnpapa/angularjs-styleguide)

- [Angular Styleguide](https://github.com/toddmotto/angularjs-styleguide)



**Design patterns/best practice**

- [Angular design patterns and best practices](http://trochette.github.io/Angular-Design-Patterns-Best-Practices/#/intro)

- [Angular best practices: I've been doing it all wrong](http://www.artandlogic.com/blog/2013/05/ive-been-doing-it-wrong-part-1-of-3/)

- [Promises And Design Patterns In AngularJS](http://blog.xebia.com/2014/02/23/promises-and-design-patterns-in-angularjs/)

- [Best Practice Recommendations for Angular App Structure (Google)](https://docs.google.com/document/d/1XXMvReO8-Awi1EZXAXS4PzDzdNvV6pGcuaF4Q9821Es/pub)



**Scopes**

- [Understanding Scopes](https://github.com/angular/angular.js/wiki/Understanding-Scopes)



**Data modeling**

- [AngularJS Data Modeling (video series)](https://egghead.io/series/angularjs-data-modeling)

- [AngularJS Data Models: $http VS $resource VS Restangular](http://sauceio.com/index.php/2014/07/angularjs-data-models-http-vs-resource-vs-restangular/)



**Controllers**

- [Sharing Data Between Controllers](http://www.thinkster.io/angularjs/9jfpSmbx1j/angularjs-sharing-data-between-controllers)

- [The state of angularjs controllers](http://jonathancreamer.com/the-state-of-angularjs-controllers/)

- [Rethinking AngularJS Controllers](http://toddmotto.com/rethinking-angular-js-controllers/)



**Directives**

- [A Practical Guide to Angular Directives](http://www.sitepoint.com/practical-guide-angularjs-directives/)

- [Directives - difference between controller and link](http://jasonmore.net/angular-js-directives-difference-controller-link/)

- [Difference between the 'controller', 'link' and 'compile' functions when defining an angular.js directive](http://stackoverflow.com/questions/12546945/difference-between-the-controller-link-and-compile-functions-when-definin)

- [Angular Directive Best Practices](http://www.jeremyzerr.com/angularjs-directive-best-practices)



**Services/Factories**

- [Angular.service vs angular.factory](http://stackoverflow.com/questions/14324451/angular-service-vs-angular-factory)

- [Tidy up your Angular with factories](http://www.sitepoint.com/tidy-angular-controllers-factories-services/)



**Routing**

- [AngularJS Routing Using UI-Router](http://scotch.io/tutorials/javascript/angular-routing-using-ui-router)



**Authentication**

- [Authentication in Single Page Applications](https://vickev.com/#!/article/authentication-in-single-page-applications-node-js-passportjs-angularjs)

- [Cookies vs Tokens. Getting auth right with Angular.JS](https://auth0.com/blog/2014/01/07/angularjs-authentication-with-cookies-vs-token/)

- [NgTokenAuth - simple, secure authentication for AngularJS](https://github.com/lynndylanhurley/ng-token-auth)

- [Satellizer - simple to use, end-to-end, token-based authentication module for AngularJS](https://github.com/sahat/satellizer)



**Deployment**

- [Setting up an Angular and Node environment for development and production](http://start.jcolemorrison.com/how-i-setup-angular-node-projects/)

- [How to use environment variables in your Angular application](http://mindthecode.com/how-to-use-environment-variables-in-your-angular-application/)



**Angular 2.0**

- [Ng-conf](https://www.youtube.com/watch?v=gNmWybAyBHI)

- [Hacker News discussion on Angular 2](https://news.ycombinator.com/item?id=8507632)

- [Preparing for the future of AngularJS](https://www.airpair.com/angularjs/posts/preparing-for-the-future-of-angularjs)



**Testing**

- [Protractor (E2E testing)](https://github.com/angular/protractor)

- [Karma](http://karma-runner.github.io/0.12/index.html)



**Misc**

- [Speeding up AngularJS apps with simple optimizations](http://www.binpress.com/tutorial/speeding-up-angular-js-with-simple-optimizations/135)



####[React](http://facebook.github.io/react/)

React is a JavaScript library for building user interfaces. It's declarative, efficient, and extremely flexible. What's more, it works with the libraries and frameworks that you already know.



Tutorials

- [Overview from Facebook](http://facebook.github.io/react/docs/tutorial.html)

- [Intro to the React Framework (great overview)](http://code.tutsplus.com/tutorials/intro-to-the-react-framework--net-35660)

- [React comment box Tutorial](http://facebook.github.io/react/docs/tutorial.html)

- [Flux ToDo MVC](http://facebook.github.io/flux/docs/todo-list.html)

- [React Components](https://medium.com/react-tutorials/react-components-828c397e3dc8)

- [React States](https://medium.com/react-tutorials/react-state-14a6d4f736f5)

- [React Properties](https://medium.com/react-tutorials/react-properties-ef11cd55caa0)



Reading Material 

- [Getting started with React](http://scotch.io/tutorials/javascript/learning-react-getting-started-and-concepts)

- [Getting to know Flux](http://scotch.io/tutorials/javascript/getting-to-know-flux-the-react-js-architecture)

- [Rethinking Best Practices (video)](https://www.youtube.com/watch?v=DgVS-zXgMTk)

- [Hacker Way: Rethinking Web App Development at Facebook](https://www.youtube.com/watch?v=nYkdrAPrdcw&list=PLb0IAmt7-GS188xDYE-u1ShQmFFGbrk0v#t=41)



Architecture

- [Flux architecture](http://facebook.github.io/react/docs/flux-overview.html) 

- [Flux website (all things Flux)](http://facebook.github.io/flux/)

- [React Yeoman Generator](https://github.com/facebook/react/issues/681#issuecomment-31080689)



####[Polymer](http://www.polymer-project.org/)

Library that uses the latest web technologies to create custom HTML elements.



Tutorials

- [Google's Polymer Tutorial for Beginners](http://www.polymer-project.org/docs/start/tutorial/step-1.html)



Reading Materials

- [Building modern apps with Polymer & Web Components](https://www.youtube.com/watch?v=VMVj_jR75vE)

- [Polymer vs Angular](http://www.binpress.com/blog/2014/06/26/polymer-vs-angular/)



##UI/UX Design



###Inspiration

- [Pttrns (A curated library of iPhone and iPad user interface patterns)](http://www.pttrns.com/)

- [Dribbble (Show and tell for designers)](https://dribbble.com/)

- [Behance (Showcase and discover creative work)](https://www.behance.net/)



- [http://drp.io/aee/bKd/-/+](http://drp.io/aee/bKd/-/+)



Data visualization

- [Nicholas Felton](http://feltron.com/)

- [2013: The Year in Interactive Storytelling (New York Times)](http://www.nytimes.com/newsgraphics/2013/12/30/year-in-interactive-storytelling/)



###Reading Material

- [Designing Design (book)](http://www.amazon.com/Designing-Design-Kenya-Hara/dp/3037784504/ref=tmm_pap_title_0?_encoding=UTF8&sr=&qid=#customerReviews)

- [Recommended design books](http://pxdotpt.com/blog/2014/1/11/design-books-ive-read-and-recommend)

- [Thoughts on Design (book)](http://www.amazon.com/exec/obidos/ASIN/081187544X/ref=nosim/0sil8)

- [Apple's Human Interface Guidelines](https://developer.apple.com/library/iOS/documentation/userexperience/conceptual/mobilehig/)

- [Google's Material Design Guidelines](http://www.google.com/design/spec/material-design/introduction.html)

- [My Dream Design Curriculum](https://medium.com/the-year-of-the-looking-glass/my-dream-design-curriculum-ace1d0475289)

- [The Z-Axis: Designing for the Future](http://alistapart.com/article/the-z-axis-designing-for-the-future)

- [UX crash course - 31 fundementals](http://thehipperelement.com/post/75476711614/ux-crash-course-31-fundamentals)

- [ElemantaryOS Human Interface Guidelines](http://elementaryos.org/docs/human-interface-guidelines/human-interface-guidelines)

- [Maintain Consistency With a Website Style Guide](http://webdesign.tutsplus.com/articles/maintain-consistency-with-a-website-style-guide--webdesign-10795)



###Resources

- [Coolors - Color generator](http://coolors.co/)

- [Subtle Patterns (Free textures for your next web project)](http://subtlepatterns.com/)

- [Google Fonts](https://www.google.com/fonts)

- [Font Awesome (Font Awesome gives you scalable vector icons that can instantly be customized)](http://fortawesome.github.io/Font-Awesome/icons/)

- [Free HD videos loops for awesome landing pages](http://www.xstockvideo.com/)

- [Little Big Details - Your daily dose of design inspiration.](http://littlebigdetails.com/)

- [Font Awesome for Illustrator](http://www.mediafire.com/download/ms8s6ozkaotkvd7/font-awesome.ai)

- [Brand Colors](http://brandcolors.net/)

- [All your free stock images in one place](http://www.sitebuilderreport.com/stock-photo-search)



####Stock Images

- [Unsplash (Free stock images)](http://unsplash.com/)

- [Unsplash with search and filtering](http://www.arthurweill.fr/Unsplash/en)

- [Aggregate of stock images](http://www.sitebuilderreport.com/stock-up)

- [Jaymantri (Free stock images)](http://jaymantri.com)

- [The Stocks (Free stock images)](http://thestocks.im/)

- [Travel Coffeebook (Free stock images)](http://travelcoffeebook.tumblr.com/)

- [Pexels](http://www.pexels.com/?ref=producthunt)



##Workflow



####[Sublime](http://www.sublimetext.com/)

Sublime Text is a sophisticated text editor for code, markup and prose.

- [Best of Sublime Text 3: Features, Plugins, and Settings](http://scotch.io/bar-talk/best-of-sublime-text-3-features-plugins-and-settings)

- [AngularJS - AngularJS code completion, snippets, go to definition, quick panel search, and more.](https://sublime.wbond.net/packages/AngularJS)

- [Docblockr - Simplifies writing DocBlock comments in Javascript, PHP, CoffeeScript, Actionscript, C & C++](https://sublime.wbond.net/packages/DocBlockr)

- [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)

- [JavascriptBeautify - js-beautify for sublime](https://sublime.wbond.net/packages/Javascript%20Beautify)

- [JSX - Language Definitions for JSX files.](https://sublime.wbond.net/packages/JSX)

- [LESS - LESS syntax highlighting for Sublime Text.](https://sublime.wbond.net/packages/LESS)

- [NodeJS - nodejs snippets and bindings for Sublime Text 2](https://sublime.wbond.net/packages/Nodejs)

- [Package Control - A full-featured package manager](https://sublime.wbond.net/packages/Package%20Control)

- [Predawn - Predawn is a dark interface and syntax theme for Sublime Text.](https://sublime.wbond.net/packages/Predawn)

- [Sublime Linter - Interactive code linting framework for Sublime Text 3](https://sublime.wbond.net/packages/SublimeLinter)

  - [SublimeLinter-javac - SublimeLinter 3 plugin for Java, using javac -Xlint.](https://sublime.wbond.net/packages/SublimeLinter-javac)

  - [SublimeLinter-jshint - SublimeLinter plugin for JavaScript, using jshint.](https://sublime.wbond.net/packages/SublimeLinter-jshint)

  - [SublimeLinter-jsxhint - SublimeLinter 3 plugin for JSX (React.js), using jsxhint.](https://sublime.wbond.net/packages/SublimeLinter-jsxhint)

- [Setting up the .subl command in terminal](http://stackoverflow.com/questions/10196449/installing-sublime-texts-command-line-tool-subl-in-terminal-permission-denie)



####Deployment

- [5 Common Server Setups For Your Web Application](https://www.digitalocean.com/community/tutorials/5-common-server-setups-for-your-web-application)

- [Setting Up A Staging Environment](http://code.tutsplus.com/articles/setting-up-a-staging-environment--net-29738)

- [How To Set Up and Test DNS Subdomains with DigitalOcean's DNS Panel](https://www.digitalocean.com/community/tutorials/how-to-set-up-and-test-dns-subdomains-with-digitalocean-s-dns-panel)

- [How To Set Up HTTP Authentication With Nginx On Ubuntu 12.10](https://www.digitalocean.com/community/tutorials/how-to-host-multiple-node-js-applications-on-a-single-vps-with-nginx-forever-and-crontab)



####[Yeoman Generator](http://yeoman.io/)

Yeoman helps you kickstart new projects, prescribing best practices and tools to help you stay productive.



####[JS Hint](http://jshint.com/docs/)

JSHint is a program that flags suspicious usage in programs written in JavaScript. The core project consists of a library itself as well as a CLI program distributed as a Node module.



####[Grunt](http://gruntjs.com/)

Automation, performing repetitive tasks like minification, compilation, unit testing and linting.

- [Writing an awesome build script with Grunt](http://www.sitepoint.com/writing-awesome-build-script-grunt/)

- [Making your AngularJS application grunt](http://g00glen00b.be/angular-grunt/)

- [How to use environment variables in your Angular application](http://mindthecode.com/how-to-use-environment-variables-in-your-angular-application/)

- [Get more with LESS using Grunt](http://g00glen00b.be/less-grunt/)



####[Postman](https://chrome.google.com/webstore/detail/postman-rest-client/fdmmgilgnpjigdojojpjoooidkmcomcm?hl=en)

Postman helps you be more efficient while working with APIs



####[Bower](http://bower.io/)

A package manager for the web



####[Passport](http://passportjs.org/)

Simple, unobtrusive authentication for Node.js



####[LESS](http://lesscss.org/)

Less extends CSS with dynamic behavior such as variables, mixins, operations and functions.

- [LESS in Practice (shameless plug)](https://github.com/JonathanZWhite/less-in-practice)

- [Medium’s CSS is actually pretty fucking good](https://medium.com/@fat/mediums-css-is-actually-pretty-fucking-good-b8e2a6c78b06)



####[SASS](http://sass-lang.com/)

Sass is the most mature, stable, and powerful professional grade CSS extension language in the world.



##Extra Resources



###Reading Material

- [Hammock driven development (video)](https://www.youtube.com/watch?v=f84n5oFoZBc)

- [How to be a great software developer](http://peternixey.com/post/83510597580/how-to-be-a-great-software-developer)



##[Node](http://nodejs.org/)

Node.js is a runtime environment and a library for running applications written in JavaScript outside the browser (for example, on the server). Node.js applications are designed to maximize throughput and efficiency, using non-blocking I/O and asynchronous events. Node.js applications run single-threaded, although Node.js uses multiple threads for file and network events. Node.js is commonly used for real time applications due to its asynchronous nature, allowing applications to display information faster for users without the need for refreshing.



###Tutorials

- [Node for Beginners](http://code.tutsplus.com/tutorials/nodejs-for-beginners--net-26314)

- [Node Beginner (book)](http://www.nodebeginner.org/)

- [Node School](http://nodeschool.io/)

- [Node Async Tutorial](http://justinklemm.com/node-js-async-tutorial/)

- [Overview of Node with Mongo and Express](http://cwbuecheler.com/web/tutorials/2013/node-express-mongo/)

- [Building a Restful API with Node and Express](http://scotch.io/tutorials/javascript/build-a-restful-api-using-node-and-express-4)

- [What is Node.js Exactly? - a beginners introduction to Nodejs](https://www.youtube.com/watch?v=pU9Q6oiQNd0&list=UUVTlvUkGslCV_h-nSAId8Sw)

- [Learn to Use the New Router in Express 4](http://scotch.io/tutorials/javascript/learn-to-use-the-new-router-in-expressjs-4)

- [Creating a Single Page Todo App with Node and Angular](http://scotch.io/tutorials/javascript/creating-a-single-page-todo-app-with-node-and-angular)

- [Building a complete MVC site with node/express](http://code.tutsplus.com/tutorials/build-a-complete-mvc-website-with-expressjs--net-34168)

- [Easy Node Authentication Setup](http://scotch.io/tutorials/javascript/easy-node-authentication-setup-and-local)

- [Blog rolling with mongoDB, express and Node](http://howtonode.org/express-mongodb)

- [Building an Angular and Express app](http://start.jcolemorrison.com/building-an-angular-and-express-app-part-1/)

- [Running Express.js in Production Mode](http://www.hacksparrow.com/running-express-js-in-production-mode.html)

- [Keep a node.js server up with Forever](http://blog.nodejitsu.com/keep-a-nodejs-server-up-with-forever/)

- [Running Express in production mode](http://www.hacksparrow.com/running-express-js-in-production-mode.html)



Reading Material

- [Why use Node](http://www.toptal.com/nodejs/why-the-hell-would-i-use-node-js)

- [Node explained (video)](https://www.youtube.com/watch?v=L0pjVcIsU6A)

- [Node Control Flow](http://book.mixu.net/node/ch7.html)

- [Why use closures](http://howtonode.org/why-use-closure)

- [Node Best Practices](http://blog.risingstack.com/node-js-best-practices/)

- [Error Handling in Node](http://www.joyent.com/developers/node/design/errors)

- [Awesome Node resources](https://github.com/sindresorhus/awesome-nodejs)

- [Node.js async in practice: When to use what?](http://www.sebastianseilund.com/nodejs-async-in-practice)

- [Using $scope.$watch and $scope.$apply](http://stackoverflow.com/questions/15112584/using-scope-watch-and-scope-apply)

- [Felix's Node.js Style Guide](http://nodeguide.com/style.html)

- [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/)

- [Node RESTful API Authentication](http://stackoverflow.com/questions/14572600/passport-js-restful-auth)

- [Projects, Applications, and Companies Using Node (great reference material)](https://github.com/joyent/node/wiki/Projects,-Applications,-and-Companies-Using-Node)

- [Full stack javascript with MEAN and Yeoman](http://addyosmani.com/blog/full-stack-javascript-with-mean-and-yeoman/)

- [MEAN.js](https://github.com/meanjs/mean)

- [RisingStack Node.js Style Guide](https://github.com/RisingStack/node-style-guide)

- [Node.js Best Practices](http://blog.risingstack.com/node-js-best-practices/)



###Frameworks

- [Express](http://expressjs.com/)



###MEAN Stack

- [Introduction to MEAN](http://code.tutsplus.com/tutorials/introduction-to-the-mean-stack--cms-19918)

- [Creating an RSS feed reader with the MEAN stack](http://code.tutsplus.com/tutorials/creating-an-rss-feed-reader-with-the-mean-stack--cms-20563?utm_source=Tuts+&utm_medium=website&utm_campaign=relatedtutorials&utm_content=sidebar&WT.mc_id=Tuts+_website_relatedtutorials_sidebar)



###Architecture

- [Hackathon Starter](https://github.com/sahat/hackathon-starter)

- [Boilerplate (barebones)](https://github.com/JonathanZWhite/node-boilerplate)



###Templating

- [Dust templating](https://github.com/linkedin/dustjs/wiki/Dust-Tutorial)

- [Pug templating- formerly/Popularly called Jade](http://jade-lang.com/)

	-[Pug](https://pugjs.org/)

	-[Learn Jade](www.learnjade.com)



- [Ejs templating](http://www.embeddedjs.com/)

     -[Embedded JavaScript templates](https://www.npmjs.com/package/ejs)

     -[Effective JavaScript Templating]( http://ejs.co)

     -[EJS Github Repo](https://github.com/mde/ejs)

###Testing

- [Mocha](https://mochajs.org/)

- [Arrow](https://github.com/yahoo/arrow)

- [Jasmine-node]()

- [Jest]()

- [Enzyme]()



## [Ruby](https://www.ruby-lang.org/en/)

A dynamic, open source programming language with a focus on simplicity and productivity. It has an elegant syntax that is natural to read and easy to write.



###Tutorials

- [Code Academy](http://www.codecademy.com/en/tracks/ruby)

- [Ruby for Newbies (series)](http://code.tutsplus.com/series/ruby-for-newbies--net-18166)



###Frameworks



####[Rails](http://rubyonrails.org/)



Tutorials

- [Rails for Zombies (game)](http://railsforzombies.org/)

- [Ruby on Rails Tutorial by Michael Hartl (book)](http://ruby.railstutorial.org/chapters)



##[PHP](https://php.net/)

PHP is a server-side scripting language designed for web development but also used as a general-purpose programming language.



###Tutorials

- [Code Academy](http://www.codecademy.com/en/tracks/php)

- [Object Oriented PHP (quick overview)](http://code.tutsplus.com/tutorials/object-oriented-php-for-beginners--net-12762)

- [The MVC Pattern and PHP](http://www.sitepoint.com/the-mvc-pattern-and-php-1/)



###Frameworks

- [Laravel (MVC based framework)](http://laravel.com/)



## Databases



####[MySQL](http://www.mysql.com/)

MySQL is the most popular database system used with PHP.

MySQL has a Javascript driver.



####[MongoDB](http://www.mongodb.org/)

MongoDB (from "humongous") is an open-source document database, and the leading NoSQL database.

- [Introduction to MongoDB](http://docs.mongodb.org/manual/)

- [Data Modeling](http://docs.mongodb.org/manual/data-modeling/)

- [Online Courses on mongodb- M101JS: MongoDB for Node.js Developers](https://university.mongodb.com/)

- [Designing MongoDB Schemas with Embedded, Non-Embedded and Bucket Structures](https://www.openshift.com/blogs/designing-mongodb-schemas-with-embedded-non-embedded-and-bucket-structures)

- [MongoDB Schema Design Basics (video)](https://www.youtube.com/watch?v=Mz320k-WREA)

- [MongoDB relationships: embed or reference](http://stackoverflow.com/questions/5373198/mongodb-relationships-embed-or-reference)

- [Example and use of Mongoose virtual attributes](http://mongoosejs.com/docs/2.7.x/docs/virtuals.html)



####[CouchDB](http://couchdb.apache.org/)

CouchDB is a database that completely embraces the web. Store your data with JSON documents. Access your documents and query your indexes with your web browser, via HTTP. Index, combine, and transform your documents with JavaScript.

Tutorials

- [Overview of Crouch DB](http://code.tutsplus.com/articles/getting-started-with-couchdb--net-18801)



---------------- Everything below this point is optional ----------------



####Version-control

A component of software configuration management, version control, also known as revision control or source control, is the management of changes to documents, computer programs, large web sites, and other collections of information.



- [**git**](https://git-scm.com/) 

- [git-tips](http://git.io/git-tips)

- [git-guide](http://rogerdudler.github.io/git-guide/)

<<<<<<< HEAD

- In built git tutorial after innstalling git.

 > Use the following git command line to ope the tutorial on the web.

 

 `$ git help -g`



 `$ git help tutorial`

  

####[Github](http://www.github.com)

- []()

- [Github](http://www.github.com)

- [:computer: :mortar_board: Learn Git and GitHub.](http://jlord.us/git-it/)



####[Markdown-Cheatsheet ](https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet)

> It is useful in commmunication or collaboration. 



- [Mastering Github Flavoured Markdown](https://guides.github.com/features/mastering-markdown/#GitHub-flavored-markdown)



####frontend-guidelines

- [Bendc frontend(HTML,css,js) guideline-Adapted from [Airbnb JS style guide](https://github.com/airbnb/javascript)](https://github.com/bendc/frontend-guidelines)