Setting up environment / JavaScript for Beginners

Setting up environment
by Louis Nguyen

Lecture

JavaScript for Beginners Introduction

Lecture

Setting up environment

Module 1: Engaging with JavaScript Fundamentals

Not Attempted

Name	Progress
Section 1	Not Read
Section 2	Not Read
Section 3	Not Read
Module 1 Quiz	Not Attempted

Module 2: Introduction to Variables and Data Types

Not Attempted

Name	Progress
Section 1	Not Read
Arithmetic Operations	Not Read
Type Conversion	Not Read

Module 3

Not Attempted

Name	Progress
Section 1	Not Attempted
Section 2	Not Attempted

0 / 20 XP

Installing Visual Studio Code

Visit the Download Visual Studio Code - Mac, Linux, Windows
Choose the installer appropriate for your operating system (Windows, macOS, or Linux) and download it.
Run the downloaded installer and follow the on-screen instructions to complete the installation.
After installation, open Visual Studio Code to ensure it's correctly installed.

Installing the Live Server Extension

Why Live Server? Live Server provides a quick development live-reload experience. This utility helps you view your changes immediately in the browser as you write code, which is incredibly useful for front-end development
In Visual Studio Code, open the Extensions view by clicking on the square icon in the sidebar or pressing Ctrl+Shift+X.
In the Extensions search bar, type "Live Server" and look for the extension authored by Ritwick Dey (it's usually the first result).
Click 'Install' to install the extension.
Once installed, you can right-click on your HTML file in VSCode and select "Open with Live Server" to start serving your web pages from a local server.

Creating Your First Web Page

Create a new folder on your desktop or another convenient location and name it “MyFirstProject”.
Open this folder in VSCode: File > Open Folder, and select your new folder.
Right-click in the Explorer pane and choose New File, name it index.html.

Enter the following HTML structure:

&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
    &lt;title&gt;My First Page&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;h1&gt;Hello, JavaScript World!&lt;/h1&gt;
    &lt;p&gt;This is my first web page served with Live Server.&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;

Save your file, right-click on it in the Explorer pane, and select "Open with Live Server" to view your web page in the browser.
🎉Congratulation! You are ready to get your hands dirty with some coding.🎊