Developing with Node.JS
Step 0. Creating the initial source code (optional)
We will create the example source code by using some popular frameworks.
Before we begin, we will create a new directory and cd into it.
mkdir quickstart-demo && cd quickstart-demo
This is optional and you may use an existing project instead (make sure you cd into the project directory before running any odo commands) or a starter project from odo init
.
For Node.JS we will use the Express framework for our example.
- Install Express:
npm install express --save
Example
$ npm install express --save
added 57 packages, and audited 58 packages in 6s
7 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
- Generate an example project:
npx express-generator
Example
$ npx express-generator
warning: the default view engine will not be jade in future releases
warning: use `--view=jade' or `--help' for additional options
destination is not empty, continue? [y/N] y
create : public/
create : public/javascripts/
create : public/images/
create : public/stylesheets/
create : public/stylesheets/style.css
create : routes/
create : routes/index.js
create : routes/users.js
create : views/
create : views/error.jade
create : views/index.jade
create : views/layout.jade
create : app.js
create : package.json
create : bin/
create : bin/www
install dependencies:
$ npm install
run the app:
$ DEBUG=express:* npm start
Your source code has now been generated and created in the directory.
Step 1. Preparing the target platform
- Podman
- Kubernetes
- OpenShift
Before starting on Podman, you should have Podman installed and configured properly on your machine. See Podman installation instructions for further details.
You also need odo
3.8.0 or later.
To make sure that odo
has the appropriate version and detects your local Podman,
run the command below and check that it reports the Podman Client version.
odo version
Sample Output
$ odo version
⚠ unable to fetch the cluster server version
odo v3.13.0 (6c1c8b2a1)
Podman Client: 4.6.0
Before starting, you should make sure that odo is connected to your cluster and that you have created a new namespace.
Creating a new namespace
If you are using Kubernetes, you can create a new namespace with the odo create namespace
command.
odo create namespace odo-dev
Sample Output
$ odo create namespace odo-dev
✓ Creating the namespace "odo-dev" [1s]
✓ Namespace "odo-dev" is ready for use
✓ New namespace created and now using namespace: odo-dev
Before starting, you should make sure that odo is connected to your cluster and that you have created a new project.
Login to OpenShift Cluster
The easiest way to connect odo
to an OpenShift cluster is use copy "Copy login command" function in OpenShift Web Console.
- Login to OpenShift Web Console.
- At the top right corner click on your username and then on "Copy login command".
- You will be prompted to enter your login credentials again.
- After login, open "Display Token" link.
- Copy whole
oc login --token ...
command and paste it into the terminal, before executing the command replaceoc
withodo
.
Create a new project
If you are using OpenShift, you can create a new namespace with the odo create project
command.
odo create project odo-dev
Sample Output
$ odo create project odo-dev
✓ Creating the project "odo-dev" [1s]
✓ Project "odo-dev" is ready for use
✓ New project created and now using project: odo-dev
Step 2. Initializing your application (odo init
)
Now we'll initialize your application by creating a devfile.yaml
to be deployed.
odo
handles this automatically with the odo init
command by autodetecting your source code and downloading the appropriate Devfile.
Note: If you skipped Step 0, select a "starter project" when running odo init
.
Let's run odo init
and select Node.JS:
odo init
Sample Output
$ odo init
__
/ \__ Initializing a new component
\__/ \ Files: Source code detected, a Devfile will be determined based upon source code autodetection
/ \__/ odo version: v3.16.1
\__/
Interactive mode enabled, please answer the following questions:
✓ Determining a Devfile for the current directory [1s]
Based on the files in the current directory odo detected
Supported architectures: all
Language: JavaScript
Project type: Node.js
Application ports: 3000
The devfile "nodejs:2.1.1" from the registry "DefaultDevfileRegistry" will be downloaded.
? Is this correct? Yes
✓ Downloading devfile "nodejs:2.1.1" from registry "DefaultDevfileRegistry" [3s]
↪ Container Configuration "runtime":
OPEN PORTS:
- 3000
- 5858
ENVIRONMENT VARIABLES:
- DEBUG_PORT = 5858
? Select container for which you want to change configuration? NONE - configuration is correct
? Enter component name: my-nodejs-app
You can automate this command by executing:
odo init --name my-nodejs-app --devfile nodejs --devfile-registry DefaultDevfileRegistry --devfile-version 2.1.1
Your new component 'my-nodejs-app' is ready in the current directory.
To start editing your component, use 'odo dev' and open this folder in your favorite IDE.
Changes will be directly reflected on the cluster.
If you skipped Step 0 and selected "starter project", your output will be slightly different.
Step 3. Developing your application continuously (odo dev
)
Now that we've generated our code as well as our Devfile, let's start on development.
odo
uses inner loop development and allows you to code,
build, run and test the application in a continuous workflow.
Once you run odo dev
, you can freely edit code in your favourite IDE and watch as odo
rebuilds and redeploys it.
Let's run odo dev
to start development on your Node.JS application:
- Podman
- Kubernetes
- OpenShift
odo dev --platform podman
Sample Output
$ odo dev --platform podman
__
/ \__ Developing using the "my-nodejs-app" Devfile
\__/ \ Platform: podman
/ \__/ odo version: v3.16.1
\__/
↪ Running on podman in Dev mode
✓ Deploying pod [14s]
✓ Syncing files into the container [312ms]
✓ Building your application in container (command: install) [6s]
• Executing the application (command: run) ...
✓ Waiting for the application to be ready [1s]
- Forwarding from 127.0.0.1:20001 -> 3000
↪ Dev mode
Status:
Watching for changes in the current directory /home/user/quickstart-demo
Keyboard Commands:
[Ctrl+c] - Exit and delete resources from podman
[p] - Manually apply local changes to the application on podman
odo dev
Sample Output
$ odo dev
__
/ \__ Developing using the "my-nodejs-app" Devfile
\__/ \ Namespace: odo-dev
/ \__/ odo version: v3.16.1
\__/
↪ Running on the cluster in Dev mode
• Waiting for Kubernetes resources ...
⚠ Pod is Pending
✓ Pod is Running
✓ Syncing files into the container [193ms]
✓ Building your application in container (command: install) [5s]
• Executing the application (command: run) ...
✓ Waiting for the application to be ready [1s]
- Forwarding from 127.0.0.1:20001 -> 3000
↪ Dev mode
Status:
Watching for changes in the current directory /home/user/quickstart-demo
Keyboard Commands:
[Ctrl+c] - Exit and delete resources from the cluster
[p] - Manually apply local changes to the application on the cluster
odo dev
Sample Output
$ odo dev
__
/ \__ Developing using the "my-nodejs-app" Devfile
\__/ \ Namespace: odo-dev
/ \__/ odo version: v3.16.1
\__/
↪ Running on the cluster in Dev mode
• Waiting for Kubernetes resources ...
⚠ Pod is Pending
✓ Pod is Running
✓ Syncing files into the container [193ms]
✓ Building your application in container (command: install) [5s]
• Executing the application (command: run) ...
✓ Waiting for the application to be ready [1s]
- Forwarding from 127.0.0.1:20001 -> 3000
↪ Dev mode
Status:
Watching for changes in the current directory /home/user/quickstart-demo
Keyboard Commands:
[Ctrl+c] - Exit and delete resources from the cluster
[p] - Manually apply local changes to the application on the cluster
Then wait a few seconds until odo dev
displays Forwarding from 127.0.0.1:...
in its output,
meaning that odo
has successfully set up port forwarding to reach the application running in the container.
You can now access the application via the local port displayed by odo dev
(127.0.0.1:20001 in the sample output above) and start your development loop.
odo
will watch for changes and push the code for real-time updates.
You can now follow the advanced guide to deploy the application to production.