Check out this great roadmap: “From Zero to Front-end Hero, Part 2” (Part 1 is for HTML&CSS).
Learn and use Github Pages to host your pages and sites: essentially a free, hosted, live version of your front-end repositories.
Jekyll is an amazing, lightweight front-end framework for organizing and generating files and partials. It’s got great documentation and was created by a Github founder. It’s an awesome solution for rolling your own blog or small personal site, and can be hosted for free on Github’s gh-pages.
- Prose.io: create MD files via a web interface that immediately show up on the appropriate Jekyll site (or just to the appropriate repository).
- Forestry.io: even better than Prose.io, it’s a lightweight content management system that mimics Wordpress’ functionality for Jekyll sites.
- Hydejack, one of my favorite Jekyll themes.
- Lots of Jekyll themes
- Planet Jekyll, an awesome showcase of many Jekyll themes
- Gorgeous HMFAYSAL Omega theme for Jekyll
- Liquid documentation: the Ruby-based language Jekyll uses to manage dynamic qualities in building your site.
- Tags and categories with Jekyll
- Jekyll tags from scratch
- Put interactive Ruby snippets on your blog
- Using static site generators at scale: specifically, Jekyll. Great read.
- Putting Disqus comments onto a Jekyll site: basically the comments feature below! (And this is a Jekyll site.)
- Implement Jekyll search using lunr.js: adding search functionality to a Jekyll site
- Create and publish your own Jekyll theme gem
- Documentation for jekyll-assets, a very useful gem for managing assets with Jekyll in a Rails-like way
Bootstrap is a super important front-end CSS & JS library developed and used by Twitter. Stylistically it brings you the look and feel of a professional product, and tons of people use it. Luckily, their documentation is really excellent.
- Bootstrap forms
- Free Bootstrap themes
- Material Bootstrap design: lots of great UI pieces to use, a good library to know.
- Bootsnip: free Bootstrap code snippets.
Material design is a concept developed by Google, which then developed into Materialize, a CSS & JS library, currently gaining hugely in popularity and competing with Bootstrap. The documentation is almost as good as Bootstrap’s.