Simplified approach to Web Development.

Published in

Dev Genius

5 min readJul 18, 2020

In this short and precise article, I’ll steer you through the complete process of learning Web Development and to become a better version of yourself.

“It always seems impossible, until it’s done” ~ Nelson Mandela

So,2020 is a weird time to begin your Web Development journey. It’s an interesting duality wherein you both have more resources available to you than at any time in history, and paradoxically, the sheer magnitude of the information on offer can be completely overwhelming.

You are a beginner and you don’t have any prior knowledge of this great field. So “No Worries”, I’m here to help you out with this condition. This article is written in an easy and non-complex language.

“The secret to getting ahead is getting started.”
― Mark Twain

Hold Tight, and let’s start this awesome journey.

Web Developer in 2020–21

1) Basic Requirements.

Before starting with Web Development some basic Toolkit is required to make your coding life hustle free. These are some basic software and hardware.

A Laptop or A Desktop:- Basic necessity to start with coding.
Pickup a Text Editor:- The text editor is where you will write all your code, and the terminal is where you execute it. As a developer, this is where you live. For instance VS Code, Atom, Sublime, Notepad++. Personally, I use VS Code :)
Web browser:- Chrome, Mozilla Firefox, Yahoo, etc.
Git and Version Control:- Git is the tool used to save code and create different versions. It will allow you to collaborate with other developers. The top place to preserve your code.

2) Website Anatomy

Refer to this image you’ll get to know the website’s anatomy.

3) Let’s Code!

Web Development is divided into 2 domains:-

a) Frontend Web Development. (Web Designers)

b) Backend Web Development. (Web Developers)

3 a) Frontend Development.

Complete road-map for the front-end journey.

i) HTML5 and CSS3

HTML5 and CSS3 are the backbones of any website. HTML5 provides the structure while CSS3 (Cascading Style Sheets) provides the style and helps them to look better and more visually appealing. If you want to become a frontend developer then you must master these two.

ii) Basics of any designing software

Photoshop.
GIMP.
PaintShop pro.

It’ll help you a lot.

iii) JavaScript

Four pillars of object-oriented programming are Data Abstraction, Polymorphism, Encapsulation, and Inheritance, just like that there are three main pillars of web development also, namely HTML5, CSS3, and JavaScript. JavaScript will give life to your web page and makes your website more interactive and dynamic.

~Basic JS (No frameworks right now.)
~Datatypes
~Functions
~Event handling
~JSON
~jQuery

After this, you can read about the 7 best libraries offered by JavaScript.

7 Best Libraries offered by JavaScript

Short yet comprehensive description on libraries offered by JavaScript.

medium.com

Once you are comfortable with basic JavaScript then start with a JavaScript front-end framework (any one).

Angular
React JS
Vue JS

iv) Park your Website!

Congratulations, Web Designers you now have the basic knowledge of HTML5, CSS3 ,and JavaScript ,and also you have a soft skill too (design software). Just go on and create some awesome websites, and before going further learn these too.

Learn about GIT.
Basic terminal command.
SSH.
Get a hosting account. (000webhost, Hostinger, etc)
Learn about Cpanel.
Upload your project.
Register domain name and park it.

v) Web Designers! Grab some Opportunities.

Make simple websites for startups.
Build UI Web Applications.
Do Internships.
Work for a company.
Become a freelancer.

vi) Going further with the front-end?

Try learning

Bootstrap
Pure
Zurb Foundation
Materialize CSS
MUI
Skeleton

3 b) Backend Development

Complete road-map for the back-end journey.

i) Choosing backend development is surely a good option. For that, you’ve to learn server-side scripting language.

PHP:- Forget about negative things people say about PHP. It is still the simplest way to write the server side code.

Ruby on Rails:- Ruby is another powerful language best for web development. It has got an awesome framework called Rails which makes creating Web applications easy and fast.

Python:- Another awesome language, full of powerful framework and libraries.

Node.JS:- Powerful and amazing framework.

JAVA:- High-performance server-side language.

ii) Companies and their server-side scripting language.

1.PHP

Facebook
Vox Media
Tesla Motors

2. Ruby on Rails

Airbnb
Bloomberg
Github

3. Python

Instagram
Google
Netflix

4. Node.JS

Paypal
Uber
LinkedIn

5. JAVA

Accenture
Zalando
Intuit

iii) Since you chose back-end, start learning..

Relational Databases

MySQL
PostgreSQL
MSSQL
MariaDB

NoSQL databases

MongoDB
CouchDB
Cassandra
RethinkDB

Caching

Memcached
Redis

Up your game further!!

Search Engines
GOF Design Patters
Architectural Patterns
Learn different testing techniques

iv) Park your application!

Now you all have a good grasp on the topic and more knowledge than before, so use these technologies to get your app online.

Dedicated Server/VPS
App hosting — Heroku, Digital Ocean, AWS
Deploy tools
Linux command line
Maintenance & Updates

v) Web Developers! Grab some Opportunities.

Congratulations, Web Developers you’ve some great opportunities waiting.

Create web applications
Build backend API’s (Application Programming Interface)
Work with network security
Manage servers and databases
Apply for job
Start your own Startup/Business
Become a freelancer

4) Further more you can..

Practice and explore more.
Build up your profile.
Learn new stacks (MEAN, MERN , etc)
Help and guide a beginner (this will increase your knowledge also).
Do some researches.
Be productive and learn every day.

5) Basic projects to practice

A Tribute page
Personal portfolio
Landing page
Music store website
Make a restaurant website
Parallax website
Technical documentation and many more….

Closing Notes:

Thank you for reading this article so far. You might be thinking that there is so much stuff to learn, but believe me, once you start learning Web development you’ll love it.