From zero to Web developer
From zero to web developer - in 14 actionable steps.
But, before we start, what is web development?
Web development is the work involved in developing a website or a web application. It can be quite simple, like a web presentation or portfolio. Or, really complex like a social media platform like Twitter or Facebook. Either way, this is one of the most exciting industries at the moment.
Disclaimer
Before I start with this short, actionable article, I want to make a disclaimer. There are multiple paths you can take while learning web development. This is only one of them. The one I would take if I had to do it all over again.
Who is this article for?
These steps are going from the very beginning, so it's suited for beginners in web development.
Let's start!
1. Choose a text-editor.
There are many available text editors: Visual Studio Code, Sublime Text, Web Storm, PHP Storm, and many others. I would suggest Visual Studio Code. It is an open-source project, has a ton of extensions and a huge community. You can get it here: code.visualstudio.com.
2. Learn HTML.
The HyperText Markup Language, or HTML is the standard markup language for documents designed to be displayed in a web browser. (Source: Wikipedia )
In simple words; it is a skeleton of a web page. Think of it as walls in a house. There are plenty of available learning resources. FreeCodeCamp is definitely one of the best. If you're not registered here yet, you can do it here: freecodecamp.org/learn/responsive-web-design
3. Learn CSS.
Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language such as HTML. (Source: Wikipedia )
CSS is basically the style of a website. This is how we define all the colors, layout, fonts... Don't rush with it, it may seem it's easy when you start with it, but it's not. Once again, I'd suggest FreeCodeCamp: freecodecamp.org/learn/responsive-web-design
4. Become better at CSS.
Still not feeling comfortable with CSS? you can take this free course on CSS by Google Developers. Link: web.dev/learn/css
5. Learn JavaScript
JavaScript is a programming language that allows you to implement complex things on web pages. Every time a web page does more than just sit there and display static information for you to look at—displaying timely content updates, interactive maps, animated 2D/3D graphics, scrolling video jukeboxes, or more—you can bet that JavaScript is probably involved. (Source: MDN )
You can learn it at Codecademy: codecademy.com/learn/introduction-to-javasc...
6. Build projects.
Improve your coding skills by building real projects. If you can't come up with ideas, try Frontend Mentor platform. There you can choose a challenge from a collection of web designs. You get starter files and code the design. It is perfect for beginners in web development.
7. Learn to use the command line.
There are several reasons why you should learn how to use the command line. Here are a few... You will need it to install packages needed for coding. To run the commands like starting the development server... You can use this course by Open Classrooms: openclassrooms.com/en/courses/4614926-learn...
8. Learn how to use Git and GitHub.
Git is a free and open-source distributed version control system designed to handle everything from small to very large projects with speed and efficiency. (Source: git-scm.com).
GitHub, Inc. is a provider of Internet hosting for software development and version control using Git. It offers the distributed version control and source code management (SCM) functionality of Git, plus its own features. It provides access control and several collaboration features such as bug tracking, feature requests, task management, continuous integration, and wikis for every project. Headquartered in California, it has been a subsidiary of Microsoft since 2018. (Source: Wikipedia ).
This is a nice intro to Git and GitHub for beginners, by Hubspot: product.hubspot.com/blog/git-and-github-tut..
9. Choose a JavaScript framework.
JavaScript frameworks are an essential part of modern front-end web development, providing developers with tried and tested tools for building scalable, interactive web applications. Many modern companies use frameworks as a standard part of their tooling, so many front-end development jobs now require framework experience. (Source: MDN ).
React and Vue are the most popular frameworks at the moment, so I'd suggest you start with one of those. You can learn another framework later. Brad Traversy has crash courses for both.
Here is the link to his YouTube channel: youtube.com/user/TechGuyWeb.
10. Build more projects.
Try to build something from scratch this time. Find ideas here: github.com/florinpop17/app-ideas.
11. Deploy projects.
Are you happy with the things you built? Deploy them. Services like Netlify (netlify.com) and Vercel (vercel.com) are easy to use.
12. Make a CV.
There are plenty of free CV builders available. I'd recommend this one. It's a free and open-source project: rxresu.me.
13. Prepare for a coding interview.
You can use Leetcode for this purpose. Here you can find a few more coding challenge platforms you can use to prepare for a technical interview: github.com/markodenic/web-development-resou...
14. Apply for jobs.
Again there are a lot of resources available. Randall Kanna created a repo with an awesome tech job hunting list. Here is the link: github.com/randallkanna/awesome-job-list.
Thanks for reading! Did I miss anything? Did you found an error? Have a question? Send me a direct message on Twitter, and we'll figure it out.
I have a helpful blog full of real-world web development tips and resources. Check it out if you're interested.