This post was previously titled “What (technical things) you should know to get started learning web development.” While my intention in writing this guide was to give the reader a leg up before joining a code school, it fundamentally isn’t more than a guide on building and launching a basic website.
Hey! If I sent you this link it’s probably because you’ve expressed interest in code schools. This article is adapted from an email I found myself sending out to many prospective students. I’m eager and happy to share what I know. You can read about my experience here, just for a bit of credibility. Feel free to reach out to me with any questions or feedback!
There are many more resources online than I list here. In fact, everything that you will learn from a code school you could learn for free somewhere online. HERE’S A GREAT LIST, but it is unordered and relatively unopinionated. It’s compiled by Zed A. Shaw, who produces a huge amount of good, useful, and correct work for people who want to learn to program. He’s also wrong about some things.
THIS IS AN OPINIONATED ARTICLE. I’ve worked for two code schools as a TA, but the writing here does not represent either of their admission guidelines. Most code schools will let you know what their prerequisites are before you even apply. A great many don’t expect you to know anything about programming before you get started.
This article describes fundamental skills for the true beginner learner (e.g. working with the terminal and text editor, HTML, CSS, basic JS, version control, static site creation), and lists resources for learning each of them.
Here’s what you need, like, in a physical sense:
A computer with OSX (Apple) or Linux. If you have Windows, you’ll really gain a lot by switching to Linux, which is a free operating system similar to OSX in many ways. Let me know if this is an issue and I’ll help you out, I’ve done this a couple times! There are many good guides out there, but here are some of them:
Here’s are some programming fundamentals, and resources to start learning them online
First, you must learn to navigate the command-line, which is how nerds interact with computers. The Command Line Crash Course is a great way to do this.
Cool, now let’s get you set up with a text editor. Microsoft Word and Apple Pages are word processors, not text editors. The difference is important for us. I personally use one called Sublime Text 2, which is good but will pester you to buy it. Atom is very similar but free; I recommend it. Download the Atom text editor here.
Now for writing code, the whole point!
Languages like PHP, Ruby, Python, JS, and many others are used for server-side (back-end) code. You have a choice about which of those to use, but they are not the concern of this article. Web sites can only be built with HTML, CSS, and JS.
Khan Academy’s course is really quite good for total beginners. Creating an account to keep track of your progress might be a good idea, but is 100% not necessary. Do:
- Intro to JS: Drawing & Animation.
- HTML/JS: Making webpages interactive
- Intro to HTML/CSS: Making webpages
Much of it is either very simple or irrelevant, but make sure you are comfortable with the “Functions”, “Arrays”, “Objects”, and “Object-Oriented Design” sections specifically in the Intro to JS portion. Don’t get hung up on drawing shapes and animations, but take your time with the other things.
Once you’re comfortable with these three fundamental languages, you’ll be able to build static web pages. We’re gonna get to that real soon. NICE.
Version Control and git
Version control (VC) is how developers save their work. It’s allows users to save many snapshots of the state of a piece of work, so you can do a bunch of work without worrying about overwriting previously existing stuff. VC is weird and complicated, but there’s no way around it. The most common VC tool is called git.
Here are some resources:
- This CodeSchool tutorial on git is very simple but a good start.
- Rails Tutorial by Michael Hartl has a useful section on git, but it uses BitBucket to host files instead of GitHub, which is less common. The same rules will still apply.
- Jessica Kerr’s great talk ‘Git Happens’ is at a fairly advanced level, but very well explained.
You’ll need to be familiar with GitHub, a service that stores version-controlled code for you. Create an account at github.com.
Once you’ve got all this down, start building a Github Pages site. Practically all developers have one, and it can be found at [GitHub username].github.io. Here’s mine! It’s vcolavin.com, but hosted at vcolavin.github.io
Here’s some extra credit stuff for HTML and CSS which you may find useful when building your site.
- Semantic HTML and CSS
- Positioning (Learn Layout and CSS Tricks)
- Floating (CSS Tricks)
- CSS code organization
- CSS Tricks is a great resource, in general.
If you’ve done the above and are comfortable with the material, you have, in my opinion, a solid foundation. It is far from being everything you need to become a web developer.
Here’s some other stuff if you finish that and want to continue learning, or get bored, or want more variety. It’s pretty unorganized.
The request-response cycle, which is the fundamental way computers on the web communicate with each other.
An introduction to Ruby, a nice language for the back-end:
Object-oriented programming, the principal paradigm used in Ruby:
- Pomodoro Technique (I highly recommend that you use this!)
- Tomato Timer app for the Pomodoro Technique
- SourceMaking, a site that you can spend a million years on and still learn useful, cross-domain things.
- Mozilla Developer’s Network (MDN)