Rapid App & Library Development

[!WARNING] Stay tuned. Open Beta coming soon.

Stacks is a rapid development framework, where the goal is to help you create & maintain frontends, backends, and clouds—without having to worry about the boilerplate. An all-in-one toolkit that meets all your full stack needs.

• Web & Desktop Applications (including system tray apps)
• Serverless & Traditional APIs
• Cloud Infrastructure Creation & Maintenance
• Interactive CLIs
• Framework-agnostic Component & Function Libraries
• Deployment & Release Manager (CI & CD)

Convention Over Configuration

As a developer, Stacks helps you every step along the way—in beginner & expert-friendly ways, allowing you to focus on the what & why of your project, all while enabling you to stay in control & ownership of your (& your users’) data.

“It is the framework’s responsibility to remove patterns that lead to boilerplate code. And Stacks is really good at that.” - Chris

Get Started

It’s incredibly easy to get started with this framework. Simply run the following command in your terminal:

1curl -Ssf stacksjs.org/install | sh # wip
2
3# alternatively, if Bun >= v1.2.0 is installed already,
4# you may also get started via:
5bunx buddy new my-project

Usage

The following list includes some of the most common ways to interact with the Stacks API.

Meet the toolkit, Buddy:

1buddy install # installs all dependencies
2buddy dev # starts one of the dev servers (frontend, API, components, docs, desktop, etc.)
3buddy share # creates a sharable link of your local project
4buddy build # follow CLI prompts to select which library (or server) to build
5buddy commit # follow CLI prompts for committing changes
6buddy release # creates the releases for the stack & consequently, publishes them to npm
7buddy upgrade # auto-update all deps & the Stacks framework
8
9buddy make:component HelloWorld # scaffolds a Component
10buddy make:function HelloWorld # scaffolds a Function
11buddy make:model Car # scaffolds a Model
12buddy make:action UpdateCar # scaffolds an Action
13buddy make:migration create_cars_table # scaffolds a Migration
14buddy make:view Car # scaffolds a Page (https://my-project.test/car)
15buddy make:command Inspire # scaffolds a Command
16buddy make:job SendEmail # scaffolds a Job
17buddy make:middleware Logger # scaffolds a new Middleware
18buddy make:notification WelcomeEmail # scaffolds a Notification
19buddy make:lang de # scaffolds a language file
20
21buddy list # lists all available commands
22buddy --help

