Subscribe
Web Development From Scratch

How I Went From Nothing, To Making $80,000+ A Year, Learning Web Development From Home

Preface

There are few people that can wake up every day and enjoy working their job. I am lucky enough to be one of those people, and so can you. If you’ve been wondering how to get started in the Web Development field, I’m going to give you the exact formula that I used. Before we start, the important thing to remember is, these steps may not be the optimal way to become a Web Developer. They are simply the steps I took on my path to becoming a developer and may have varying results for others.

I’m writing this article because, at the risk of sounding brazen, I feel I’ve accomplished something significant by getting where I am today. If I can some how help others do the same, I feel it’s the least I can do considering how blessed I have been.

With that said, let’s get started.

Learning The Basics of Web Development

Nothing I can do for you will replace the need to learn to basics. Web Development is, informally, seperated into two categories. Front End and Back End development. I know a lot of people get hung up on which they want to persue. Luckily that won’t be the case in this scenario, because, in my opinion, you need to understand at least the basics of both to get started as a Web Developer.

I see a lot of articles disputing the use of various online resources. Some developers will tell you not to use w3schools, and others will swear by it. The simple truth is, when you get to the point where you want to argue semantics about how valid a learning resource is, you likely already know enough about the topic to formulate your own opinions.

Learned Html

On the road to becoming a Web Developer, I started where, in my opinion, everyone should start. Html. Html is the absolute most basic tool required for becoming a Web Developer. All website will require the use of html and it’s a solid base to get started.

On my journey to becoming a Web Developer, the very first step I took was to complete this tutorial: w3schools. Make sure you truely understand the tutorial from tip to tail. A lot of what you learn beyond this step will require your knowledge of html, or at a bare minimum, your ability to use it as a reference.

Learned CSS2

My next step, after learning html, was to learn css2 (Cascading Style Sheets). There are two main versions of css currently in use. Css2 is supported, essentially, by all browsers. I say essentially because of Internet Explorer. Internet Explorer has many exceptions that you’ll learn about as you go. Css3 is the new kid and is picking up momentum but has yet to become an industry standard. After you become familiar with css2, you can feel free to learn css3 at your leisure.

When you first start learning css, you’re going to love it. It’s powerful and lets you bring your websites to life. Later down the road, you will likely hate it. At least I know I did. It can be difficult to debug at times, and everyone has a different style of writing their style sheets. Again, I used w3schools to learn css. It comes in convenient modules and is easy to digest. Check the tutorial out here.

Learn To Slice and Dice

Did you know there is an entire industry that is focused on what are called PSD to HTML jobs? This was my next stop on my progress to becoming a Web Developer. Learning to move a Photo Shop file to a fully functional html page is considered an extremely valuable skill, in the Web Development industry. Not only is there a lot of work for PSD to HTML conversions, they don’t require a whole lot more knowledge then what we’ve discussed already. The downside? People almost always pay flat rates for PSD to HTML. That’s good news if you can learn to work fast, but they are often under paid jobs anyway.

Although this step requires you to own a copy of Photoshop, it’s also the first step in the process where I gained a fully marketable skill. I learned to slice PSD files and convert them to html by doing as many tutorials as I could find. I’ve taken the liberty of selecting a few that I feel could get you started:

Two of the links are premium member required but, in my opinion, the small monthly subscription fee is greatly worth the cost. Nettuts also offers a premium marketplace for tutorials written by extremely skilled developers for you to learn from. It might be worth your time using their services to find some good quality tutorials that are still relevant.

Built A Portfolio

My next step was building a portfolio. At the time, I was intially interested in Web Design, so I decided to design my own website. Looking back now, it’s extremely clear that I don’t have an artistic bone in my body. Needless to say, I wasted a lot of time attempting to becoming something I’m not. Luckily, assuming you aren’t interested in Web Design, you can learn from my mistakes. Set up a cheap host, install WordPress, and install a premium theme. I’ve already written a short tutorial on how to do exactly that. Your portfolio won’t be very robust at first, because you haven’t landed any actual clients. Luckily, I had done many tutorials and had lots of case studies to fill my portfolio up in the mean time.

Got My First Job

My first job was from the oDesk marketplace and paid $10/hour. Looking back on it now, the idea of working for so little is absurd. You have to step back and look at it from a clients point of view though. You don’t have a formal education, you have no previous clients, and you’re brand new to the industry. Ten dollars an hour is probably all someone is willing to risk with those type of prospects. The important thing, when approaching market places like oDesk and oDesk, is to make a complete profile that highlights your attributes.

So what are your attributes? Are you a native English speaker? I can’t tell you how much that means to people. Are you clientless and can devote 100% or your attention to one client? People love that. You need to really think about what you can offer a client that doesn’t include previous experience. Also, when applying for jobs on oDesk, be friendly, personable, and responsive. Half the time, if you reply fast enough, you can land the job before the client even recieves responses from other developers.

This stage was so crucial to my success as a Web Developer. Getting over that hump of not having experience is where you really become a professional. It’s important to stick with it, no matter what. Beware though, if/when you land that first gig, you better deliver what you promise. One black mark on a job market can haunt you forever. If you’re having difficulites or if you even suspect that you might not be able to deliver, you need to talk to your client immediately, explain what is happening, and figure out how to mend things. Being upfront with your client about the situation is paramount and will always be a crucial tool in client developer relationships.

