# Nodejs

Managing multiple versions of Nodejs with ServBay is very simple. We will illustrate this by installing Nodejs 22.

# Install Nodejs 22

Click on Services in the left sidebar, and you can see multiple Nodejs versions provided by ServBay.

Install Nodejs 22

Find the row where Nodejs 22 is located, click the green download button on the right, and Nodejs 22 will be downloaded and installed in just a few seconds.

# Install yarn and pnpm

After Nodejs 22 is installed, let's check it:

Nodejs 22 Version

From the terminal output, we can see that Nodejs 22 has been installed.

Then let's install yarn and pnpm via corepack:

$ corepack enable yarn
$ yarn -v
1.22.22
$ corepack enable pnpm
$ pnpm -v
9.1.0
1
2
3
4
5
6

We can see that yarn and pnpm have been installed.

# Vue 3 Example

After Nodejs and yarn/pnpm are installed, you can start front-end development. Next, we will use Vue 3 as an example.

# Vue 3 Scaffold

First, let's run the Vue 3 scaffold to generate a Vue 3 project.

Vue 3 Scaffold

# Install deps by yarn

Then enter the project directory:

$ cd hello
1

Execute yarn to install the dependency packages:

Yarn Install Deps

# Start development server

Then execute yarn dev to start the local development server:

$ yarn dev
1

After the server starts successfully, the following information will be displayed:

Yarn Dev Info

At this time, visit http://localhost:5173 in your browser, and you will see the default homepage generated by Vue 3:

Vue 3 Default Homepage

# Edit source code

Let's try to change "You did it!" to "Hello, World!" and see what happens:

Vue 3 Hello World Source Code

After modifying the code, Vue 3 will automatically refresh the page, so we can see the modified website homepage:

Vue 3 Hello World Page

Now you're ready to do front-end development using nodejs.

Last Updated: 5/12/2024