HTML Tutorial: Installing VS Code & Live Server | Web Development Tutorials #2

Introduction to HTML

In this section, the instructor introduces the HTML tutorial and explains why it is important to use an IDE like Visual Studio Code instead of Notepad.

Importance of using an IDE

• Recap of last video on building websites with HTML, CSS, and JavaScript

• Explanation of why using an IDE like Visual Studio Code is recommended over Notepad

• Instructions for downloading and installing Visual Studio Code

• Demonstration of how to open a folder in Visual Studio Code

Creating HTML files

• Explanation of how to create a simple website by creating an HTML file with the extension ".html"

• Brief mention of creating CSS and JavaScript files, but focus on starting with HTML

• Explanation of why using an IDE or source code editor is preferred over Notepad for syntax highlighting and suggestions

Recommended Web Browser

In this section, the instructor recommends Google Chrome as the preferred web browser for the course.

Why use Google Chrome?

• Recommendation to use Google Chrome as a stable browser throughout the course

Introduction to VS Code

In this section, the speaker introduces Visual Studio Code and explains its features.

Getting Started with VS Code

• After installing VS Code, typing "!" shows Emmet Abbreviation.

• The Explorer button opens a folder containing all files that have been opened. It also allows users to create new files and folders and refresh the view.

• Extensions can be installed from the Extensions store in VS Code. The Live Server extension is recommended for web development.

• Live Server allows users to see changes made to their code without reloading the page.

Understanding Settings in VS Code

• There are two types of settings in VS Code: user settings and workspace settings. User settings apply to the user on that computer, while workspace settings apply only to that specific folder.

• All overridden user settings are saved in a file named "settings.json". Workspace settings can be changed by clicking on "Workspace" in the Settings menu.

Conclusion

In this section, the speaker concludes by encouraging viewers to learn more about VS Code through his Python course.

Learning More About VS Code

• The speaker recommends his Python course as a resource for learning more about Visual Studio Code.

Introduction to VS Code

In this section, the speaker introduces Visual Studio Code (VS Code), explains how to customize keyboard shortcuts, and provides an overview of the command palette and live server.

Getting Started with VS Code

• The speaker introduces VS Code as a code editor for web development.

• Customizing keyboard shortcuts is important for efficient coding. The speaker shows how to override default shortcuts in the keybindings.json file.

• The command palette allows users to access all commands by typing them in.

Live Server and Terminal

• Live server is a useful extension that allows users to see changes made in real-time.

• Users can set their default terminal shell in VS Code. The speaker recommends using Git Bash for Windows users.

Conclusion

• The speaker encourages viewers to follow the course properly and become successful web developers.