Web Development Learning Path for Beginners

Adrish Shahid
4 min readSep 23, 2021

--

Web Development Learning Path

When you’re just starting out, finding the best path and right resources can be challenging. So if you’re a beginner looking to enhance your skills and reach higher levels of software engineering, this learning path will help you achieve your goal.

Fundamentals

If you’re pursuing a career as a professional software engineer, you should dedicate the first three to six months to mastering the fundamentals.

Language: Professional software engineers often know more than one language, but since you’re starting out, just focus on one language. I recommend you learn either C or Dart first, even if you’re not planning to use it in the future. While everyone out there will recommend you to learn either Java or Python, I wont because both C and Dart are classic programming languages with amazing features. Once you learn DART, you can quickly and easily switch to similar languages like JavaScript, C#, C++, etc. This article can give you a better insight on why should you learn Dart.

Data Structures and Algorithms: Studying classic data structures and algorithms helps you improve your programming and problem-solving skills. These topics are frequently asked in coding interviews.

Design Patterns: Design patterns are engineered solutions to common problems in software design, and are often asked about in coding interviews. There are 20 classic design patterns commonly known as GoF (Gang of Four) patterns.

Frontend Development

Every web or mobile application has two parts: a front-end and a back-end. The front-end is what the user sees and interacts with. It’s the app on your phone or the website you visit. So, front-end developers are in charge of building beautiful, interactive user interfaces. The average salary for a Front-End Developer is $86K per year in the United States.

Front-end development starts with HTML and CSS. These are the languages behind every web page on the Internet. HTML and CSS are only used for building static pages. To add functionality to a page, you need to learn JavaScript. You can also learn TypeScript that is basically a superset of JavaScript which in the end compiles to JavaScript.

Modern applications are complex. That’s where front-end tools (libraries/frameworks) come to the rescue, helping us build and ship applications faster. The top 3 tools in this space are React, Angular, and Vue. Out of these, React is the most popular so that’s what I recommend you learn first. You can always learn about other tools as needed.

DevOps Tools

One of the must have tools that you’ll need in your arsenal is Git. Git is software for tracking changes in any set of files, usually used for coordinating work among programmers collaboratively developing source code during software development. Its goals include speed, data integrity, and support for distributed, non-linear workflows. Another important tool is Docker. These days more and more companies are looking for software engineers who know a bit about DevOps: a set of practices for delivering software. Docker is the core tool used in this space. Knowing it helps you reach higher levels of software engineering.

Backend Development

The back-end is where the data gets processed and stored. The average salary for a Back-End developer is $79K per year in the United States. These are the skills that are listed in most job descriptions. Every back-end developer must know how to work with databases, version their code using Git, collaborate with others using GitHub and potentially ship software using Docker.

There are many programming languages and frameworks out there for building back-ends, but you don’t need to know them all. Since you’re just starting out, focus on one language. You can learn other languages as you move jobs. I recommend you start with Node.js, Express (Framework) and SQL (Database).

Mobile Development

These days there are a large set of tools available for building mobile apps. But these tools fall into two categories: native and cross-platform tools. With native tools, you can build apps for a specific platform (iOS or Android). Each platform has its own programming languages and tools. So to target multiple platforms, you have to learn many tools and write code in different languages. Alternatively, you can use a cross-platform solutions like React Native and Flutter to build apps for multiple platforms using a single codebase.

Learning Path

  1. Programming Language (e.g. C)
  2. Data Structures and Algorithms
  3. Design Patterns (Optional)
  4. HTML CSS
  5. JavaScript, TypeScript
  6. Git
  7. React
  8. Node.js
  9. Docker (Optional)

Tips

Whenever you’re stuck, you can most probably find answer to your problem at Stack Overflow. W3Schools is another good place where you can find tutorials, examples and references for different languages.

--

--