Setup Server-Side Backend

Install Package

Install the Latest @neneys/ui Package from the Package Repository

Bun

bun install @neneys/ui

NPM

npm install @neneys/ui

Setup Project Strucutre

Project Root/
├── interfaces/
├── callbacks/
└── index.ts

Create Files

index.ts

import { NeneServer } from "@neneys/ui"

NeneServer({
  port: 3500,
  uiPath: "./interfaces",
  verbose: true,
  callbackPath: "./callbacks"
})

interfaces/home.ts

warning

You must use the initial route as /ui/main no matter what.

import type { Request, Response } from "express";
import { AppBar, Colors, Column, CrossAxis,FontWeight, Iconify, MainAxis, SingleChildScrollView, Scaffold, Text, TextStyle, TextAlign } from "@neneys/ui";

export const path = "/ui/main"
export function run(req: Request, res: Response, pass: any) {
    let scaffold = Scaffold('#mainScaffold', {
        appBar: AppBar('#appBar', {
            leading: Iconify("home", { color: Colors.white }),
            title: Text('#appBarText', { text: "NeneUI Example", style: TextStyle({
                color: Colors.white
            }) })
        }),
        preActions: [],
        body: SingleChildScrollView('#sch', {
            child: Column(
                '#mainColumn',
                {
                    mainAxisAlignment: MainAxis.center,
                    crossAxisAlignment: CrossAxis.center,
                    children: [
                        Text('#textNene', {
                            text: "Welcome to NeneUI!",
                            align: TextAlign.center,
                            style: TextStyle(
                                {
                                    fontWeight: FontWeight.w600,
                                    fontSize: 32
                                }
                            )
                        }),
                        Text("#neneText2", {text: "You can start modifying example_ui/home.ts to add or remove more Widgets and Customize it with your needs!!!"})
                    ]
                }
            )
        })
    });

    res.json(scaffold);
}

Run & Check

Executing the index.ts Server.

Bun

bun index.ts

Node.js (v23.6.0 +)

warning

Since Node.js Executes .ts without TypeChecking it is absolutely not recommended to use Node.js to directly execute, instead use tsc to compile into .js and execute or use Bun.sh

node index.ts

Check

Run a Quick cURL Test

curl http://localhost:3500/ui/main

You will see an JSON Response that directly corresponds to the interface code we just wrote.

We will continue to Components and Server-Side Callbacks Once we get the App Up and running!