JSPM

  • Created
  • Published
  • Downloads 77
  • Score
    100M100P100Q94329F
  • License MIT

NyxCode โ€” The AI-native programming language. One .nyx file = full-stack app. 3.5x fewer tokens than Next.js.

Package Exports

  • @fabudde/nyxcode
  • @fabudde/nyxcode/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@fabudde/nyxcode) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

๐Ÿฆž NyxCode

The AI-native programming language. One .nyx file = full-stack app.

npm Tests License: MIT

๐ŸŒ nyxcode.io ยท ๐Ÿ“Š NyxStatus.com (built in 378 lines of NyxCode)


Why NyxCode?

AI writes most code in 2026 โ€” but still thinks in React, Vue, and raw HTML. Every token costs money, time, and context window.

NyxCode: 3.5x fewer tokens than Next.js. 71% cheaper AI generation.

NyxCode Next.js Savings
Lines 378 1,069 65% fewer
Files 1 27 27x fewer
Tokens ~2,733 ~9,476 3.5x fewer
AI cost ~$0.20 ~$0.71 71% cheaper

Real benchmark: NyxStatus.com โ€” identical full-stack SaaS, measured with cl100k_base.

Quick Start

npm i -g @fabudde/nyxcode
nyx build app.nyx -o dist/        # Static site
nyx build app.nyx                 # Full-stack (auto-detects tables/api)
nyx dev app.nyx                   # Dev server + hot reload
nyx add stripe                    # Add package + npm install

Full-Stack in 16 Lines

