A Road-Map to Web-Development (for begginers)

As a newbie computer-science/IT student you may get fascinated and confused by the term web-development.

There are many terms and doubts that revolve around the mind regarding how and from where to learn web-development and what technologies one must learn to create websites or to be a web-developer.

What is Web-Development ?

Let me give you a very brief definition of web-developement :

"Web-developement is creating websites, whether it is a short portfolio website or a big e-commerce website".

A website is generally designed in two main sections :

1. Front-end :

Front-end of the website is actually what you see in a website, and to what you interacts in a website.

All the images, text, buttons, animations, etc. that you see in a website are parts of front-end of a website.

Languages/Technologies like HTML, CSS, JavaScript are used to create front-end of a website.

Front-end is also called 'client-side' of the website.

2. Back-end :

Back-end of a website is just opposite of front-end.

Back-end invloves all the calculations, computational parts of a website.

Data is stored and retrieved from back-end of the website, i.e. it involves the database section too.

When you submit any form to a website, form processing is done in back-end section of a website.

Languages like PHP, Python, Java, Ruby are used in Backend

Back-end is also called 'server-side' of the website.

Who is a Web-developer ?

A web-developer is a programmer who is capable of developing websites or web-apps that runs on WWW(world-wide-web).They are responible for designing, modifying nad maintaining websites.

Types of web developers :

There are basically 3 well known categories of web-developers :

1. Front-end web developers:

A web-developer who create, modify or maintain the front-end section of a website are called front-end web developers.Front-ent web developers are responsible to work with User-interface and User-experience of website.Front-end web developers are like decorators or interior designers of a house.

To be a front-end developer, one must gain proficiency in HTML, CSS and JavaScript languages.

In addition to these, front-end developers need to have knowledge of various frameworks like Bootstrap, JQuery, EmberJS etc. To make a website more dynamic front-end developers must use AJAX technology (which is trending now-a-days).

Technologies/Languages required to be a front-end developer :

(Basic skills) -

HTML (mandatory)
CSS (mandatory)
JavaScript (mandatory)

(after gaining proficiency in above technologies you can move to the following skills/technologies) -

JQuery
Bootstrap
get familiar with browser developer/debugging tools, etc.

2. Back-end web developers:

A back-end developer is one who performs all backend calculations and computations, and apply logical checks on data stored in back-end.

It also includes database, and a scripting language that interacts with the database.

Back-end developers uses Php, Python, .NET, Ruby, Java, etc languages to manage backend services.

Back-end Developers manipulate data and apply logic behind the working of the website.

Technologies/Languages required to be a back-end developer :

(Basic skills) -

Atleast any one of server-side scripting language (like Php, Python, Java, Node.js, .NET, etc)
Knowledge of Databases (like MySQL, Oracle, SQL server, MongoDB, etc)
Handling server (like Apache, Nginx, etc)

(after gaining proficiency in above technologies you can move to the following skills/technologies) -

Web services or API(Application Program Interface)
Server Security

3. Full-stack web developers:

A full-stack developer is one who is a front-end as well as beck-end developer.

Full-stack developer can work on both client-side and server-side. They know front-end technologies(like html,css, Javascript, etc), back-end technologies(like server-side scripting languages-python, php, java, ruby as well as databases).They also need some knowledge of Version Control Systems(VCS) like Git,etc.

A full stack developer need not to be proficient in all front-end and back-end technologies, but instead they need to master any one of software stacks available in market.

Some popular software stacks are - LAMP(Linux Apache MySQL Php), MERN(MongoDB Express React Node.js), MEAN(MongoDB Express Angular Node.js).

Other related areas to dive in web-development are :

UI/UX designers
Graphic Designers, etc.

Sources to learn web-developement

There are many sources out there, but to be more specific about content quality, i have listed some of the best free resources or courses here (espacially for beginners) :

Websites -

w3school - https://www.w3schools.com/
Udemy - https://www.udemy.com/
Mozilla Developer Network(MDN) - https://developer.mozilla.org/en-US/
stack overflow - https://stackoverflow.com/

Youtube Channels -

Hitesh Choudhary - https://www.youtube.com/user/hiteshitube
Programming with Mosh - https://www.youtube.com/user/programmingwithmosh
freeCodeCamp - https://www.youtube.com/channel/UC8butISFwT-Wl7EV0hUK0BQ
Traversy Media - https://www.youtube.com/channel/UC29ju8bIPH5as8OGnQzwJyA
Dev Ed - https://www.youtube.com/channel/UClb90NQQcskPUGDIXsQEz5Q

Summary

In short, HTML, CSS, JavaScript are the basic and mandatory skills one must learn to begin the web-development journey.
After that, one can go much deeper by learning more frameworks, backend scripting languages and databases.
To learn much more efficiently and faster, practise more and more by creating some projects.
Here is the list of some beginner friendly projects to improve your skills :