Crash Course on Modern Web Development
Step 0: HTML/CSS/JS and basic tools 1~2 weeks
The prerequisite to become a modern web developer is having a good grasp of the tools of the trade.Â
HTML/CSS/JS
The foundation of the web.
Git
Organize your work, get globally available versioned backups, and collaborate efficiently with your colleagues.
Text editor
All these text editors have broad support for the tools mentioned in this article. Therefore, which one to use is mainly a personal choice. Pick your poison! I’m using Atom with vim-mode nowadays.
Social
Social profiles are the modern CV. Join meetups to find people with similar interests, open source and share your work, and get paid while doing it.
Step 1: Learn Ruby and Ruby on Rails  1~2 months
Ruby, together with Ruby on Rails, has become the staple of web application development in the startup world. Be it as the API server for your single-page Javascript application, or a full-fledged solution serving your server-rendered web app, Rails covers all the needs of a starting to mid-level  (~1 million monthly impressions) web app.
Ruby
Ruby on Rails
Get acquainted with the community
Task: Build an open source web app
- Create a new repository on GitHub
- Check the Open Source ethos (licenses, procedures, etc)
- Examples: www.opensourcerails.com, Gittip, NewsBlur…
Step 2: Refine your skills 2~3 months
General programming
- Code Academy
- Coursera
- Code School (paid)
Frontend
CSS + HTML5, JS.
Concepts:Â
- Responsive design
- Caching
- Performance
- Browser independence
Frontend frameworks:
- EmberJSÂ +Â Rails integration
- AngularJSÂ + Rails integration
- Backbone + Rails integration
- React + Flux + Rails integration
Here’s a nice comparison of the three.
Backend
PostreSQL, NoSQL (MongoDB and friends) Redis, Sidekiq, RabbitMQ…
Concepts:Â
- Emailing
- Algorithms
- Databases
- Caching
- Security
- Performance
- Consistency
- Concurrency
- …
DevOps
- Deploying tools Capistrano, Chef, Vagrant, Docker…
- Sysadmin tools: bash, sed, awk, grep, man, curl…
Task: Refactor and optimize your app
Step 3: Branch out to an alternate technology  1~2 months
Task: Apply it to your app
Rewrite the front/backend of your app, or extend it with new functionality, using what you’ve learned so far.
Step 4: Dip your toes into the unknown  1~3 months
- Android
- iOS/Mac OS X
- C/C++, Java, Python…
- Windows development (Mono!)
Task: Expand your market
Extend to a mobile device or native platform.
Step 5: Present yourself
-
Create your own personal page, example
-
Add your profile to professional networks:
-
Synthesize it all on your CV
Step 6: Make some money!
Monetize your creation
- Google Play Store / Apple App Store
- (Micro)payments: Bitwall, Square, Stripe…
- Ads
Join a company
-
Find a company you like. Examples:
-
Heroku
-
Soundcloud
-
XING
-
Wuaki
-
Railslove
Freelance
Start your own thing!
- Startups:Â angel.co
- Incubators/accelerators: Y Combinator,  Berlin Startup Academy…
- Facebook groups: Berlin Startups, Barcelona Startup Jobs…
Mostly, have fun!