table posts { title text required, body text, created auto }
security { table users, login email password, token jwt, protect /api/posts write }
theme { colors { primary #667eea, bg #0a0a12, card #1a1a2e } }
preset card { bg card, r 12px, p 2rem }

page / {
  section style={ mw 800px, mx auto, p 2rem } {
    h1 "My Blog"
    form /api/posts auth { input title, submit "Post", success -> reload }
    data posts = get /api/posts auth
    each posts -> div preset=card { h3 .title, p .body }
  }
}
page /register {
  form /api/auth/register { input email, input password, submit "Register", success -> redirect / }
}

This generates: index.html, register/index.html, AND server.js (10 CRUD endpoints + JWT auth + SQLite). Zero config.

React vs NyxCode

React โ€” 20+ lines:

import React, { useState, useEffect } from 'react';
export default function UserList() {
  const [users, setUsers] = useState([]);
  useEffect(() => {
    fetch('/api/users').then(r => r.json()).then(setUsers);
  }, []);
  return (
    <div className="container">
      {users.map(u => (
        <div key={u.id} className="card">
          <h3>{u.name}</h3><p>{u.email}</p>
        </div>
      ))}
    </div>
  );
}

NyxCode โ€” 4 lines:

page /users {
  data users = get /api/users
  each users -> card { h3 .name, p .email }
}

Same result. 76% fewer lines. 68% fewer tokens.

v0.30.0 โ€” The Language Release ๐Ÿ”ฅ

NyxCode is now a programming language, not just a DSL. New backend primitives:

let โ€” Variable Bindings

api GET /api/stats auth {
  let users = query "SELECT COUNT(*) as n FROM users"
  let posts = query "SELECT COUNT(*) as n FROM posts"
  respond 200 { status "ok" }
}

let โ€” Reactive Page-Local Variables (v0.33.0)

page '/counter' {
  let count = 0
  let name = "Nyx"
  const label = "Counter"

  h1 "Hello ${name}!"
  p "${label}: ${count}"
  button "+" @click { count += 1 }
}

let in pages/components creates reactive variables โ€” changes auto-update the DOM. const is compile-time inlined with zero runtime cost.

action โ€” Reusable Server Functions

action sendWelcome(email) {
  email to=email subject="Welcome!" body="Thanks for joining."
  on error { respond 500 { error "Email failed" } }
}

on โ€” Table Lifecycle Events

on users.created {
  email to=row.email subject="Welcome!" body="You're in!"
}

env โ€” Environment Variables

env {
  DATABASE_URL required
  STRIPE_KEY required
  DEBUG default="false"
}

email โ€” First-Class Email

email to=user.email subject="Order confirmed" body="Your order is ready."

use โ€” Three-Tier Package System

use stripe           # Tier 1: built-in adapter (auto-init from env)
use nodemailer       # Tier 1: SMTP + sendEmail() helper
use npm:"slugify"    # Tier 2: raw npm require (warning)

every โ€” Background Workers

every 60s 'health-check' {
  query "SELECT id, url FROM monitors"
  fetch $row.url
}

pipe โ€” Declarative Logic Chains (v0.32.0)

pipe 'new-order' {
  on api POST /api/orders auth
  validate $body.email is email
  validate $body.total is number min=1
  query "INSERT INTO orders (email, total) VALUES ($body.email, $body.total)" as result
  set order_id = $result.lastInsertRowid
  notify email to=$body.email subject="Order #$order_id"
  log "Order $order_id created"
  respond 201 { id: $order_id, status: created }
}

16 steps: validate, query, fetch, set, transform, each, when, on change, notify (email/sms/webhook), log, respond, abort, run pipe. Parameterized SQL, webhook security, state detection. See NYXCODE.md.

Multi-Query API Blocks

api POST /api/monitors/delete auth {
  query "DELETE FROM checks WHERE monitor_id = $id"
  query "DELETE FROM alerts WHERE monitor_id = $id"
  query "DELETE FROM monitors WHERE id = $id AND user_id = $req.user.id"
}

Forms Inside each Loops

each alerts -> alert {
  form "/api/alerts/delete" auth {
    input id hidden value=.id
    submit "โœ•" preset=btn-delete
    success -> reload
  }
}

Backend Auto-Detection

No flags. If your .nyx has table/api/action/security/use/on/env/every/pipe โ†’ server.js generated. Otherwise โ†’ HTML only.

Features

๐ŸŽจ Design System

theme {
  colors { primary #667eea, bg #0a0a12 }
  fonts { body Inter, source: google }
  body { bg #0a0a12, c #f0eaff }
  selection { bg rgba(155,142,196,0.3) }
  defaults { a { c primary, td none } }
}
preset card { bg surface; r 12px; p 2rem }

โšก Animations

keyframes drift {
  0%, 100% { tf translate(0, 0) }
  50% { tf translate(-2%, 1.5%) }
}

๐Ÿ“ฑ Responsive

div grid=3@1 gap=2rem { ... }     # 3 cols desktop, 1 col mobile
nav burger brand="MySite" { ... }  # Accessible mobile menu, zero JS
style { @mobile { fs 0.9rem } }    # Built-in breakpoints

๐Ÿงฉ Components

component Card(title, desc, status="Active") {
  div preset=card {
    h3 "${title}"
    p "${desc}"
    span "${status}"
  }
}
page / { use Card("Hello", "World") }

๐Ÿ” Auth & Security

security { table users, login email password, token jwt, protect /api/posts write }
page /dashboard auth { ... }           # Auto-redirect if not logged in
a "Login" visible=guest                # Show only when logged out
a "Dashboard" visible=auth             # Show only when logged in

๐Ÿ“Š Data Binding

data posts = get /api/posts auth {
  loading -> p "Loading..."
  empty -> p "No posts yet"
  error -> p "Something went wrong"
}
each posts -> div { h3 .title, img src=.image alt=.title }

๐Ÿ—ƒ๏ธ Database + Auto-Migrations

table posts {
  title text required
  body text
  author [users]         # Foreign key โ†’ auto JOIN
  created auto
  category text default="general"   # Add columns anytime โ€” auto-migrated!
}
# Auto-generates: GET/POST/PUT/DELETE endpoints + pagination + search + filtering
# Auto-migrates: New columns applied at startup, zero data loss

๐ŸŽฏ Native Icons (v0.31.0)

theme { icons: lucide }                           # Lucide, Phosphor, or Tabler
icon "heart" size=24                               # Standalone icon
icon "stethoscope" size=32 style={ c #2a7d5f }    # With style
h1 "icon:map-pin Our Location"                     # Inline in text

CSS Shorthands

Short CSS Short CSS
bg background c color
m / p margin / padding mx / px margin-inline / padding-inline
w / h width / height mw / mh max-width / max-height
fs font-size fw font-weight
r border-radius shadow box-shadow
d display pos position
op opacity cur cursor
td text-decoration ta text-align
tr transition tf transform
ai align-items jc justify-content

Full list (100+ shorthands) โ†’

Architecture

.nyx โ†’ Lexer โ†’ Parser โ†’ AST โ†’ Compiler โ†’ HTML + CSS + JS
                                        โ†’ Express + SQLite (if backend detected)
  • Lexer โ€” Keyword detection, hex colors, strings, comments
  • Parser โ€” Recursive descent, typed AST with 40+ node types
  • Compiler โ€” Scoped CSS, HTML emission, reactive JS codegen
  • Backend Compiler โ€” Express routes, SQLite CRUD, JWT auth, background workers
  • CLI โ€” build, dev, parse, flatten, add, theme import

NyxStatus โ€” The Proof

378 lines. One file. Full SaaS.

nyxstatus.com โ€” Uptime monitoring with JWT auth, SQLite DB, CRUD API, background health checks, email alerts, cascade deletes, responsive dark theme. 100% NyxCode.

Design Principles

  1. Token Economy โ€” Every character earns its place
  2. One Language โ€” Author writes only NyxCode
  3. Convention over Configuration โ€” Sane defaults, escape hatches when needed
  4. Single-Word Keywords โ€” No compound keywords, ever
  5. Secure by Default โ€” Prepared statements, escaped output, rate limiting
  6. The Golden Rule โ€” If it's not shorter than JS, it shouldn't exist in NyxCode

Versions

Version Highlights
v0.32.0 pipe โ€” Declarative Logic Chains โ€” 16 step types, parameterized SQL, webhook security, state detection, pipe-to-pipe
v0.30.0 The Language Release โ€” let, action, on, env, email, use, respond, forms in each, multi-query API
v0.27.x page auth, visible=auth/guest, $param.id, every, pagination, search
v0.26.x mask-* auto-prefix, compile-time when, picture/source, security hardening
v0.25.x Body styles, keyframes, ::selection, element defaults โ€” all native
v0.24.x Burger nav, multi-file imports, Figma token import, nyx flatten
v0.23.x Theme composition, numeric-prefix keys
v0.22.x Full design token system, dark mode
v0.20.x Component syntax with ${} interpolation
v0.1.0 Genesis

Created By

Fabian Budde ๐Ÿป โ€” Creator & Language Design Nyx ๐Ÿฆž โ€” Lead Developer & Compiler Engineering โ€” @NyxTheLobster Tyto ๐Ÿฆ‰ โ€” Architecture & Security Review โ€” @heyTyto Kiro ๐Ÿบ โ€” QA & Technical Documentation

A human and three AIs building the language that bridges both worlds.

License

MIT


NyxCode v0.30.0 โ€” 365 tests โ€” npm โ€” NYXCODE.md (full AI context file) โ€” nyxstatus.com

๐Ÿฆž