Essential Things to Start Web Development

Client-Server Model: Understand how browsers (clients) request and display web pages from servers and how servers works, how HTTP request and response works.
HTTP/HTTPS: Learn the basic protocols for web communication how HTTP and HTTPS communications works.

2. Essential Tools and Software

For starting web development there are some essential tools and softwares.

Text Editor/IDE:

Visual Studio Code: Popular, extensible code editor with robust features developed by microsoft this is the most popular text editor that can be used in web development.
Sublime Text: Lightweight and fast, with great customization options.
Atom: Open-source and hackable to the core.

Web Browsers:

Google Chrome: Offers great developer tools for debugging developed by google and most widely used browser, but lacks in security features.
Mozilla Firefox: Known for its strong developer toolset and one of the most secured browsers, it also offers good developers toolkit like console, inspector, debugger, network monitoring, style editor and etc.

Version Control System:

HTML (HyperText Markup Language):

Structure of web pages using elements and tags.
Key Concepts: Doctype, head, body, paragraphs, headings, links, images, lists, href, code and etc.

CSS (Cascading Style Sheets):

You have to learn how styling and layout of web pages works how to integrate html with css.
Key Concepts: Selectors, properties, values, box model, flexbox, grid, responsive design.

JavaScript:

Javascript will help you to learn how to add interactivity to web pages.
Key Concepts: Variables, data types, functions, events, DOM manipulation and etc.

Install a Text Editor/IDE: Choose one that fits your needs and install it (Recommended VSCode)
Web Browsers: Install multiple browsers to test your websites like chrome, firefox, opera mini and etc.
Install Git: Set up Git and create a GitHub account for version control and collaboration.

Online Tutorials and Courses:
- MDN Web Docs: Comprehensive documentation for HTML, CSS, and JavaScript. Reading documentation of programming languages is essential to have a clear concept in web development.
- W3Schools: One of the best and most beginner-friendly tutorials on web technologies. You can practice each and every concept separately and se the changes at realtime.
- freeCodeCamp: Interactive learning platform with exercises and projects.
- Coursera/Udemy: Paid courses with structured learning paths, Udemy offers the most affordable courses.
Books:
- “HTML and CSS: Design and Build Websites” by Jon Duckett: Great for beginners who are starting web development.
- “JavaScript and JQuery: Interactive Front-End Web Development” by Jon Duckett: Perfect for learning JavaScript.

Create Simple Projects:

Personal Portfolio: Showcase your skills, experiences and projects on your personal portfolio website.
Basic Blog: Learn about content management and styling. You can take inspiration from wordpress, joomla, Drupal and etc.
To-Do List App: Practice JavaScript and interactivity.

Join Online Communities:

Stack Overflow: Ask questions and get help from the developer community.
Reddit (r/webdev): Engage with beginner and experienced web developers.
GitHub: Contribute to open-source projects to gain experience and build the opensource community.

Front-End Frameworks:

Back-End Development:

Databases:

SQL: Learn about relational databases like MySQL, PostgreSQL.
NoSQL: Explore databases like MongoDB, MariaDB, Casendra and etc for handling unstructured data.

Hosting Services:

GitHub Pages: Host static sites directly from your GitHub repository for free.
Netlify: Easy deployment for static sites with continuous integration.
Heroku: Deploy dynamic applications with ease.

Domain Names:

Purchase a domain name from registrars like Namecheap, GoDaddy.
Set up custom domains for your projects and showcase your skills on the internet.