Difference between revisions of "Visual Studio Code"
VKranendonk (talk | contribs) |
VKranendonk (talk | contribs) |
||
| (One intermediate revision by the same user not shown) | |||
| Line 4: | Line 4: | ||
The following will be instructions on installing Visual Studio Code and additional extensions. | The following will be instructions on installing Visual Studio Code and additional extensions. | ||
== Download and install == | |||
Download Visual Studio Code from https://code.visualstudio.com and install the software. | Download Visual Studio Code from https://code.visualstudio.com and install the software. | ||
== Live Server extension == | |||
After opening Visual Studio Code, click on the Extensions icon. Left side of the window. | After opening Visual Studio Code, click on the Extensions icon. Left side of the window. | ||
| Line 18: | Line 22: | ||
[[File:Visual Studio Code Live Server Install.png]] | [[File:Visual Studio Code Live Server Install.png]] | ||
== File explorer == | |||
Click on the Explorer icon to go back to the file explorer. | Click on the Explorer icon to go back to the file explorer. | ||
| Line 30: | Line 36: | ||
[[File:Visual Studio Code Create Folder.png]] | [[File:Visual Studio Code Create Folder.png]] | ||
== First HTML file == | |||
Press the "new file" icon. | Press the "new file" icon. | ||
| Line 47: | Line 55: | ||
[[File:Visual Studio Code Write In Body.png]] | [[File:Visual Studio Code Write In Body.png]] | ||
Press "Go Live". This should open your website 🥳. | == Start Server == | ||
Press "Go Live" in the right bottom corner. This should open your website 🥳. | |||
[[File:Visual Studio Code Go Live.png]] | [[File:Visual Studio Code Go Live.png]] | ||
Latest revision as of 10:06, 5 September 2022
Visual Studio Code is a code editor created by Microsoft and freely available.
The following will be instructions on installing Visual Studio Code and additional extensions.
Download and install
Download Visual Studio Code from https://code.visualstudio.com and install the software.
Live Server extension
After opening Visual Studio Code, click on the Extensions icon. Left side of the window.
Search for the extension Live Server.
Click on Live Server and press "install".
File explorer
Click on the Explorer icon to go back to the file explorer.
Press the "Open Folder" button.
Always create a new empty folder to start with.
First HTML file
Press the "new file" icon.
Type "index.html" and press enter.
Type "!" exclamation mark and press "tab"
Write "hello" in the <body> element
Start Server
Press "Go Live" in the right bottom corner. This should open your website 🥳.
