Skip to content

Ship fast or ship safe - Why not both?

Security by design: By baking business logic and authorization directly into the core of your stack, NOUMENA helps you build secure online applications - faster, safer, and easier than ever before.

Learn more about NOUMENA technology, or see it in action with the quick tour below:

Try out the Hello World demo

See this Hello World application code below? It's only 20 lines. And yet it powers a full backend, with storage and access management.

Hello World app screenshot

This NPL code running in an NPL Runtime and the matching vibe-coded frontend are hosted on NOUMENA Cloud, the managed cloud platform for NPL.

Try out the Hello World demo by clicking on the embedded application screen above.

The learn more about NPL and why to use it, please check out the What is NPL explainer.

Run Hello World locally

What you will achieve: Download the Hello World example from the npl-demo repository and spin it up locally

Prerequisites: git, docker and npm installed. Windows Subsystem for Linux (WSL) recommended if using Windows

Steps:

  1. Clone the NPL Hello World repository:

    git clone https://github.com/NoumenaDigital/npl-demo.git
  2. Get the CLI (MacOS/Linux/Windows with WSL):

    curl -s https://documentation.noumenadigital.com/get-npl-cli.sh | bash

    You may have to restart the terminal to ensure the CLI is available in your PATH after installing the NPL CLI. If using Windows without WSL, follow instructions here).

  3. Navigate to the root of the cloned repository and start the NPL Runtime locally:

    cd npl-demo && docker compose up -d
  4. Deploy NPL to the NPL Runtime:

    npl deploy --sourceDir api/src/main/
  5. Install frontend dependencies and run the frontend server locally:

    cd webapp && npm i && npm run dev
  6. Navigate to the frontend URL http://localhost:5173/ to try out the Hello World application running locally

Note that the local deployment uses an embedded OIDC server with seeded users. The embedded OIDC server should be used for development purposes only.

Deploy to NOUMENA Cloud

What you will achieve: Deploy the Hello World app to your own NOUMENA Cloud managed application

Prerequisites: Hello World application code cloned from repository (see above), npm installed

Steps:

  1. Sign up to NOUMENA Cloud

  2. Create a new tenant and a new application in the NOUMENA Cloud portal (more details here on application creation, if needed). Pay attention to the resulting tenant and application slugs, as displayed in the portal.noumena.cloud/<tenant-slug>/<app-slug> URL of your application.

  3. Also log in from the command line using the NPL CLI:

    npl cloud login

    This will open a browser window to authenticate with NOUMENA Cloud. Provide your credentials, choose Sign In, and grant access privileges. After successful authentication, you can close the browser window and return to the terminal.

  4. Deploy the NPL source code by running the following command from the npl-demo/ root of the cloned repository and replacing $YOUR_TENANT_SLUG and $YOUR_APP_SLUG with the slugs you noted in the previous step:

    npl cloud deploy --tenant $YOUR_TENANT_SLUG --app $YOUR_APP_SLUG --sourceDir api

    If you are deploying once more, clear the NPL package first (or implement a migration):

    npl cloud clear --tenant $YOUR_TENANT_SLUG --app $YOUR_APP_SLUG && npl cloud deploy --tenant $YOUR_TENANT_SLUG --app $YOUR_APP_SLUG --sourceDir api

    With this step, you already have a fully functional backend running on NOUMENA Cloud, as reflected by the swagger UI available under https://engine-<tenant-slug>-<app-slug>.noumena.cloud/swagger-ui/index.html?urls.primaryName=NPL%20Application%20-%20demo. Let's now deploy the frontend to NOUMENA Cloud.

  5. Change the webapp/.env file to match your NOUMENA Cloud tenant and application. Make sure to use the tenant and application slugs rather than the full names

  6. Build the frontend:

    cd webapp && npm i && npm run build
  7. Zip the frontend distribution in the webapp/dist directory

    cd dist && zip -r npl-demo-frontend.zip .
  8. Upload the zip file to the NOUMENA Cloud portal, selecting "Upload frontend zip" from the Frontend tab

  9. Configure users on the NOUMENA Cloud portal. You will need to create alice, bob and carol users with password password123 for the application to work as it does locally using the embedded OIDC. This requires lowering the minimum password length to 11 in the Authentication Policies of NOUMENA Cloud application's keycloak realm. For details on user creation, please refer to this guide

  10. Navigate to the https://<tenant-slug>-<app-slug>.noumena.cloud frontend URL of your NOUMENA Cloud application and try out the Hello World application flow

Edit Hello World in your IDE

What you will achieve: Edit the Hello World to start coding your own app

Prerequisites: Hello World application code cloned from repository and NPL CLI installed (see above), docker and npm installed. Windows Subsystem for Linux recommended if using Windows

Steps:

  1. Install the embedded NPL-Dev Plugin in your IDE (IntelliJ, VS Code, or VS Code-derived)

  2. Edit the NPL code in the api/src/main directory. You may for example start by changing the string (Text) returned by the sayHello permission

  3. From the npl-demoroot of the cloned repository, start the NPL Runtime locally

    docker compose up -d
  4. Clear and upload the NPL code to the NPL Runtime

    npl deploy --sourceDir api/src/main/ --clear
  5. Update the frontend code in the webapp directory (in particular revert to local URLs in webapp/.env if you have deployed to NOUMENA Cloud previously)

  6. Install frontend dependencies

    cd webapp && npm i && npm run dev

Edit Hello World on Codespaces

What you will achieve: Edit the Hello World on Codespaces without the need for an IDE

Follow this link to open Codespaces on the GitHub npl-demorepository. Install the NPL-Dev for VS Code extension and sign in to NOUMENA Cloud from the NOUMENA Cloud sidebar menu item. Your NOUMENA Cloud tenants and applications should be listed in the NOUMENA Cloud pane. Hover over an application and select the upload button to upload the NPL code. Frontend upload is not yet available but will be provided soon.

Learn more with the Getting Started guide

Check out the Getting Started guide to get acquainted with NOUMENA technology and find step-by-step instruction to get started.