DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Abhinav Kashyap
Abhinav Kashyap

Posted on

How to become a Web Developer inΒ 2022

Introduction

Hello everyone! This is my first blog on the internet πŸ˜… I am Abhinav Kashyap, a Full Stack Web developer. Currently, I am a third-year student pursuing Electronics and Electrical Engineering at KIIT, Bhubaneswar.

In this entry, I will be telling my own experience with Web development and how I went from a total noob in programming to deploying a web app in 6 months but still a newbie πŸ₯Ί

Frontend

Starting with the first of the foundations of any website on the Internet i.e HTML (Hypertext Markup Language). It is a markup language just like XML, GML, etc. You can also use it in GitHub readmes but only limited tags. Learn about the basic HTML Boilerplate, head tag inside of which contains various meta tags which are beneficial for ranking your website in search results. Then comes the body tag i.e structuring your website's layout using tags like div, list, table, form, etc.

After you are done structuring your website, then comes styling your website using CSS (Cascading Style Sheets). Learn about inline, internal, and external CSS. Difference between class and id, how to select elements using CSS selectors. The Box model is really important in CSS, learn about padding, margins, and borders. Then, different types of positioning of elements. There are many CSS frameworks like Bootstrap, Foundation, Tailwind CSS, etc which will make your work really easy 😎

After you have done the layout and made the website pretty, now let's add some functionality to the website using JavaScript. Tbh I found it really hard/tiring/boring while learning because you aren't really building anything which you can see, unlike HTML, and CSS. But believe me, just trust the process 😎 Learn about the basics like primitive data types, operators, assignment operators, naming convention like camelCasing, various string methods, types of loops, etc. Then, comes the fun stuff like DOM (Document Object Model) by which you can select any element on the website and manipulate it using JavaScript.

Backend

Before jumping directly to Node.js, Express, and MongoDB. Getting a hold over the terminal is a must I suppose, I am a windows user so I use Git Bash which is a UNIX-based command line. Why using the command line is preferred? It helps us to interact directly with the kernel using the shell. CLI gives you more power/control and you can see all the config files too which GUI hides from you. Learn different bash commands, and directory management, that's all.

Funny Hacker gif

Node.js is a javascript runtime that consists of Google's V8 Engine and libuv written in c++ i.e Node.js helps you to run Javascript locally not on Browser only. With node, npm (Node Package Manager) comes inbuilt which helps you to install packages.

Then, comes Express which is a Javascript framework using which you can create local servers and serve different routes, make dynamic webpages, etc.

Database

There are two types of databases SQL and NoSQL, eg: MySQL and MongoDB respectively. Most in-demand database right now is MongoDB so I went with it only.Β 

So, this was my journey in Web dev in a nutshell πŸ˜…

Reach me

Portfolio
LinkedIn
Twitter
GitHub

Top comments (4)

Collapse
andrewbaisden profile image
Andrew Baisden

That's a great first article keep it up!

Collapse
abhinavkashyap061 profile image
Abhinav Kashyap Author

Thank you so much, hope to improve in future blogs πŸ˜…

Collapse
arodionova profile image
Aleksandra Rodionova

Nice summary! Though total beginners might get scared of all the abbreviations = )

Collapse
abhinavkashyap061 profile image
Abhinav Kashyap Author

Thank you so much for the amazing feedback! will keep this in mind next time 😁

DEV runs on 100% open source code known as Forem.

Β 
Contribute to the codebase or host your own.
Β 
Check these out! πŸ‘‡