1buddy --version # get the Stacks version
2buddy --help # view help menu
3# please note: you may suffix any command with the
4# `command --help` flag to review the help menu
5
6buddy install # installs dependencies
7buddy add # adds a stack or dependency
8buddy fresh # fresh reinstall of all deps
9buddy clean # removes all deps
10buddy setup # sets up the project initially
11buddy setup:oh-my-zsh # optional: sets up Oh My Zsh with auto-completions & "aliases"
12
13buddy upgrade # upgrades all dependencies
14buddy upgrade -i # prompts you to select which updates to apply (wip)
15buddy upgrade:dependencies # auto-upgrades package.json deps
16buddy upgrade:framework # auto-upgrades deps & the Stacks framework
17buddy upgrade:search-engine # auto-upgrades configured search engine
18buddy upgrade:shell # upgrades the shell integration
19buddy upgrade:binary # upgrades the `stacks` binary
20buddy upgrade:bun # upgrades to latest project-defined Bun version
21buddy upgrade:all # auto-upgrades all of the above
22
23# if you need any more info on any command listed here, you may suffix
24# any of them via the "help option", i.e. `buddy ... --help`
25
26buddy dev # starts the frontend dev server
27buddy dev -i # prompts any of the dev servers (components, functions, views, docs, or api)
28buddy dev:api # starts the API dev server
29buddy dev:dashboard # starts the Admin/Dashboard dev server
30buddy dev:desktop # starts the Desktop dev server
31buddy dev:views # starts frontend dev server
32buddy dev:components # starts component dev server
33buddy dev:functions # stubs functions
34buddy dev:docs # starts local docs dev server
35buddy dev docs # also starts the local docs dev server (colon is optional for all commands)
36buddy development # `buddy dev` alias
37
38buddy share # creates a sharable link to your local project
39
40# for Laravel folks, `serve` may ring more familiar than the `dev` name. Hence, we aliased it:
41buddy serve
42buddy serve:components
43buddy serve:desktop
44buddy serve:views
45buddy serve:functions
46buddy serve:docs
47
48# building for production (e.g. AWS, Google Cloud, npm, Vercel, Netlify, et al.)
49buddy build # select a specific build (follow CLI prompts)
50buddy build:views # builds SSG views
51buddy build:desktop # builds Desktop application
52buddy build:library # builds any or all libraries
53buddy build:functions # builds function library
54buddy build:components # builds Vue component library & Web Component library
55buddy build:web-components # builds framework agnostic Web Component library (i.e. Custom Elements)
56buddy build:vue-components # builds Vue 2 & 3-ready Component library
57buddy build:all # builds all your code
58
59# `buddy build` aliases
60buddy prod
61buddy prod:components
62buddy prod:desktop
63buddy prod:library
64buddy prod:views
65buddy prod:functions
66buddy prod:vue-components
67buddy prod:web-components
68buddy prod:all
69buddy production # `buddy prod` alias
70
71# sets your application key
72buddy key:generate
73
74buddy make:component HelloWorld # bootstraps a HelloWorld component
75buddy make:function hello-world # bootstraps a hello-world function
76buddy make:view hello-world # bootstraps a hello-word page
77buddy make:model Car # bootstraps a Car model
78buddy make:database cars # creates a cars database
79buddy make:migration create_cars_table # creates a cars migration file
80buddy make:factory cars # creates a Car factory file
81buddy make:table cars # bootstraps a cars data table
82buddy make:notification welcome-email # bootstraps a welcome-email notification
83buddy make:lang de # bootstraps a lang/de.yml language file
84buddy make:stack my-project # shares logic with `bunx --bun stacks new my-project`
85
86buddy migrate # runs database migrations
87buddy migrate:dns # sets the ./config/dns.ts file
88
89buddy dns example.com # list all DNS records for example.com
90buddy dns example.com --type MX # list MX records for example.com (proxies dog)
91
92buddy https httpie.io/hello
93# http [flags] [METHOD] URL [ITEM [ITEM]]
94buddy http --help
95buddy http PUT pie.dev/put X-API-Token:123 name=John # Custom HTTP method, HTTP headers and JSON data
96buddy http -v pie.dev/get # See the request that is being sent using one of the output options
97buddy http -f POST pie.dev/post hello=World # submitting forms
98buddy http --offline pie.dev/post hello=offline
99buddy http -a USERNAME POST https://api.github.com/repos/httpie/cli/issues/83/comments body='HTTPie is awesome! :heart:'
100buddy http pie.dev/post < files/data.json
101buddy http pie.dev/image/png > image.png
102buddy http --download pie.dev/image/png
103buddy http --session=logged-in -a username:password pie.dev/get API-Key:123
104buddy http --session=logged-in pie.dev/headers
105buddy http localhost:8000 Host:example.com
106
107buddy lint # runs linter
108buddy lint:fix # runs linter and fixes issues
109
110buddy commit # follow CLI prompts for committing staged changes
111buddy release # creates the releases for the stack & triggers the Release Action (workflow)
112buddy changelog # generates CHANGELOG.md
113
114# when deploying your app/s to a remote server or cloud provider
115buddy deploy # select a specific deployment (follow CLI prompts)
116# buddy deploy:docs # deploys docs to AWS (or other configured provider)
117# buddy deploy:functions # deploys functions to AWS (or other configured provider)
118# buddy deploy:views # deploys views to AWS (or other configured provider)
119# buddy deploy:all # deploys all your code
120buddy undeploy # be careful: "undeploys" removes/deletes your deployed resources
121
122buddy cloud:remove # removes cloud setup
123buddy cloud:cleanup # removes cloud setup & cleans up all potentially leftover resources
124buddy cloud:add --jump-box # adds a jump box to your cloud setup
125
126# select the example to run (follow CLI prompts)
127buddy example # prompts you to select which example to run
128buddy example:vue # runs the Vue example
129buddy example:web-components # runs the Web Component example
130
131# you likely won’t need to run these commands as they are auto-triggered, but they are available
132buddy generate  # prompts you to select which generator to run
133buddy generate:types # generates types for your components, functions, & views
134buddy generate:entries # generates entry files for components, functions, & views
135buddy generate:web-types # generates Web Component types
136buddy generate:vscode-custom-data # generates VSCode custom data
137buddy generate:ide-helpers # generates IDE helpers
138buddy generate:component-meta # generates component meta
139buddy generate:all # runs all generators
140
141# generates your application key
142buddy key:generate # generates your application key
143
144# generate your TypeScript declarations
145buddy types:generate # generates types for your components, functions, & views
146buddy types:fix # auto-fixes types for your components, functions, & views
147
148buddy domains # alias for `buddy domains:list`
149buddy domains:add stacksjs.org # adds a domain
150buddy domains:remove stacksjs.org # removes a domain
151buddy domains:list # lists all domains
152buddy domains:update # apply ./config/dns.ts updates
153buddy domains:purchase stacksjs.org # purchase a new domain
154
155# test your stack
156buddy test # runs test suite (unit & e2e)
157buddy test:coverage # runs test coverage
158buddy test:types # runs typecheck
159
160# the CLI may be triggered in any
161# of the following syntax:
162stx fresh
163buddy fresh
164bud fresh

