How to be a Web Developer in 2k19 Part 2: Your Roadmap to success

In the previous article we spent time talking about who a web developer is and what web development is all about; the perks and caveats. Here we’re going to be talking about what your road map should look like, your development path and journey, how it should look; what you should learn and what you probably shouldn’t.

This is the second part of my how to be a web developer in 2k19 series, if you missed the first part, go check it out here.

Before you begin let’s talk about the basic types of web developers, this is important when starting out because you don’t want to spend valuable time learning what you may not need. There basically are two types of web developers (there’s a third though, but don’t bother so much about that for now). The Front-end and the Back-end developer. The Front-end developer is concerned with the design and presentation of the webpage, his work has to do with the looks of a website, how it appears and feels; whereas the Back-end developer concerns himself with how the website works, how it handles and manipulate data, how it can store users’ info, how it can deny a user certain privileges and the like. How do I know which path I fit into? Simple, if you’re the design kind of person, you have a great taste for looks then the Front-end, but if you’ve always been bad with color combinations and don’t really care about looks but rather how to handle data, how to do those behind-the-scene stuffs then the Back-end. There’s a middle ground, the Fullstack developer, who handle both ends, don’t concern yourself with this for now (not advised for starters), I’ll talk about this in another article. That being said, let’s move on.

First off, before you begin learning any languages for the web you should have an overall knowledge of what the web is, you’re about entering into the web development field, you should know how it works first. Learn how the internet works, YouTube would be best for this; search and watch videos on YouTube on how the internet works. Then learn the difference between the internet and the web, learn about protocols: hyper text transfer protocols (http and https), learn domain name servers (DNS), learn about servers and what they are, read about cloud computing, read about browsers, read about webpages. This should make up your first week. Before you move over to begin learning the web languages, download an IDE (Integrated Developer Environment), I use VSCode, you can try Sublime text too; they’re about the two most popular.

You’re now ready to move on to more serious stuffs (not so serious when you go deep, lol). You’ll spend your second week learning about how to structure webpages (this is what you’d be creating from now onward). In this week you’ll begin your first ever web language: HTML which stands for HYPER TEXT MARKUP LANGUAGE (remember “hyper text” transfer protocol? There’s a link between these two). So what is HTML? Simply put, HTML is the language of the web, the language every web developer writes, it’s not a programming language (don’t be a html programmer please), it’s just a markup language meaning it describes the structure of the document (webpage in this case) by assigning tags to differentiate texts. It’s used as a way to format the webpage (it’s fine if you don’t understand this immediately). Where can I learn this and what’s the best method to learn HTML? To begin learning HTML, go to W3schools and follow the HTML tutorial there. Check out freecodecamp.org and follow the HTML tutorial there, I’ll advise you to stay clear of video courses for now, save that for later. Also check out some HTML documentation on MDN (really great and detailed resource). Learn how to inspect elements on your browser (tip: using Ctrl + Shift + I), learn to use your browsers developer tools. Spend about a week doing this, no more than a week; you don’t have to learn every tag and attribute there are, the most important are OK to get you started, as time goes by you’ll learn more tags that would be useful to you.

In your third week, now that you know how to structure webpages, it’s time to start doing something more rewarding like making those pages look real and beautiful; this is where CSS comes in. CSS is short for CASCADING STYLE SHEET. Like HTML, CSS is also not a programming language but rather a styling language used to style webpages, in other words, CSS is used to make webpages look presentable. To learn CSS, like HTML stay clear off video courses for now and don’t bother about learning every property and value there are. Check out the CSS section on W3schools and learn the basics of CSS; follow freecodecamp.org CSS tutorials too and check out MDN docs on CSS too. By your fourth week, move on to more advance CSS concepts (skip this entirely if you aim at being a Back-end developer, leave it to the Front-end’s); read about Responsive Web Design, learn Media queries, learn CSS Flexbox and Grids, learn CSS transitions, translate and animations. By your fifth week, move on to a CSS framework (a framework is simply code written by someone or group of people that help you code faster). Learn Bootstrap or Materialize CSS, I’d advice Bootstrap though because it’s the most popular CSS framework; now head over to getbootstrap.com and begin reading the documentation and using it. Learn to add themes to bootstrap, head over to bootswatch.com. With this you’d be able to do so much more than you have previously learnt. A point worthy of note though for the Frond-end devs; as a beginner when you learn about Bootstrap or any other CSS Framework you choose, limit your usage of it, learn how to get those stuffs done yourself using pure CSS (CSS without a framework) because over dependence on CSS frameworks can really limit your knowledge, value and skill (for Front-end devs only, use it to your advantage as a Back-end person); that aside let’s move on.

