# Getting Started & Installation

Either you can use any online based IDEs like ["mern.ai"](https://mern.ai/) or you can use offline IDEs like "Visual Studio Code".

{% tabs %}
{% tab title="mern.ai" %}
**Follow the steps given below:**

1. Go to mern.ai.
2. Sign up or Sign into your account.
3. Click on '+ New site or app' to create an app.

<div align="center"><figure><img src="/files/Hm92XY8bvqVQRSLB44Ey" alt="Screenshot: Create a new Project."><figcaption></figcaption></figure></div>

3. Follow the on-screen instructions.
4. Wait for a few minutes for the setup to complete.

<figure><img src="/files/HBjMU0mJk6Ab6eE7oge8" alt="Screenshot: Online IDE - mern.ai"><figcaption></figcaption></figure>

5. To view the output, just click on the external link icon next to "Compiler" at the top.

<figure><img src="/files/Z98AG2df1yQqNH9fm3Gd" alt="Screenshot: Output"><figcaption><p>Output</p></figcaption></figure>

{% hint style="info" %}
The above UI is a placeholder UI from MagicJS as there is no UI file mapped to the root.
{% endhint %}

{% hint style="success" %}
Take a look at the output URL in your browser.

Yes! Your app is deployed. The output can be viewed from any device, anywhere in the world, by visiting this URL.
{% endhint %}
{% endtab %}

{% tab title="Visual Studio Code" %}

## Pre-Requisites <a href="#pre-requisite-knowledge" id="pre-requisite-knowledge"></a>

#### **Open the VS code and follow the steps given below:**

1. Create a folder for your app and open that folder in VS code by going to File > Open folder.
2. Follow the steps given below:

Install Node.js by running the following command in your VS code terminal:

```bash
nvm install v18.2.0
```

Use the installed Node.js version,

```bash
nvm use v18.2.0
```

## Install MagicJS

Install MagicJS Framework using NPM:

```bash
npm i "@magicjs.dev/cli" --global
```

## Initialize your project

After MagicJS Framework is installed, you can now initialize your project:

```bash
magicjs --init
```

Wait until the script creates the necessary files for you. Once the dependencies are installed, start the project by running the command:

```bash
npm start
```

You will be able to view the output in url `http://localhost:3000`.

<figure><img src="/files/Z98AG2df1yQqNH9fm3Gd" alt=""><figcaption><p>Output</p></figcaption></figure>

{% hint style="info" %}
The above UI is a placeholder UI from MagicJS as there is no UI file mapped to the root.
{% endhint %}
{% endtab %}
{% endtabs %}

## **Ready to step into the role of a Product Owner?**

Dive into our comprehensive course designed to equip you with the skills and knowledge needed to excel. [Click here](https://university.mern.ai/) to embark on your journey towards becoming a proficient product owner and unlocking exciting career opportunities!


---

# 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://skyslit.gitbook.io/magicjs/getting-started-and-installation.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.
