web development: the start
Tags: html, css, javascript, webdev
Published: 2020-11-13 17:14:18

When I first decided to learn web development it took me a long time to figure out the path I will take along this journey, so I watched a lifetime of youtube videos, and I read a ton of articles in which I got to know the different languages and stacks, then I started drawing my roadmap to start the actual learning, so I thought why not share my experience it may help someone to start without losing much time.

### concepts to grasp

Web development consists of two parts front-end and back-end.

**1. the front-end**

The front-end is all about the client-side in which you will use  HTML CSS and JAVASCRIPT, those are the main tools you will need to create the client-side, but to call yourself a front-end developer you must learn one of the client-side frameworks such as Angular, React and Vue. You may ask, which is the best framework? There is nothing such a thing, it all depends on your preferences, so to know what suits you better try to make a simple app with all of them so you will end up with the one you prefer. Well, is that all? Actually NO, front-end needs some skills you have to learn and develop  but they require a lot of practice, this is where your creativity will shine and this is what differentiates a front-end developer from another:

* **Web design:** mainly focuses on the appearance of a website, the colors, fonts, icons, etc used.
* **UI design:** user interface design focuses on making the website look simple and easy to understand by the end-user.
* **UX design:** user experience design is studying the way users use the website and making changes accordingly by putting the most used parts of the website simple to access.

**2. the back-end**

Also, known as server-side programming,  is all about creating the logic that powers the website or the app you are working on, for the tools you will need:

* **a programming language:** there are a variety of programming languages that you can use for example (java, go, c#, python), etc, it’s not like the front-end where you are limited to javascript (you can also use javascript in the back-end with nodejs).
* **an operating system:** you can choose one of the Linux distributions like Ubunto, CentOS, etc, or you can go with Windows or Mac os, pick the one you are comfortable with.
* **a web server:** the web server is just a program that serves the website or application content to the client, the most popular web servers are Apache and Nginx.
* **database:** the database is where your data will be stored you can either go with SQL databases like Mysql, Postgresql, SQLite, etc, or NoSQL databases like MongoDB, MariaDB, CouchDB, etc, try to learn the differences between them and how to choose the best database for your project.

### A roadmap for you

With this massive amount of new technologies, finding your way is very overwhelming. So here is a roadmap you can use to have a smooth and crystal clear learning path, follow this list one by one in the order putted in, the learning resources are limitless, youtube, freecodecamp, etc.

* how the web works
* security in the web
* HTTP and HTTPS
* cookies
* a little bit about networking
* APIs
* HTML and CSS the basics
* javascript the basics
* browser development tools
* the difference between server-side and client-side rendering

#### Choose your way

Now you need to choose your way in this Domaine, do you want to be a front-end developer, back-end developer, or a full-stack developer (which means working with the front-end and the back-end).

##### **For the front-end :**

* Advanced Html
* Advanced CSS and Sass
* Advanced javascript
* Nodejs
* Npm
* Webpack
* A front-end framework

#### **For the back-end :**

* A programming language
* Database
* How to write code with the performance in mind
* How to secure your app
* Authentication types and how to implement them
* How to configure a web server
* The different ways of scaling an application

### **Is this all?**

Learning all of this won’t make you a pro, now the next step is to make projects and learn from your mistakes, and also you need some skills like :

* How to search on the web
* How to read the documentation
* How to read others code
* How to debug

To sum up, continue in your way of learning, never give up and you must know that the hardest part is to keep up with the new technologies and updates happening in this field so you need to be ready. Good luck.
I hope you enjoyed reading this article and learned something from it. thanks for reading.