Now you have learnt so much in your first five weeks, it’s time to build something and really see how all these things fit together, but before we move on, let me clear some misconceptions that some of us might have; some might argue that this is so ridiculous, how could you advise a beginner to go this fast and this far in just few weeks, the pace is crazy and so forth. Well, you might be right in a way, but here is what I have to say concerning that; as a beginner, one of the mistakes you can make is trying to learn everything first, another mistake is spending too long learning stuff which stems from the first mistake; as a beginner you are already way behind, in the part one of this series I made mention that as a web developer you never stop learning and the truth is that you would keep learning, learning in truth happens when you actually try to apply the knowledge you have incurred, that’s the real learning and it doesn’t happen until you start building stuffs, making mistakes, pushing yourself to go beyond your limit, forcing change. As a beginner you want to get yourself on point with everyone other developer out there as quick as possible (of course they will always be ahead of you in terms of experience), and that is why it’s when you begin to do real stuff that you begin to get the real experience that will differentiate you from a beginner. You want to get yourself on the same page with the rest of the world as quick as possible. Trying to learn every HTML tag and attributes there are and every CSS property and value there are is indeed a wild-goose chase; my advice is to learn the basics, learn some basics tags and attributes, learn the basic properties and values for formatting text, positioning elements, learn about applying background colors and images, learn the basics of the box-model, learn about margins and padding, learn about borders and the like. The point is just to see what it really is like, then when you begin building stuffs you would begin to see how it all fits together and learn some things you didn’t learn during the initial period, you gain hands-on experience which is what the employers out there really care about, not how many tags you know and don’t know. The wisest man once said, “to many books there is no end and too much learning wearies the body.” So learn quickly and begin doing!

With that misconception cleared out, let’s move on. Now in your sixth week, build some really simple projects, don’t look for anything too complex yet, you’re not that skilled for it yet. You can follow up some sample projects on freecodecamp.org, build a simple photo gallery, build a simple blog post, build a simple magazine homepage. Build one using HTML and pure CSS, then build another using HTML and any CSS Framework you had previously learnt. Try doing this on your own, if you get really stuck, then ask for help, do some search and so on, make sure your pages are responsive. Make mistakes and fix them, use your browser’s developer tools to assist yourself, that’s how you really learn.

Now that you’ve created your most basic website, it’s time to learn how to deploy your code to the cloud (it doesn’t make sense if it just sits on your PC). How can the world see it if it remains on your local machine, you have to put it online and out there. To do so, you would need to learn Git and Github; Git is a version control system while Github is a cloud-computing platform that uses Git, where you upload your code. There are other platforms that you can upload your code asides Github but it’s by far the most popular which means if you fall into trouble one of your buddies can easily help you out compared to the others. So head over to Git Bash, install it to your machine, read some of the installation and usage docs; learn to create a repository (simple for where code lives), learn how to make commits and push your code online into your repository, learn to clone a repository (repo), learn to update your local code base by pulling a repo, learn to create branches and make pull requests. Go ahead now, make commits and push the projects you created in week six to the respective repo’s you created for them. Some good resources here. This should comprise your seventh week.

