WorkRoot/WRNexusJSDoc
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: build private preview framework portal

Browse Source
This commit is contained in:
Clintchiz
2026-07-12 23:23:31 +05:30
parent 9e8fb14a8c
commit a95766039c
43 changed files with 1125 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/pages/getting-started.wrn
+34 -20
View File
@@ -1,31 +1,45 @@
page Gettingstarted {
seo {
title = "Getting started"
description = "Getting started with WRNexusJS"
description = "Build and run a first WRNexusJS application after receiving private preview access."
canonical = "https://wrnexusjs.dev/getting-started"
}
view {
<a class="skip-link" href="#main">Skip to content</a>
<div class="docs-shell">
<header class="topbar">
<a class="brand" href="/"><span>W</span> WRNexusJS</a>
<nav><a href="/getting-started">Get started</a><a href="/packages">Packages</a><a href="/language">Language</a><a href="/architecture">Architecture</a></nav>
<button data-wire-theme-toggle class="theme-button" aria-label="Toggle theme">Theme</button>
</header>
<main class="page"><article class="documentation prose standalone"><span class="eyebrow">Guide</span><h1>Getting started</h1><p>Create a production-ready WRNexusJS application with Bun.</p><h2>1. Create the project</h2><pre><code>bunx @wrnexus/cli create my-app
<header class="topbar"><a class="brand" href="/"><span>W</span> WRNexusJS</a><nav aria-label="Primary"><a href="/getting-started">Get started</a><a href="/tutorial">Tutorial</a><a href="/architecture">Architecture</a><a href="/language">.wrn language</a><a href="/packages">Packages</a><a href="/examples">Examples</a><a href="/roadmap">Roadmap</a><a href="/changelog">Changelog</a><a href="/security">Security</a><a href="/support">Support</a><a href="/search">Search</a></nav><a class="preview-pill" href="/access">Private preview · v0.2.15</a><button data-wire-theme-toggle class="theme-button" aria-label="Toggle color theme">Theme</button></header>
<div class="mobile-doc-nav"><details><summary>Browse documentation</summary><nav><a href="/getting-started">Get started</a><a href="/tutorial">Tutorial</a><a href="/architecture">Architecture</a><a href="/language">.wrn language</a><a href="/packages">Packages</a><a href="/examples">Examples</a><a href="/roadmap">Roadmap</a><a href="/changelog">Changelog</a><a href="/security">Security</a><a href="/support">Support</a><a href="/search">Search</a></nav></details></div>
<main id="main" class="portal-main"><nav class="breadcrumbs" aria-label="Breadcrumb"><a href="/">Home</a><span aria-hidden="true">/</span><span>Documentation</span><span aria-hidden="true">/</span><span aria-current="page">Getting started</span></nav><article class="documentation prose standalone"><span class="status status-beta">Preview guide · v0.2.15</span><h1>Build a contact inbox</h1><p>This path creates a server-rendered page, validated API route, middleware, and realtime next step. It requires approved registry access and Bun 1.3.x; this site was verified with Bun 1.3.14.</p><h2 id="create">1. Create the project</h2><pre><code>bunx @wrnexus/cli@0.2.15 create my-app
cd my-app
bun install
bun run dev</code></pre><h2>2. Add a page</h2><pre><code>page Dashboard {
state count = 0
view {
&lt;main&gt;
&lt;h1&gt;Dashboard&lt;/h1&gt;
&lt;button @click=&quot;count++&quot;&gt;{count}&lt;/button&gt;
bun run dev</code></pre><h2 id="structure">2. Know the structure</h2><pre><code>app/pages/ # file-based .wrn routes
app/components/ # reusable .wrn components
app/api/ # TypeScript request handlers
app/middleware/ # ordered request middleware
app/schemas/ # shared validation
app/realtime/ # realtime rooms
wrnexus.config.ts</code></pre><h2 id="page">3. Add a page</h2><pre><code>page Contacts &#123;
view &#123;
&lt;main&gt;&lt;h1&gt;Contact inbox&lt;/h1&gt;
&lt;form data-schema="contact" action="/api/contacts" method="post"&gt;
&lt;input name="email" type="email" /&gt;&lt;span data-error="email"&gt;&lt;/span&gt;
&lt;textarea name="message"&gt;&lt;/textarea&gt;&lt;span data-error="message"&gt;&lt;/span&gt;
&lt;button type="submit"&gt;Send&lt;/button&gt;
&lt;/form&gt;
&lt;/main&gt;
}
}</code></pre><h2>3. Verify and build</h2><pre><code>wrnexus doctor
wrnexus test
wrnexus build</code></pre><h2>Where things live</h2><ul><li><code>app/pages</code> contains routes.</li><li><code>app/components</code> contains reusable .wrn components.</li><li><code>app/api</code> contains server API handlers.</li><li><code>app/layouts</code> contains shared shells.</li><li><code>app/middleware</code> contains request middleware.</li><li><code>wrnexus.config.ts</code> configures security, styles, data, mobile, and deployment.</li></ul></article></main>
<footer>WRNexusJS 0.2.15 · SSR-first · Bun-native · Documentation generated from published package APIs.</footer>
&#125;
&#125;</code></pre><h2 id="api">4. Validate an API route</h2><pre><code>import schema from "../schemas/contact";
import &#123; parseBody &#125; from "@wrnexus/validation";
export const POST = async (ctx) =&gt; &#123;
const result = await parseBody(schema, ctx.req);
return result.ok ? Response.json(&#123; ok: true &#125;, &#123; status: 201 &#125;) : result.response;
&#125;;</code></pre><h2 id="server-data">5. Load server data</h2><p>Use an <code>ssr</code> API binding and a server <code>&#123;#each&#125;</code> block. See <a href="/guides/server-data">Server data</a> for the complete verified pattern.</p><h2 id="middleware">6. Add middleware</h2><pre><code>export default async function logger(ctx, next) &#123;
console.log(ctx.req.method, ctx.url.pathname);
return next();
&#125;</code></pre><h2 id="test-build">7. Test and ship</h2><pre><code>bun run test
bun run build
bun dist/server.js</code></pre><p>Next: <a href="/guides/deployment">deployment</a>, <a href="/guides/database">database</a>, <a href="/guides/authentication">authentication</a>, and <a href="/guides/workspaces-and-gateway">workspaces</a>.</p></article></main>
<footer><p><strong>WRNexusJS 0.2.15</strong> · Private Developer Preview · Bun-native</p><nav aria-label="Footer"><a href="/access">Request access</a><a href="/license">License</a><a href="/security">Security</a><a href="/support">Support</a><a href="/llms.txt">AI guide</a></nav><p>WRNexusJS is created by <a href="https://workroot.in/">WorkRoot</a>. WRNexus is a separate SaaS product.</p></footer>
</div>
}
}
}