This guide will help you set up a basic web development environment for HTML, CSS, and JavaScript projects.
| Tool | Purpose | Download Link |
|---|---|---|
| Visual Studio Code | Code editor for writing and managing your web projects | Download VS Code |
| Git | Version control system to track code changes | Download Git |
| GitHub | Platform for hosting and sharing repositories | Create GitHub Account |
| Google Chrome | Browser for testing websites | Download Chrome |
| Mozilla Firefox | Alternative browser for cross-browser testing | Download Firefox |
| Node.js (Optional) | JavaScript runtime for backend and package management | Download Node.js |
- Download and install all the above tools.
- Open Visual Studio Code.
- Go to the Extensions tab (Ctrl + Shift + X).
- Install the following extensions:
- 🔹 Live Server – for viewing real-time changes in your browser.
- 🔹 Prettier – for auto-formatting your code.
- Open your project folder in VS Code.
- Right-click your HTML file → Select “Open with Live Server.”
- Your project will open in your default browser.
- Any changes you make in your code will refresh automatically in the browser.
- Keep your projects organized in separate folders.
- Use Git commands (
git init,git add,git commit,git push) to manage versions. - Regularly push your code to GitHub for backup and collaboration.
Happy Coding! 💻