Time to learn our first programming language, JavaScript! Now that you have a basic understanding of the web and can build a few things and deploy code online, it’s time to learn how to make your pages interactive and real, time to build cool stuffs. To do this, in week eight you would be learning JavaScript (the language of the web), for this I would recommend you take a video course and go a little slower and this can be more difficult to grasp compared to all you’ve learnt. Take about two weeks, learn from basic to intermediate concepts. Then by week ten, begin learning how JavaScript works with webpages; learn the DOM (Document Object Model). Check out this course, head over to the JavaScript section. After learning and doing some practice, it’s time to reinforce your newfound knowledge to build an interactive page.

Spend your eleventh week working on a few JavaScript projects, try adding interactivity to some projects you created in week six. Add a menu, add some sliders and carousels and so on. Don’t forget to deploy your code. By week twelve, you can take a break and relax. Admire your achievements and refresh your mind. Resting is important too and it helps you unwind and prepare you for more challenges. If you followed everything well and know what you’re doing at this point it’s safe not to call yourself a beginner anymore as you would have really advanced.

It’s time to begin learning some JavaScript frameworks and libraries. Week thirteen, you’d learn about the most popular JavaScript library for building user interfaces (UI), React! Skip this section entirely if your goal is to be a Back-end developer. There are other UI frameworks like VueJs which is really becoming popular but I advise you stick with ReactJs for a start because it’s the most popular with more jobs expect you have a strong reason to do so. Simply follow any video tutorial of your choice; you can check out Brian Holt's course on Front end masters, or Tyler Mcginnis course, Mosh Hamedani’s mastering react is also gold. Take your time learn about it and be done in no more than five weeks, the learning curve isn’t that high. This is obviously the last technology you’d be learning as a Front-end dev, hurray! Don’t forget to reinforce your newfound skills by building React projects.

If you chose the Back-end path, then after learning vanilla JS (JS without a framework), the next thing you want to learn is JS for the Back-end, this is where nodeJS comes in. Learn about nodeJS, NPM, ExpressJs and a database (MongoDB is the most popular along this path). Follow some video courses online, if you downloaded the complete web developer bootcamp from the JavaScript section, Colt Steele has a nodeJs section that is very beginner friendly, you can also check out some nodeJs courses on Front-end masters.

Now that your skill set is polished, the next thing on your radar would be getting a Job, some tips; build a simple portfolio page using the skills you’ve amassed (HTML, pure CSS and JavaScript) avoid frameworks as this is just a light project. Get your portfolio page live using Github pages or you can check out the free plan of some cloud computing platforms like Azure, Heroku and the like. If you have money buy a domain name and add to your portfolio page. Keep working on projects, work on open source projects if you can, join a friend or community and work on large projects, your goal is to add to your resume and increase your portfolio and commits, do this even if there might be no payment, your employers need to see that you have some working experience. Build a developer resume, you can check Canva for some really nice templates and edit to your taste; check out articles on how to create a good and compelling developer resume. Learn to solve algorithms using JavaScript, check out this resource. Check Hackerrank for some algorithms and solve them, this is important for technical assessments from companies. Build a linkedIn profile and check for Jobs around you. Get into an internship and put your skills to the test. One final thing, don’t be scared to apply for a Job when you see one, thinking you’re incompetent, of course if you don’t have the required skills you can leave it out but if you do, why not apply? After all, you have nothing to lose.

Finally, after about five to six months at max (don’t stay too long please), you must have gotten to this point, remember and keep in mind the fact that you don’t know everything. Be humble and willing to learn from others above you, don’t think you know it all. Keep learning, keep studying docs on MDN. Download some JavaScript books like EloquentJs and You Don’t Know Js and read them all up if possible. Learn coding best practices, read books like Clean Code and Clean Coder, follow developer podcasts and articles like this (always check back here for updated articles), subscribe to YouTube channels for developers. Join a developer community around you, offline and online and keep growing; remember, you never stop learning as a web developer. Learn Software Engineering methodologies, always learn and learn and learn. Put yourself out there, create a twitter account and follow other developers if you don’t have one, teach others behind you (really great way to learn too). Rest assured, the sky will only be the stepping stone. Cheers!

This is the second part of my how to be a web developer in 2k19 series, if you missed the first part, go check it out here.

Don’t forget to comment below, share your thoughts and also share with friends. Happy New Year!