Teaching Yourself Web Development

I'd like to start writing guides to help new developers. Here is my first short article. Any tips on how I can make my explanations more clear? Thanks!

"Learning web development is tough. If you're trying to teach yourself, it is even tougher. The internet is filled with plenty of tutorials but they are so unorganized that making sense of all the complexity is nearly impossible. With the complicated terminology and large variety of technologies out there, beginners often have a hard time knowing where to start and what to learn. Below I have put together a brief overview of the different components of web development along with a few of the common technologies used to build these components.

The Building Blocks of a Website

When you think about it, a website is just a way to view and interact with a remote collection of information. For example, Facebook stores information about your posts and photos on their servers and then provides a user interface allowing you to interact with them. All websites work in a similar manner.

When you connect to a website, information is sent from that server to your computer and then displayed with a pretty interface. The development of this user interface is called front-end development. The front end of a website is what the user sees and interacts with. But all this information that the front end displays needs to be organized and controlled by something. This is where back-end development comes in. The back end of a website is the brains behind the whole operation. Together, the front end and back end create a functional website.

What is a front end made of?

Typically there are three different languages used to create an attractive front end.

1. HTML: This language is used to define the layout of a website (what goes where).
2. CSS: Used to style your page. This is how you turn an ugly site into a sexy site.
3. Javascript: This programming language makes your website smarter and more reactive to the users' actions.

Coding a front end with HTML, CSS, and Javascript can be a lot of work. To help accelerate the process, developers often use a Javascript framework to make life easier. Right now, the most popular javascript frameworks are React, Vue, and Angular. Using one of these you can quickly create large, beautiful and scalable user interfaces.

What is a back end made of?

Developers have a bit more flexibility when choosing which language to use for coding a back end. The most popular choices are, javascript, python, and php, but there are many other options as well. There are also many nice tools for backend development. A few of the popular ones are, Django, Node, and Laravel.

Now what?

Now it is time to choose the tech stack you would like to learn. A tech stack is a combination of all the different languages and tools used to build a website. Tech stacks vary based on what technologies are in them. Below is an outline of the major tech stack components you will need to learn.

1. HTML, CSS, Javascript - before you do anything else you need to become familiar with these
2. A front-end framework - Vue, React, Angular, etc.
3. A back-end tool - Node, Django, Laravel, etc.

Once you have narrowed in on which technologies you would like to learn, it's time to roll up your sleeves and get to work. The internet is filled with resources for learning each of these tools. If you're not sure where to look, Udemy is a great start. They offer tons of fantastic online courses for very affordable prices. Keep at it and don't give up. Web development is hard but if you put in the time and work, you will come out feeling like you have a super power. Good luck and have fun."