npm start...the server is up&running!

#server #webdev #localhost #npm

With 'npm start' you can quickly and easily create and run a local web server!

This tutorial is intended to guide you through the use of the npm start command, showing you how to set up a Node.js project and actually run web applications. We will start by installing Node.js and npm, then move on to creating a project and configuring your web server startup script.

Having a local web server is particularly useful for testing web applications locally before releasing them to the official environment, thus ensuring that they work correctly and without errors.

🔗 Do you like Techelopment? Check out the site for all the details!

1. Introduction to Node.js and npm

Node.js is a JavaScript runtime that allows you to run JavaScript code outside of the browser. It is especially used for developing server-side applications.

*npm *(Node Package Manager) is the Node.js package manager, used to install and manage libraries and dependencies of JavaScript projects.

To use npm, you need to have Node.js installed, as npm is automatically included with Node.js. Additionally, many packages available on npm are designed to run in a Node.js environment, making its presence essential for the correct functioning of applications.

2. Install Node.js and npm

To use npm start, you need to have Node.js installed, which automatically includes npm.
Installation steps:

Download Node.js: Visit the official Node.js website and download the latest stable version for your operating system.
Install Node.js: Follow the instructions in the installation wizard.
Verify installation: Open a terminal and type:

node -v

npm -v

These commands will return the installed version of Node.js and npm.

3. Creating a Node.js project

To run npm start, you need to have a Node.js project with a startup script configured.
Steps to create a new project:

Create a project folder:

mkdir my-project

cd my-project

Initialize a Node.js project:

npm init -y

This command generates a package.json file with basic settings.

4. Start script setup

To start a local server and serve an index.html file, you need to install a package that handles the HTTP server, such as http-server.
Installing http-server:

npm install http-server - save-dev

Now, in the package.json file, edit the scripts section:

{
   "name": "my-project",
   "version": "1.0.0",
   "scripts": {
      "start": "http-server -p 8080"
   },
   "devDependencies": {
      "http-server": "^14.1.1"
   }
}

This will allow you to start a local server by running npm start.

5. Creating index.html file

Now let's create a simple index.html file to test the server:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Test Local Server</title>
  </head>
  <body>
    <h1>Welcome! This is a local server :)</h1>
  </body>
</html>

6. Run npm start

To start the server and view the web application, open a terminal and make sure you are in the folder where the index.html file is located. Then, run:

npm start

The local server will start on port 8080. To access the web application, open a browser and type:

http://localhost:8080/

If you want to change the port, you can change it in the start script in the package.json file, for example:

"start": "http-server -p 3000"

to run the server on port 3000.

npm start...the server is up&running 😍😍😍

You have now successfully configured a Node.js project to serve a web application locally using npm start with http-server. This approach is especially useful for testing your project before deploying it to a production environment.