So, you’re interested in learning web development and becoming a web developer? First of all, congratulations. You’ve made a great choice.
And since you’re reading this, you may already be an active member of a Facebook group, subreddit, or other online coding community. Which is a great place to start, and to find support throughout your chosen pursuit.
Again, you’re doing great so far.
So depending on your background, you might be wondering where to start learning web development. If you’ve mainly been Googling around, you may feel just a tad bit overwhelmed by all the languages, frameworks, and learning resources out there.
Well, don’t worry. You’re not alone. Google can be your best friend or your worst enemy. It just depends on how you use it.
Start with the end in mind.
One of the first things I recommend doing when starting out learning web development is to decide upon a clear end goal, and keep it in mind.
Maybe you want to make a career change. Maybe you have a wicked idea for an app. Or maybe you just want to learn for fun.
Whatever your goal, it’s important to understand why you are doing this. This understanding will help you be more productive with your learning time. It will also help encourage you through those times when you feel like giving up.
Remember, no matter how elaborate and far away the end goal may seem now, you can achieve it with hard work and perseverance.
Assuming you have no previous experience, it’s a good idea in the beginning to also decide if your interest lies in back end or front end development. Let me briefly explain the difference.
Frontend — this is what the end user see’s and interacts with on the page. Its all the design, fancy effects, layout and imagery that creates the user experience.
Generally front end developers will be visual creatives with excellent design skills and a passion for accessibility and user experience. Technologies often associated with front end web development are HTML, CSS, jQuery and JavaScript.
Backend — this is the part that typically processes, stores, and manipulates data. It’s how the website or application works. Back-end developers are generally good problem solvers, logical thinkers who are interested in the functionality of a website or application. Back-end development is usually associated with server side languages such as PHP, Python, and Ruby.
I knew right from the off that I just didn’t have that flair for visual design that draws many developers to front-end development. I probably found this decision easier than most as, due to my background in engineering and construction. I am naturally more akin to problem solving, and figuring out how things work, than making things look pretty!
Either way, wherever your interest lies, I still think that the best place to start is by learning some basic HTML and CSS. After all, it doesn’t matter what area of development that you ultimately want to work in, you still need to be able to display it on a webpage in some kind of mildly presentable form.
First things first, head straight over to freeCodeCamp or Codecademy and take their “HTML & CSS” courses. This should give you a feel for what these technologies are all about.
Also, due to their interactive learning environments, they will also get you started writing code straight away, rather than having to figure out how to setup a local development environment first. Nothing will build up your confidence more than writing some code and passing some tests straight away.
Once you have done that, congratulations! You have started on your web development journey.
Its now time to practice. This may seem hard at first. It’s hard to find time when you have a full time job, school, a partner, or kids all demanding your attention.
But consistency is key. You’ll learn much more by coding for an hour every day, rather than spending seven hours coding on a Saturday.
Humans are creatures of habit, so make coding part of your daily routine. Make time and keep going.
Eddie Hall Truck Pull at WSM 2016
Learning to code is like trying to become the Worlds Strongest Man.
If you’ve ever watched the “Worlds Strongest Man” competition, learning to code is very much like the truck pull event. It’s so hard to get going at the start. It seems like an impossible task. You are just taking baby steps.
But once you get that truck rolling, it gets easier and easier, until you find yourself running towards the end! Ok…maybe not running! ☺️
If your learning style is more suited towards video tutorials then also check out some of the HTML and CSS courses that can be found on YouTube.
I can personally recommend these two free Udemy courses by Edwin Diaz and Brad Hussey. Both are great instructors (if not a little quirky). And both courses will cover setting up your development environment, downloading a text editor (I like Sublime and Brackets), and building an actual project.
A quick word of warning: while Udemy is great, don’t getting sucked in to buying loads of courses. At this early stage, there is no need to be spending any money on learning resources. There’s no shortage of awesome stuff that is available completely free. And this early on, you probably aren’t 100% sure what you want to learn anyway.
Amazing communities like freeCodeCamp are making education for the masses completely free. And seriously, if you apply yourself correctly, you really don’t need to spend anything.
One of the beautiful things about both web development and the web development community is that it doesn’t discriminate. There are no barriers to entry. And most of the more-experienced members of the community are willing to help, advise, and give their time for others.
You don’t have to be a HTML or CSS expert before you can start building things.
One thing I want to stress before signing off on this: you don’t in any way need to be a HTML and CSS expert before you can start building things, or moving on to learning a server side language.
You don’t have to spend months and months doing tutorial after tutorial. Don’t get stuck in the coding tutorial rut. Once you have the fundamentals down, you can learn as you build.
Templates aren’t the enemy.
Something else I found useful when starting out is to work with templates. Now don’t hate on me just yet — hear me out!
Just a few weeks after I first opened a code editor, I was able to launch a professional-looking website for my brother-in-law’s business. This website was based on a $12 template, but there are plenty out there that you can pick up for free.
I know some people will raise eyebrows at what I just said. But as a beginner, I could work with code that was already well-structured and formatted. This also enabled me to build better projects, which boosted my confidence and enthusiasm for web development.
This experience taught me how to read documentation (which is a very important part of being a developer). It also introduced me to technologies such as jQuery, and gave me a chance to work with JavaScript.
Another point that I should make is that a lot of web design agencies and software companies use templates on a day-to-day basis.
A template doesn’t build an amazing website, but it does provide a framework upon which you can build a fantastic website. I work at a product-based software company, and we use templates on the frontend of our products. This means we can concentrate our time on the functionality of our product and not waste valuable time re-inventing the wheel.
That being said, if your end goal is to become a great front-end web developer, then you need to spend time mastering these skills. What I’m saying is, don’t let it hold you back, don’t get bogged down doing tutorial after tutorial.
Get building!
If you enjoyed this post and are interested in similar stuff, check out my next post: It's been a while....
Want this and other exclusive content delivered straight to your inbox? Sign up for my newsletter 📰.