Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/lwakefield/webdevresourcecuration

A curation of resources for web developers
https://github.com/lwakefield/webdevresourcecuration

Last synced: about 2 months ago
JSON representation

A curation of resources for web developers

Awesome Lists containing this project

README 

        
#A curation of resources for Web Developers



## Regular Visits

* [Web design weekly](http://web-design-weekly.com/)

* [Sidebar](http://marvelapp.github.io/devices.css/)

* [AWWWards](http://www.awwwards.com/)

* [A list apart](http://alistapart.com/)

* [The Neo Design](http://theneodesign.com/)

* [Codrops](http://tympanus.net/codrops/)

* [Scotch.io](http://scotch.io/)

* [CSS tricks](http://css-tricks.com/)

* [TechCrunch](http://techcrunch.com/)

* [SitePoint](http://www.sitepoint.com/)

* [Smashing Magazine](http://www.smashingmagazine.com/)

* [Speckyboy](http://speckyboy.com/)

* [Vandelay design's blog](http://vandelaydesign.com/blog/)

* [Hack design](http://hackdesign.org/)

* [Line 25](http://line25.com/)

* [Web Dev Snippets](http://www.webdevsnippets.com/)

* [Codular](http://codular.com/)

* [Lonely pixel](http://www.lonely-pixel.com/)

* [SiteBuilderReport](http://www.sitebuilderreport.com/blog)

* [Codacy](http://blog.codacy.com/)

* [Code School Blog](http://www.codeschool.com/blog/)

* [Web Designer Depot](http://www.webdesignerdepot.com/)



## Tutorials

* [Hack design](https://hackdesign.org/)

* [Tutsplus](http://code.tutsplus.com/)

* [Tutorialzine](http://tutorialzine.com/)

* [Codeplayer](http://thecodeplayer.com/)

* [Dive into HTML5](http://diveintohtml5.info/index.html)

* [HTML5 Rocks](http://www.html5rocks.com/)

* [Code Bright for Laravel PHP](http://daylerees.com/codebright)

* [PHP the right way](http://www.phptherightway.com/)

* [Human JavaScript](http://read.humanjavascript.com/ch01-introduction.html)

* [User managaement in node.js](http://devcenter.kinvey.com/nodejs/guides/users)

* [node.js guides](http://devcenter.kinvey.com/nodejs/guides)

* [Learn AngularJS in 30 minutes](http://www.revillweb.com/tutorials/angularjs-in-30-minutes-angularjs-tutorial/)

* [5 practical AngularJS examples](http://tutorialzine.com/2013/08/learn-angularjs-5-examples/)

* [Getting started with OAuth](https://oauth.io/getting-started?javascript&php)

* [Jekyll resume](https://github.com/philipithomas/jekyll-resume/)



## Workflow

* [Thoughtbot's Playbook](http://playbook.thoughtbot.com/)

* [Web dev checklist](http://webdevchecklist.com/)

* [Pre-deploy checklist](http://www.codelord.net/2014/01/15/my-pre-deploy-checklist/)

* [Visual Designers Checklist for the Web](http://webdesignerschecklist.com/)

* [Desktop development with HTML5, CSS3 and JavaScript](http://www.tidesdk.org/)

* [Apache Cordova - platform for building native mobile applications using HTML, CSS and JavaScript](http://cordova.apache.org/)

* [PHỞ - automated workflow for front-end developers](http://pho.madebysource.com/)

* [Yeoman - the web's scaffolding tool](http://yeoman.io/)

* [Periodic table of web design process](http://i.imgur.com/hqGsw2k.jpg)

* [How to start a web design project](http://designmodo.com/web-design-project/)

* [Finding a winning workflow for frontend development](http://blog.slant.co/post/95896285907/finding-a-winning-workflow-for-frontend-development)



## Business

* [Freelancer life](http://papermine.com/pub/917#cover)

* [Simple contract template](https://www.docracy.com/3884/contract-of-works-for-web-design)

* [33 ways to get more clients](http://blog.slant.co/post/95896285907/finding-a-winning-workflow-for-frontend-development)

* [Avoiding client headache](http://uxmovement.com/resources/how-to-avoid-client-headache-as-a-freelance-designer/)

* [Don't screw up client presentations](https://medium.com/@monteiro/13-ways-designers-screw-up-client-presentations-51aaee11e28c)

* [Starting and running your own business](http://www.jamesaltucher.com/2013/08/the-ultimate-cheat-sheet-to-starting-and-running-your-own-business/)

* [Business Validation Cheat Sheet](http://s3.appsumo.com/ValidationCheatSheet.pdf)



## Tools

* [10 essential tools for startups](http://despreneur.com/10-essential-tools-for-startups/)

* [uiFaces - sample avatar mockups](http://uifaces.com/)

* [Adobe Kuler color wheel](https://kuler.adobe.com/create/color-wheel/)

* [Daux.io - documentation generator](http://daux.io/)

* [Online style guide generator](http://stylifyme.com/)

* [SEO site checkup](http://seositecheckup.com/)

* [Developer and power users tool list for windows](http://www.hanselman.com/blog/ScottHanselmans2014UltimateDeveloperAndPowerUsersToolListForWindows.aspx)

* [Vagrant](http://www.vagrantup.com/)

* [Forp - PHP Profiler](http://forp.io/)

* [RawGit - easy CDNs](https://rawgit.com/)

* [SinglePafe.guru - singlepage design made easy](https://www.singlepage.guru/editor.html)

* [Reveal.js - HTML presentations made easy](http://lab.hakim.se/reveal-js/#/)

* [Firebase - store and sync data in realtime](https://www.firebase.com/)



## Cheatsheet

* [20 Useful HTML5 Code Snippets You Should Know](http://www.realcombiz.com/2014/02/20-useful-html5-code-snippets-you.html?m=1)

* [Responsive breakpoint cheatsheet](https://uxpin.s3.amazonaws.com/responsive_web_design_cheatsheet.pdf)

* [AngularJS cheatsheet](http://www.cheatography.com/proloser/cheat-sheets/angularjs/)

* [SEO periodic table](http://searchengineland.com/download/seotable/SearchEngineLand-Periodic-Table-of-SEO-2013-large.png)



## Design

* [A baseline for Front-End developers](http://rmurphey.com/blog/2012/04/12/a-baseline-for-front-end-developers/)

* [Gestalt Principles](http://sixrevisions.com/web_design/gestalt-principles-applied-in-design/)

* [The role of visual design](http://www.lukew.com/ff/entry.asp?1915)

* [Clean up your mess](http://www.visualmess.com/)

* [The boring Designer](http://blog.capwatkins.com/the-boring-designer)

* [Paralyzed by choice in Front-End development](http://modernweb.com/2014/03/31/paralyzed-by-choice-in-front-end-development/)

* [How to cultivate culture in online communities](http://www.sitebuilderreport.com/blog/6-ways-to-cultivate-culture-on-a-website)

* [Most common technical interview questions for front end developers](http://www.frontendjournal.com/most-common-technical-interview-question-for-frontend-developers/)

* [10 best free ebooks for designers](http://despreneur.com/10-best-free-ebooks-for-designers/)

* [Google's best practices for modern web development](https://developers.google.com/web/fundamentals/)

* [Google design principles ands material design](http://www.google.com/design/)

* [User Personas](https://www.flickr.com/photos/jasontravis/sets/72157603258446753/)

* [Briefbox - practice design briefs](http://briefbox.me/)



## UX and UI

* [10 differences between UX and UI designers](http://www.thedesignpotato.com/10-differences-between-ux-designer-and-ui-designer/)

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

* [Google's UX design approach](http://www.fastcodesign.com/1672657/google-s-dead-simple-tool-for-making-ux-decisions-2-jars-of-marbles?utm_source)

* [Flat UI Colors](http://flatuicolors.com/)

* [Good UI - tips for building good UIs](http://www.goodui.org/index_v2.html)

* [Free UX Resources](http://uxmessiah.com/free-ux-resources-part-1/)

* [User onboarding teardowns](http://www.useronboard.com/onboarding-teardowns/)

* [A/B testing with PHP](http://phpabtest.com/)

* [Google Content Experiments](https://support.google.com/analytics/answer/1745147?hl=en&ref_topic=1745207&rd=1)



## CSS

* [CSS guidelines](http://cssguidelin.es/)

* [GitHub's style guide](https://github.com/styleguide/css)

* [Groupbuddies Sass project architecture and style guide](http://blog.groupbuddies.com/posts/32-our-css-sass-project-architecture-and-styleguide)

* [CodePen's CSS](http://codepen.io/chriscoyier/blog/codepens-css)

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

* [GitHub's CSS](http://markdotto.com/2014/07/23/githubs-css/)



## Templates, Frameworks and Components

* [Layers CSS](http://www.wework.com/magazine/knowledge/google-degree-resources-transformed-web-dev/)

* [Flat UI](http://designmodo.github.io/Flat-UI/)

* [PixelKit Bootstrap UI kits](https://github.com/Pixelkit/PixelKit-Bootstrap-UI-Kits/)

* [Bourbon - Sass mixin library](http://bourbon.io/)

* [Simple CSS spiners](http://tobiasahlin.com/spinkit/)

* [20 Free useful flat HTML templates](http://despreneur.com/20-free-useful-flat-html-templates/)

* [Web and mobile GUI templates](http://speckyboy.com/2014/01/15/50-best-web-mobile-gui-templates-2013/)

* [CodyHouse - A free library of HTML, CSS, JS nuggets](http://codyhouse.co/)

* [HTML5 up - spiffy templates](http://html5up.net/)

* [20 Free useful flat HTML templates](http://despreneur.com/20-free-useful-flat-html-templates/)

* [Web and mobile GUI templates](http://speckyboy.com/2014/01/15/50-best-web-mobile-gui-templates-2013/)



## Inspiration

* [AWWWards](http://www.awwwards.com/)

* [Codrops' playground](http://tympanus.net/codrops/category/playground/)

* [Panda - Collections for designers](http://usepanda.com/app/)

* [Minimalist Gallery](http://www.siiimple.com/)

* [Collection by #2E353F](https://dribbble.com/colors/2E353F)

* [Beautiful sites for Open Source projects](http://beautifulopen.com/)

* [Moodboard](http://www.gomoodboard.com/)

* [Uber](https://www.uber.com/)

* [Hyperakt](http://hyperakt.com)

* [Jacob Tomlinson's minimal blog](http://www.jacobtomlinson.co.uk/)

* [Jason Cha's DailyBible](http://jasoncho.ca/portfolio/dailybible/)

* [Iuvo's playground](http://www.iuvo.si/play)

* [JS demos](http://davidwalsh.name/codepen-demos)

* [Flat Surface Shader demo](http://matthew.wagerfield.com/flat-surface-shader/)

* [A collection of active backgrounds](http://codepen.io/collection/ACqoJ/)



## Plugins

* [Shepherd - Guide your users through a tour of your app](http://github.hubspot.com/shepherd/docs/welcome/)

* [HTML5 slider with range support](https://github.com/fryn/html5slider)

* [jQRangeSlider](http://ghusse.github.io/jQRangeSlider/demo.html)

* [Chosen - Better select boxes](http://www.webdevsnippets.com/)

* [Selectize - textbox and select hyrbid](http://brianreavis.github.io/selectize.js/)

* [Datatables](http://datatables.net/)

* [You might not need jQuery](http://youmightnotneedjquery.com/)

* [Masonry](http://masonry.desandro.com/)

* [MixItUp - filtering and sorting](https://mixitup.kunkalabs.com/)

* [jQuery FocusPoint](https://github.com/jonom/jquery-focuspoint)



## Icons

* [Font Awesome](http://fortawesome.github.io/Font-Awesome/)

* [Gemicon](http://gemicon.net/)

* [Batch](http://adamwhitcroft.com/batch/)

* [Iconic](https://useiconic.com/open/)

* [Ionicons](http://ionicons.com/)

* [Fontelleo - icon font generator](http://fontello.com/)



## Fonts

* [Typ.io - Fonts that go together](http://www.typ.io/)

* [Beautiful Web Type](http://hellohappy.org/beautiful-web-type/)

* [Google web fonts typography](http://femmebot.github.io/google-type/)

* [Open Sans](http://www.google.com/fonts/specimen/Open+Sans)

* [Lato](http://www.google.com/fonts/specimen/Lato)

* [Best new web fonts of 2013](http://typecast.com/blog/best-new-web-fonts-of-2013)

* [Blokk font](http://blokkfont.com/)

* [Fresh free fonts](http://theneodesign.com/fresh-free-fonts-2014/)

* [10 commandments of typography](http://www.designmantic.com/blog/wp-content/uploads/2014/04/font-infography.jpg)



## Stock images

* [Unsplash](https://unsplash.com/)

* [Gratisography](http://www.gratisography.com/)

* [Splitshire](http://splitshire.com/)

* [Raumrot](http://www.raumrot.com/10/)

* [Death to the stock photo](http://deathtothestockphoto.com/)

* [The stocks](http://thestocks.im/)



## Other curations

* [Backend development bookmarks](https://gist.github.com/dypsilon/5819528)

* [50 CSS Libraries, Frameworks and Tools from 2014](http://speckyboy.com/2014/06/02/css-libraries-frameworks-tools/)

* [Web Field Manual](http://webfieldmanual.com/)

* [Tevko's resources](https://github.com/tevko/Resources)



## Javascript

* [Idiomatic JS](https://github.com/rwaldron/idiomatic.js)

* [Make your own AngularJS](http://teropa.info/blog/2013/11/03/make-your-own-angular-part-1-scopes-and-digest.html)

* [JavaScript Garden - Documentation on JavaScript quirks](http://shamansir.github.io/JavaScript-Garden/en/)

* [JavaScript hacks explained](http://blog.mdnbar.com/javascript-common-tricks)



## Other

* [Choosing the right hosting](http://www.pintsizedgiants.co.uk/blog/8/choosing_the_right_hosting)

* [HTML/JS/DOM/CSS hacks](http://www.quora.com/Web-Development/What-are-the-most-interesting-HTML-JS-DOM-CSS-hacks-that-most-web-developers-dont-know-about)