Read more here about the Stacks CLI in the documentation.

Features

The Stacks framework is a harmony of several “engines” to build any web and/or desktop application, in highly scalable & privacy-friendly ways. It consists of the following engines:

Frontend Development

Develop dynamic UIs with helpers for atomic design, and much more.

• 🧩 Components primitive to develop user interfaces
• 🤖 Functions primitive to develop business logic (and grant your UI superpowers)
• 🎨 UI Kit modern & deeply-integrated components
• 🌐 Web “a routing & templating engine that makes sense”
• 🖥️ Desktop transforms your web app into a desktop app, plus more
• 📝 Documentation markdown-based documentation, auto-generated
• 📚 Library auto-builds & manages component & function libraries
• ⚡️ Powered by Bun, Tauri, UnoCSS, Vite, VitePress and Vue

Backend Development

Develop serverless (or server) functions with countless helpers to build scalable & fast APIs.

• 🪄 AI deep AI integrations & foundational model access
• 🤖 APIs scalability & maintainability built-in
• 🏎️ Cache unified caching for DynamoDB, Redis and more
• ⚙️ CLIs create beautiful CLIs for Linux, Windows, and Mac (dependency-free binaries)
• 📀 Database DynamoDB, SQLite, MySQL, Postgres, and more
• 👾 Errors native type-safe error handling
• 🗓️ Events functional event (front & backend) communication
• 📢 Notifications emails, SMSs, direct, and push notifications & webhooks
• 🗺️ ORM automated schemas for scale & a pretty API
• 💳 Payments unified API for one-off & subscription billing methods for Stripe
• ⚙️ Queues run any heavy workload in the background
• 🛠️ Query Builder powerful, type-safe SQL query builder
• 💬 Realtime “everything you need to build dynamic real-time apps”
• 🧭 Router smart routing, file-based or Laravel-like
• 🔎 Search Engine smart searching, advanced filtering & sorting, pagination, headless UI
• 💾 Storage a secure-by-default File API that feels right
• 🧪 Tinker a powerful TypeScript REPL
• 🌪️ Validation e2e type-safety (true frontend & backend harmony)
• 🎯 X-Ray all you need to debug, log & analyze

