# Installation Guide

## Installation Guide

In this guide, we will be getting your computer ready for building a NextJs full stack project. We will be installing a few things. Everyone on the team needs to complete this step.

> Note that many of you will be able to **skip** this page, but be sure to take a brief glance to make sure you’re not missing anything

### Overview:

* Node.js
* Visual Studio Code (VS Code)
* Visual Studio Code Extensions

***

#### Node.js

1. Go to your web browser and search up [Node.js](https://nodejs.org/en) (or click the embedded link)
2. Click on “Download” or "Get Nodejs" in the Navbar
3. Node will detect the best type of installer for your computer, so go ahead and click the download button.\
   ![](/files/W9Kuxx0tYdKYQ91iSwmD)
   1. Make sure that you’re installing the latest version for the correct operating system\
      a. Which version of Node.js should I install?
      1. LTS stands for Long-term Support. Essentially, it’s the latest stable build. We recommend downloading the most recent LTS version.&#x20;
4. Follow the installation wizard
   1. There are a few additional setup options, we recommend you do your research before clicking on anything 😬

At this point Node should be installed and you should be ready to move on to the next step.

**Caution**: If you already had VS Code installed and opened *BEFORE* your Node.js installation, make sure you fully close and restart VS Code or else it won’t recognize the installation of Node.js.

***

### Visual Studio Code

1. Go to your web browser and search up [Visual Studio Code](https://code.visualstudio.com/) (or click the embedded link)
2. Click on the big blue download button (it should be in respect to your operating system)\
   ![](/files/vS4Ia5pgED3fS64P0Ih0)<br>
3. Follow the installation wizard
   1. There are a few additional setup options, we recommend you do your research before clicking on anything.

***

### Visual Studio Code Extensions

> In this section, we will open up VS Code and install some quality-of-life extensions. If this is your first time using Visual Studio Code, we highly recommend that you go through the beginner tutorial steps that they have already setup for you.

Once you are ready to install the extensions:

1. On the sidebar, click on the Extensions icon. We’re now going to be searching and installing a few extensions.&#x20;
2. ![](/files/swUJBcV0loYqwpNjvXVe)
3. In the search bar type in “prettier”
   1. It should be the one pictured below with 50 million installations.&#x20;
   2. ![](/files/wFidh5uVLld8j248gUJD)
4. In the search bar type in “[tailwind](https://open-vsx.org/vscode/item?itemName=bradlc.vscode-tailwindcss)”
   1. It should be the one pictured below with 7.8 million installations. \
      ![](/files/VGtOAST1PvKNjoHTPNRf)

***

### Congratulations!

Awesome job for making it to the end of the setup guide! Reward yourself with a little break. Stretch, stand up, go talk to a nearby hacker, or scroll TikTok or Instagram reels for 30 minutes 😁

When you’re ready, go to the next page where we’ll guide you in the setup of the React project.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://hackhcc.gitbook.io/hackhcc-docs/beginners-track/getting-started/installation-guide.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
