Search Users

ID	Name	Role	Tags	Country	Active	Created
10431	John Doe	user	locationcommerceaddress	United States	Yes	2 days ago
10432	Jane Doe	admin	locationcommerceaddress	Canada	Yes	last week

Name

Country

Choose a Country

Full Stack Content Management Framework

Stackpress is a server-first framework with modern routing, React Templating, SQL Dialects and an Admin generator. Go from zero to sixty and 💯 open source.

Get Started Read the Docs

The Good Ol' Days

Stackpress is unopinionated and provides a full-stack toolset encouraging abstraction, design patterns and object oriented programming.

import { server } from 'stackpress/http'

const app = server()

app.get('/', (req, res) => {
  const name = req.data('name')
  res.render('@/views/home', { name })
})

app.create().listen(3000, () => {
  console.log('Listening on port 3000')
})

Unopinionated

Design your project file system the way you want. Customize your build process, continuous integration & deployment.

Routing

Event driven, Express-like routing with mapping & analytics for bundlers. Lazy & Priority routing. Customizable view engine.

Pluggable

Designed with separation of concerns and extensibility in mind. Create and publish your own plugins. Toggle built-in plugins.

Open Source Core

Stackpress is a combination of open source projects managed by the team. Separate issue trackers. Syncronized releases.

React Template Engine

Pass server props and render "mini-apps". React reactive templating. Use any Vite plugin. Bring your own build script. Ejectable for production.

• No frontend server
• No global state management
• No memoization needed
• No suspense needed
• No frontend routing system

export function Head(props: ServerPageProps) {
  const { styles = [] } = props
  return (
    <>
      <title>Stackpress</title>
      <meta name="description" content="Stackpress" />
      <link rel="icon" type="image/x-icon" href="/favicon.ico" />
      <link rel="stylesheet" type="text/css" href="/styles/global.css" />
      {styles.map((href, index) => (
        <link key={index} rel="stylesheet" type="text/css" href={href} />
      ))}
    </>
  )
}

export default function HomePage(props: ServerPageProps) {
  const { session, request, response } = props
  const [count, setCount] = useState(0)

  return (
    <Layout session={session} request={request} response={response}>
      <div className="p-4">
        <h1>Welcome to Stackpress</h1>
        <button onClick={() => setCount((count) => count + 1)}>
          count is {count}
        </button>
      </div>
    </Layout>
  )
}

Built-in Tools

Don't start from scratch. Stackpress comes with a default set of tools to get you started. Toggle them to build against your project requirements.

Theming

Light & Dark mode. Use Tailwind style & CSS variables.

Language

Static i18n & translations for backend & frontend.

CLI

Emit events, query database & add your own commands.

SQL Dialects

Simple query builder, raw queries & transactions.

Authentication

Sign-in, sign-up, sign-out, password reset & email verification.

Permissions

User roles & static permissions to white-list routes and events.

OAuth & API

Public, app and user endpoints using static configuration.

Email

Basic SMTP configuration and backend send events.

UI Components

Just React components. Bring your own design system.

From Idea to Reality

Express your idea in a file to generate types, models, database tables, components, pages and even an Admin panel. Progessively change even after your first deploy. Make your own custom generators and bring your own AI.

model User
  @label("User" "Users") 
  @template("{{name}}") 
  @icon("user") 
{
  id          String    @label("ID") 
                        @id @default("cuid()")
                        @list.overflow({ length 10 hellip true })
  
  name        String    @label("Name") 
                        @searchable
                        @field.text({ required true })
                        @is.required("Required")
                        @is.notempty("Cannot be empty")
                        @list.text @view.text

  image       String?   @label("Image") 
                        @field.url
                        @list.image(20 20) 
                        @view.image(100 100)
  
  type        String    @label("Type") 
                        @default("person") 
                        @filter.text
                        @field.text({ required true })
                        @is.notempty("Cannot be empty")
                        @list.text({ lower true }) 
                        @view.text({ lower true })
  
  roles       String[]  @label("Roles") 
                        @field.textlist({ add "Add Role" })
                        @list.hide @view.taglist
  
  references  Hash?     @label("References") 
                        @default("{}")
                        @field.metadata({ add "Add Reference" })
                        @list.hide @view.metadata
  
  active      Boolean   @label("Active") 
                        @default(true) @active
                        @filter.switch
                        @list.hide @view.yesno
  
  created     Datetime  @label("Created") 
                        @default("now()") @sortable
                        @span.datetime
                        @list.date("m d, Y h:iA") 
                        @view.date("m d, Y h:iA")
}

UsersCreate User

Name

Image

https://images.wsj.net/im-580612/8SR

Type

Roles

References

Active

Open Source Foundry

Built on top of both popular and open source projects we manage with Apache GPLv3 Licenses.

Idea

Idea language specification and parser. Streamline and automate major parts of your software development.

Ingest

An event driven server/less framework. Deploy to AWS Lambda, GCP Functions, Azure, Netlify, and Vercel.

Inquire

SQL query builder and composite engine for MySQL, Postgres, SQLite, Cockroach DB, Neon DB, Supabase and more.

Reactus

A reactive React template engine for next generation server focused web applications.

What Are You Waiting For?

Get Started Read the Docs