When getting started with web development, there are a few different routes that you can take. It’s difficult to say which one is the ‘right’ one, as everyone learns in different ways. However the path you choose will need to depend on your interests and goals. Whether it’s front-end, back-end or full stack development, you need to have a solid interest and desire to succeed in one of these, otherwise you may find it too difficult and force yourself to stop learning.

Personally, I wanted to get into full-stack development because I knew that it would benefit me the most for what I wanted to do, so when I got started I specialised in Python and got a good understanding of the basics of Python before I started to learn HTML and CSS. If you want to become a front-end developer I would suggest starting with HTML and CSS, while getting an understanding of files and links. For example, you can have two html files and link between them to make a local page go to another local page.

Whether you are just front end, or back end, having a solid understanding of HTML is imperative. It is the fundamentals of a webpage, it holds the content for each website that you will go onto and acts like a skeleton acts for a human. Once you have an understanding of HTML, you need to start getting to grips with CSS. This allows you to style your website pages however you want to, and acts like a human who has been shopping and has different clothes to wear depending on their needs. So having an understanding of User Experience and Design will be beneficial to your projects. Remember, when learning CSS, there is no correct way, since there are usually 3 or 4 different ways to do one thing.

JavaScript is the harder one, since it involves you learning a language, for back-end developers who may already know a language like Python or PHP, JavaScript can come easily to you since the majority of languages are similar. However if you have only started on HTML and CSS, having a solid understanding of JavaScript is extremely important. It gives your website pages functionality and acts like muscles in a human, allowing things to move and interact. There are a lot of different resources that will help you with getting started with HTML, CSS or JavaScript.

One thing that is extremely important for you to learn is the significance of responsive web design, this means that regardless of what screen size you are viewing a website on, the layout is accessible and all components are readable. For example, a component that has 6 icons on desktop may be laid out in a row of 6 horizontally, on tablet it may be two rows of 3, and then on mobile, it could be a single icon carousel which allows people to scroll to the right or left between each icon. This would give a better design and user experience since it would not take up anywhere near as much room on the page for a mobile user compared to 6 icons laid out vertically.

There are quite a few different tools which can help you when it comes to responsive web design and CSS. Bootstrap and Tailwind both allow for you to write your media queries in a much easier way, meaning less code has to be written to achieve what you want. Lot’s of responsive web design is trial and error, so having to go back and keep changing things can be tedious, so using either Bootstrap or Tailwind are great tools to make your development process more efficient.

Once you have a solid understanding of front end – especially JavaScript, you can move onto more difficult front end frameworks. JQuery is a framework that allows for more simplified javascript to be written. It essentially allows you to easily select elements, set events and call methods without having to write a lot of your own work like you would using vanilla JavaScript.

For example, getting an element and changing the text in JavaScript would look like this:

However, in jQuery, it would look like this:

React, Angular and Vue are different frameworks, all built on JavaScript which allow you to create modular components that can be reused across different parts of the website. For example, you can create a CTA component that can then be used anywhere, with it easily swapping out the text and the link for where the CTA will click through to.

Now, if you are wanting to learn Back end technologies, it is extremely important for you to get a great understanding of HTTP and how web browsers work. Since each page requires a request and response, if you don’t understand how this works then it can cause a lot of issues when trying to pass your content to your view. Once you have a good understanding of this, there are lots of different technologies depending on what language you have learnt, for example JavaScript has Node.js, PHP has laravel, Python on has Django. There isn’t a specific one that is best to use, however that are lots of benefits to each and depends on what needs your project has.

Since the majority of these backend technologies use Model View Controller setups, you will need to have an understanding of interacting with Databases and using concepts like SQL or NoSQL databases. For example, your model will interact with the database and allow you to add new rows to the database depending on what your view uses. If your View has a form that takes in data from a user, your Controller would take the request and POST that data to a specific models function, allowing for your data to be added to the correct database. On the flip side, you could also have a View that just shows all the inputs in the database, in which your Controller would GET all the data from the model and output it in the desired view’s template.

Regardless of what your desires are, it is very important for you to start by building small web projects and over time increase them in size. Experience is imperative and the more you are able to build, the more you will develop along your journey. Another reason for you to constantly be building is to give you more experience with Version Control systems such as Git and GitHub. These are extremely useful ways to manage code, track changes and collaborate with others and also will help you when applying for jobs, since a portfolio can be extremely beneficial for potential Employers and Clients to look at.

As I’ve previously mentioned, there isn’t a ‘correct’ way to get into web development, and by all means these are just things that I have encountered. However, they are things that I wish I had known when I was getting started since they most probably would have given me a better understanding on my end goal and how I can achieve my end goals through the use of smaller goals. If you are wanting some help on getting started with web development, you are more than welcome to get in touch.