Skip to content
SLICES / TECHNICAL FOLIO Nº 001FULL-STACK ASSEMBLIES — OPEN SOURCE
slices.sh
A—01THE FULL-STACK FEATURE LIBRARY

Add features
like you add
components.

One command installs the interface, connects the backend, and provisions the infrastructure.

Auth, uploads, AI chat, and more. A complete starting point, with source code you can make your own.

Explore the featuresRead the drawing
npx add sign-in
For Next.js · Fully customizable · Infrastructure by ExtraOrbital
PLATE 01 / ASSEMBLY DRAWINGSL—001
+
+
+
+
FULL STACK
SL / 001   A slice of the whole stack.
Six layers. One command.
Another slice of fullstack?MOVE TO ROTATE · HOVER A LAYER TO INSPECT
OBJECTA complete feature
LAYERS06
DELIVERYOne command
Every layer connected Headless by design Source you own Built in the open
A—02SECTION VIEW / WHAT’S INCLUDED

A component is the surface.
A slice goes all the way down.

The screen is only one part of a working feature. Slices brings the layers together so you don’t have to wire them from scratch.

USER INTERFACEILLUSTRATIVE CODE / SIGN-IN
  1. 01

    Component

    Start with the ready-made interface. Change its styles and words to fit your product.

    01 / YOUR PAGE
    <SignIn />
  2. 02

    Headless

    Compose the same behavior with your own UI components using headless parts.

    02 / HEADLESS COMPOSITION
    <SignIn.Email render={<YourInput />} />
<SignIn.Submit render={<YourButton />} />
  3. 03

    Hooks

    Focused hooks connect your interface to the services underneath.

    03 / REACT HOOK
    const { signIn, pending } = useSignIn();
await signIn({ email });
  4. 04

    Client SDK

    Call the feature’s backend through its client-side API.

    04 / CLIENT REQUEST
    await authClient.signIn({ email });
  5. 05

    Server SDK

    Server-side logic and provider integrations support the feature.

    05 / SERVER HANDLER
    await authService.sendCode({ email });
  6. 06

    Infrastructure

    ExtraOrbital provisions and connects the database, storage, and other resources the feature needs.

    06 / CONNECTED RESOURCES
    resources: {
  database: "postgres",
  email: "transactional"
}
CONNECTED CLOUD RESOURCESOne feature. Every layer connected.

Simplified examples show each layer’s role. Exact imports, APIs, and configuration depend on the feature.

A—03LIBRARY / READY TO INSTALL

Your next feature.
Already engineered.

Browse the complete library

Ready-made full-stack features for Next.js. Choose what your product needs, run one command, and build on it.

Sign in to Acme
Welcome back. Sign in to continue.
or
or

Install this slice
npx add authentication:app-name=Acme
B—01DESIGN CONSTRAINT / YOUR TIME

Build your idea.
Don’t regenerate
the foundations.

Another login. Another upload API. Another afternoon connecting a database. You’ve done this work before.

01

Spend tokens on what makes you different.

Install the recurring features instead of paying AI to generate, debug, and regenerate them. Give your prompts to your product’s unique logic.

02

Reduce the integration work.

The UI, backend, and resources are designed together. Spend less time on wiring and repeated QA, and more time on the experience you’re building.

03

Start from something you can inspect.

A repeatable install gives you shared code to review. The community can test the same implementation, report issues, and contribute improvements.

B—02TOLERANCE / YOUR DESIGN SYSTEM

Keep the behavior.
Change the expression.

Ship the ready-made component. Adjust its skin and copy. Or compose an entirely different interface with headless parts.

The logic doesn’t dictate the look. Your product does.

Explore the headless library
YOUR-PRODUCT / SIGN-IN.TSXEDITABLE SOURCE
// Same behavior. Your components.

<SignIn.Root>
 <SignIn.Email
 render={<YourInput />}
 />
 <SignIn.Submit
 render={<YourButton />}
 >
 Let’s get you in
 </SignIn.Submit>
</SignIn.Root>
Illustrative composition · No prescribed look or copy
B—03INFRASTRUCTURE / INCLUDED IN THE INSTALL

It comes with
somewhere to run.

Install the feature.
Its infrastructure comes with it.

ExtraOrbital provisions the resources your feature needs at install time, then connects them to your app. From the component to its database, storage, or AI service — one installation.

YOU RUNnpx slices.sh add sign-in sign-up passkeys 2fa user-button --db mongoINSTALL TIME ↓
  1. 01 / SOURCE

    Feature installed

    A complete authentication flow, installed as editable source.

    Sign-in & sign-up screens
    Passkey management
    Two-factor authentication
    User widget
  2. 02 / EXTRAORBITAL

    Resources provisioned

    For this MongoDB-backed authentication example:

    AuthLockerAuthentication credentials
    MongoDBUsers & sessions
  3. 03 / CONNECTED

    Your app is wired

    Connected services. Your design. One working app.

    .envCredentialsSlices featuresUI + behaviorDesign systemYour components & stylesYour app
Source in your app. Resources ready to use.
THE EXTRAORBITAL CATALOG

Real services. Already connected.

NeonPostgres
MongoDBDocuments
UpstashRedis & vectors
Amazon S3Object storage
Cloudflare R2Object storage
Backblaze B2Object storage
OpenAIAI models
AnthropicAI models
OpenRouterModel gateway
DeepgramSpeech to text
GladiaTranscription
AuthLockerAuthentication
RealtimeLive connections
GitPrivate remotes
StripeTest payments

Resources depend on the feature and configuration you choose. OpenAI and Anthropic models are accessed through the managed gateway. Stripe resources are for test payments.

Explore ExtraOrbital
C—01LICENSE TO BUILD / OPEN SOURCE

Open to inspection.
Open to improvement.

Slices is a 100% open-source project by the ExtraOrbital team. Read the implementation, contribute a fix, or build a feature the next team can use.

Explore the source in the playground
What actually gets installed?

A full-stack feature: its component, headless parts, hooks, client and server SDKs, and the integration with its required resources.

Can I use my own design system?

Yes. Use skins and copy to adapt the ready-made interface, or compose headless parts with your own UI components.

How does infrastructure work?

ExtraOrbital provisions and connects the cloud resources required by the feature, such as a database or object storage.

Where does AI fit in?

Use AI for the product-specific work. Install the shared features as a repeatable starting point instead of generating the same foundations again.

+
C—02NEXT STEP / YOUR PRODUCT

A small command.
A whole new possibility.

Full-stack features. Source you own. Your idea, next.

+