Raised My Rates

If you are able to deliver on a job or two, you’re going to start seeing a sharp increase in demand. People will see, through your feedback, that you are competent but also cheap. I think we all know what to do when demand overcomes supply. After one or two jobs, I raised my rates. My memory is foggy but I believe I went from $10/hr to $15/hr. The amount you raise your rates is really up to you. After raising my rates, I began to see a decrease in demand but an increase in the amount of work I was receiving from each client. That meant less time spent looking for work, which translated into higher net cash in my pocket.

Learned WordPress

The next step on my path to becoming a Web Developer was learning WordPress. This is also where I got my first taste of Back End Web Development. WordPress is built using PHP, which is a server side scripting language. It’s fairly easy to learn and widely used. More importantly, WordPress accounts for something like 20% of all websites on the internet. That is huge! It also means there is a massive amount of work for competent WordPress Developers. So I did what I always did thus far, started pounding out tutorial after tutorial to learn WordPress. My main focus was Theme Development. It allowed me to combine my knowledge of PSD to HTML and was relatively easy to learn, compared to plugin development. The most effective type of tutorials were the PSD to WordPress tutorials. I was able to maintain a sense of understanding while still learning the process of building WordPress Themes from scratch. Again, check out Nettuts for their extremely well written articles on WordPress Theme Development.

Hit The Markets

Once I was confident that I could build out a WordPress theme, I updated my oDesk portfolio and profile. I started to market myself strictly as a WordPress Developer. I think really narrowing in like that gave me a relative edge over other developers, at the time. I sent applications out for jobs that were specifically WordPress related. By doing that, I continued to build my specialization as a particular type of developer. All the while, I continued to raise my rates modestly to reflect the amount of expeirence I had.

Eventually, I started getting job invitations. This was the turning point in my career as a Web Developer. Once I started receiving job inviations through oDesk, I was able to begin picking and choosing jobs that I felt were beneficial to my portfolio. It was a completely different feel then when I started. It’s almost like, up until that point, you feel like you are faking the whole thing. My portfolio started getting a little more robust and my confidence as a professional began to increase. I used this new confidence to network locally, which produced some good contacts.

Grew As A Developer

It took me about two years from when I started to really get a feel for where I wanted to take my career. I had landed some well paying clients like Break Media, developing WordPress themes and plugins and was already grossing over 80k a year. My hourly rate was sitting around $50/hour CDN, and I was able to pick and choose jobs that came up. Although WordPress had been good to me, I began to grow a deep seeded hatred for Front End Web Development. Pumping out theme after theme was no longer satisfying my interests, so I knew it was time for something new. This is when I decided to move into Web Application Development.

Developing Web Applications, although still involving some front end work, is where you begin dipping into languages like Ruby and Python. After reading some tutorials and using my best judgement, I decided to take the plunge with Python. I now work full time contracts as a “Software Engineer” developing and maintaining python based Web Applications.

Conclusion

If I were to offer a single piece of advice to someone interested in Web Development, it would be this: Don’t spend your time wondering how to do something. Just do it the best you can. You will learn the wrong thing, make bad choices, waste time, and be pissed off. That’s all part of the process. There is no 100% perfect way to become a Web Developer except to be consistent. If you stick to it, you’ll end up where you need to be, one way or another.

Leave any questions you have in the comments. I’m more than willing to offer any advice or clarifications.

14 Comments
  1. Nice post Colin. All useful information.

  2. Good for you. I love working with new developers and helping them grow. Going freelance is hard but after some time you will be working direct with clients like I have / Yahoo and others ..

  3. The summary hits the nail on the head.

  4. I’ve been thinking about diving into this for about a year now. Dammit, it’s time to get started. Thanks for the article.

  5. Inspiring! Glad you shared this.

  6. this is sooo helpful!!!

  7. How much time elapsed between your first W3Schools HTML tutorial and earning $80k annually?

  8. Hey Colin,

    Great article! I really need to get more onto my odesk profile and take on additional jobs through there.

    I like the strategy you’ve laid out for learning dev. It is very well though out.

  9. Great post

  10. Thanks for this Colin, very inspiring and encouraging! :)

    I have a couple of questions, would be grateful if you could explain:

    1)When you put together your first portfolio(without any real work experience), what do you mean by ‘case studies’? Did you use the rough layouts and ideas represented in the tutorials to base your work on, or did you come up with completely new designs?

    2) How did you present the portfolio – using images of the final product and descriptions of what it could do (scripts etc) or did you set up a separate dummy website for each one for the client to check out interactively? I’m thinking of going on oDesk but can’t decide how to present my work.

    • Hey Bonnie,

      1) Case studies are basically what I call any type of work that you do in the interest of learning. This would include things like tutorials or small side projects you use to learn a new tech. My first portfolio pieces were just straight up tutorial results, unaltered.

      2) I used a mix of both. A good way to do it, is to set up sub domains of your domain, example tut.learntodev.com and use those sub domains to host your tutorials. That is assuming they are fully functional website type pieces. If it’s something small and modular enough, I would just add it as it’s own page within your portfolio site.

      Odesk actually has it’s own portfolio system which is pretty easy to set up and allows you to display your work.

      • Hi Colin, thanks for the answers, I’ll take all this on board! It all seems quite daunting but your articles have given me some much-needed confidence. Thank you ever so much!

Leave a Reply