I built a full-stack web framework where everything lives in one file

Source: Dev.to

Overview

Hey

Over the past weeks, I’ve been working on something a bit unusual.

I built a framework called Luxaura that lets you create full‑stack web apps using a single file format: .lux.

👉 UI, state, backend logic, and styling — all in one place.

Why I built this

While working with tools like React and other modern frameworks, I kept feeling the same friction:

• One feature = multiple files
• UI here, state there, API somewhere else
• Constant context switching

It works, but it can feel… fragmented.

So I started wondering: what if everything related to a feature lived in one place?

The idea

A .lux file combines:

• canvas → UI
• signal → state
• receive → inputs
• vault → backend logic (server‑only)
• paint → styling

Instead of jumping between layers, you stay in one readable structure.

Example

Here’s a simple counter:

receive
    title: String = "My Luxaura App"

signal
    count: 0

canvas
    Scene
        Stack
            Headline ">"
            Body "Clicked > times"

            Trigger "Click me"
                when click:
                    count = count + 1

Backend… inside the same file

This is the part I found most interesting.

signal
    status: "Send a message"

vault
    action contact(name, email, message):
        if (!name || !email || !message) {
            return "Please fill every field."
        }
        return `Message received from ${name}`

canvas
    Scene
        Stack
            Trigger "Send"
                when click:
                    status = await vault.contact(name, email, message)

👉 Code inside vault runs only on the server. No separate API routes. No accidental leaks to the client.

What it tries to improve

• Reduce file fragmentation
• Make full‑stack development feel more “local”
• Keep backend logic clearly separated and safe
• Generate static‑first HTML for better performance

What it’s NOT (yet)

• It doesn’t have the ecosystem of React
• It’s still early and experimental
• Probably not ready for large production apps

Where I think it could fit

Luxaura might make sense for:

• Small‑to‑medium apps
• Dashboards
• Internal tools
• Rapid prototyping

What I’m testing now

I’m currently comparing it against frameworks like React and Next.js by building the same app in each.

Also working on:

• Supporting external libraries (like Bootstrap, Anime.js)
• Improving developer experience
• Making the syntax clearer

I’d really like your feedback

I’m not trying to “replace React”. I’m just exploring a different way of building apps.

If you’re curious, you can check it out here:
https://www.npmjs.com/package/luxaura

I’d love to know:

• Does this make sense to you?
• What feels confusing?
• Would you ever try something like this?

Thanks for reading 🙌