Cloud Development

Develop & maintain cloud infrastructure with ease. “Imagine Vercel, Vapor and Forge having been unified.”

• ☁️ Server local development server & production-ready servers out-of-the-box
• ⛅️ Serverless on-demand, auto-scaling, zero maintenance
• ⏰ Alarms built-in cloud infrastructure monitoring to avoid surprises
• 🚏 CDN zero-config, low-latency, request life-cycle hooks, optimized request compressions (Brotli & gzip)
• 🔀 Domain version-controlled & zero-config domain management (e.g. DNS management)
• 🤖 AI fine-tune a foundational model using your application data
• 📧 Email secure & zero-setup easy-peasy@custom-domains.com mailboxes
• 🔐 Firewall native web application firewall support
• 📦 Storage unlimited cloud storage & automatic backups
• 🚜 Maintenance maintain your cloud infrastructure with ease using Buddy & Stacks
• 🚦 Infrastructure as Code version-controlled cloud infrastructure (AWS, Google next?)

CI/CD

Focus on coding, not publishing.

• 🚀 Deployment Manager takes the sweat out of production deployments—zero-setup push-to-deploy
• 0️⃣ Zero Downtime deploy with confidence using a zero-downtime deployment strategy
• 📫 Release Manager libraries (component & function) auto-published to npm, git helpers, and more

Developer Experience (DX)

Convention over configuration, while staying wholly configurable. No more boilerplate.

• 💎 Automated Upgrades no need to worry about upgrading to the latest versions, Stacks upgrades you
• 🦋 Pretty Dev URLs your-project.localhost instead of localhost:3000
• 💡 IDE Integration auto-completions, inline docs & a powerful VS Code setup
• 🪄 Zero-Config yet highly configurable—convention over configuration
• 💅 Linter & Formatter auto-configured & built into your IDE
• 💪🏼 Type Strong built-in e2e type-safety
• ✨ Git Workflows committing with ease
• 🚗 Auto Imports your components & functions, including date, string, array, & object helpers
• ⏩ Code Snippets goodbye to the boilerplate code—thank you Sarah Drasner
• 🔤 Spell Checker be notified once there are typos
• 🛠️ Essential Utilities powers at your fingertips. Collections, VueUse, and more
• 👥 Team Management manage your team & their permissions
• 🧪 Streamlined Testing unit & e2e tests powered by Bun, Vitest & Playwright

No matter whether you are a beginner or an expert, the approachable Stacks design allows you to learn at your own pace, using our thorough documentation covering every aspect of the framework. Stacks is extremely beginner & expert-friendly.

Develop beautiful, reactive, composable UIs without learning a new set of languages. HTML, CSS, and minimal JavaScript—that’s all you need to dive in now! Or TypeScript ✌🏼

An actual rapid application development framework for all Full Stack needs. Next-level simplicity & DX.

Testing

1./buddy test

Changelog

Please see our releases page for more information on what has changed recently.

Contributing

Please see the Contributing Guide for details.

Community

For help, discussion about best practices, or any other conversation that would benefit from being searchable:

Discussions on GitHub

For casual chit-chat with others using this package:

Join the Stacks Discord Server

Postcardware

Stacks OSS will always stay open-sourced, and we will always love to receive postcards from wherever Stacks is used! And we also publish them on our website. Thank you, Spatie.

Our address: Stacks.js, 12665 Village Ln #2306, Playa Vista, CA 90094, United States 🌎

Sponsors

We would like to extend our thanks to the following sponsors for funding Stacks development. If you are interested in becoming a sponsor, please reach out to us.

• JetBrains
• The Solana Foundation

Credits

• Chris Breuer
• All Contributors

And a special thanks to Dan Scanlon for donating the stacks name on npm ✨

License

The MIT License (MIT). Please see LICENSE for more information.

Made with 💙