How I Got Started

Intro

You wanna learn how to code? Get in line. So does everyone else.

I am getting this question more and more from people wanting to make the transition to software engineering or are just interested in learning how to code.

I started from absolutely zero knowledge of anything, except for a tiny bit of HTML and CSS knowledge from Livejournal days. I really only kind of knew what HTML was and vaguely understood that CSS was a way to style the HTML.

So this post is directed at those who really know nothing and want to get started. The stuff here gets you up to speed for what you'll probably encounter if you apply to Hack Reactor. The resources are by no means complete and I'll likely be adding to this in the future.

JavaScript is a great starting point. And no, it's not Java.

I started with JavaScript (though I had a quick foray into Ruby on Rails). If you're starting out with no knowledge, I would persuade you to not jump immediately into Ruby on Rails (Ruby is a language, Rails is a framework). In my opinion, Rails is...magical. Too magical for someone starting out with only a basic understanding of objects, arrays, and functions.

JavaScript is pretty easy to get started on--there's no need to install really much of anything and you can get up and running very quickly.

Stick with client-side for now.

JavaScript is now a full-stack language and can be used for server-side, but I suggest newbies just stick with front-end for now. I wouldn't say it's necessarily easier than back-end (front-end has its own challenges), but it's easier to see changes.

Don't sweat it.

  • Google all your questions. Really, just GOOGLE ALL THE THINGS.
  • Read the documentation for things (jQuery, git, etc.)
  • StackOverflow is your friend (but be careful of some of the "answers" on there--people can write pretty shitty JavaScript)
  • Don't get frustrated
  • Embrace how lost you feel all the time
  • Learn to celebrate your successes and to not punish yourself for not "getting it" or not figuring something out right away
  • In JavaScript, console.log() is also one of your best friends

Some topics for your to-do list:

Here are some good items to get started with.

  • HTML & CSS - you don't have to understand all the nitty gritty details but be able to understand:
    • what they are & syntax
    • how to link to different resources
    • some basic things (font, colors)
  • JavaScript things
    • syntax
    • data types (objects, arrays, strings, etc.) 1
    • functions, methods--how are they different? what are they?
    • constructors 1 2
    • built-in methods
    • scope + closure
    • expressions, operators, statements, declarations
    • equality + sameness
    • basic data structures
    • etc. etc. etc.
  • jQuery - making JS things easier
  • AJAX + third party APIs (Reddit's API is easy to use)
  • Git - version control that is annoying at first but really great once you learn it
  • basic shell commands
  • basic debugging + using the chrome dev tools

Tools

  • Google Chrome - install it. The resources for it are good.
  • Sublime Text - It's free (as long as you keep ignoring the pay button)
  • Git - basic version control. Also, make a GitHub account.
  • People might tell you to get package managers (Bower, NPM), but you really won't need to get those until much later on. Don't worry too much about them.
  • JSBin and JSFiddle

Awesome resources:

I am sure there's a ton more stuff out there. Here's just some that I know and can vouch for. The * indicates that I highly recommend it.

Getting started:

  • MIT's Scratch - If you're under 10 years old and you don't want to write code yet (but like to drag and drop colorful modules).
  • Codecademy - I started out with Codecademy--it's a nice ease-in but it is no way comprehensive and don't expect to do be able to do very much after completing the course. It is a good way to learn syntax and lingo though. Caveat: It is boring as hell.
  • Khan Academy * - Their JS course is A LOT MORE FUN than Codecademy and I wish I had discovered it when I was starting out.
  • MDN Javascript * - a fantastic list of things to cover and clear explanations. This is a GREAT GENERAL RESOURCE that you will reference all the time.
  • Eloquent JS * - I read chapters 1-6 of this (FREE) book multiple times and it was one of my best resources. Chapters 5-6 get much more difficult to understand so don't get frustrated.
  • PYTHON: MIT's Intro to Comp Sci - Great intro, but for python.
  • Stanford's Open Courseware Stuff * - There was a great intro to computers course that was GREAT if you don't even know wth a bit and a byte are (which was me), what servers are and how the internet actually works.
  • JS for Cats * - Cats!
  • Coderbyte * - To practice your knowledge of basic to intermediate JS. Try to get past the easy level. The nice thing about this is that you can compare your code with other people's and see how they wrote theirs.

A little further down the road:

Other things

  • Udacity - Payment needed.
  • Try building some games! Here are some examples
  • Meetups! * - You might find some coding-focused meetups in your city. If you're in Seattle, San Francisco or NYC, you really have no excuse not to go to one
  • Egghead.io * - Paymet needed. Great resources but I would do it after you have a grasp of the above. The more advanced courses are more valuable.
  • Frontend Masters * - Payment needed. Great resources but I would do it after you have a grasp of the above. The more advanced courses are more valuable.
  • Youtube * - There are some great videos on YouTube. Just do a search.
  • Scotch.io - Step by step, more advanced topics.
  • Reddit - r/javascript and a bunch of other subreddits are great
  • Hacker News * - Stay up to date. You don't exactly have to understand or care about everything, but know what's up and what cool things are happening!

Things to Build

  • simple to-do list
  • a game! (2048, snake, tetris, a card game) -- Google for inspiration or some code to get you in the right direction. See link above in 'Other Things'.
  • a personal website using just HTML & CSS
  • mock another website's frontpage using HTML, CSS and a little bit of JS. Some easy websites to mock are the landing page of Facebook (what you see BEFORE YOU SIGN IN) and...Pizza Hut? :-)
  • use python -m SimpleHTTPServer and get a simple webpage running on localhost

Please comment or e-mail any good resources you find!

Good luck and happy coding!