Prerequisites
- An OwnStak account with a fully set up organization
- A TanStack Start project (version 1.x.x - latest) (React/SolidJs + Vite)
- Node.js installed locally (version 22.x or higher)
Getting Started
1. Create a new project
Create a new TanStack project and choose “Start” in the wizard:
npm create @tanstack/start@latest
Then install dependencies:
cd my-tanstack-app
npm install
For existing projects, ensure you are on a compatible TanStack version and remove any provider-specific code from your vite.config.js.
2. Deploy from your machine
Now, you can deploy the project from your machine by running:
npx ownstak deploy
When you run the deploy command for the first time, the CLI will detect the framework and guide you through login and project configuration. Simply follow the instructions:
The organization and project names are stored in the ownstak.config.js (or .mjs) configuration file for subsequent deployments, so you won't be prompted again.
3. Deploy from CI
For CI and other non-persistent environments, you can skip the interactive deployment by providing the API key and other required options as command arguments.
You can generate a new API key in the OwnStak Console under Settings > API Keys.
npx ownstak deploy --api-key=<your-secret-key> --organization=ownstak --project=my-tanstack-app --environment=default
4. Done!
Your project is now live and deployed to your organization’s cloud infrastructure. You can visit and test it using the environment and deployment links provided in the output:
- Environment link – Always points to the latest deployment in a given project environment
Example:
my-tanstack-app-development.aws-primary.my-org.ownstak.link - Deployment link – Always points to a specific deployment
Example:
my-tanstack-app-development-10.aws-primary.my-org.ownstak.link
Local testing
If your project doesn't behave as expected, you can build and test locally before deploying.
1. Build the project
npx ownstak build
2. Start the project
Start the project and make sure it works locally with OwnStak:
npx ownstak start
When you see the ready message, visit http://localhost:3000 to test your application.
Caching
OwnStak by default sets different cache-control headers for assets, permanent assets, and pre-rendered pages with reasonable time for your CDN for the best performance. It's expected to purge the cache via Webhooks after every deployment.
See CDN Configuration. Default Cache-control headers can be overridden.
Headers
OwnStak integrates with TanStack Start, so you can define custom HTTP response headers using your server entry or define them in your ownstak.config.js file.
OwnStak will apply the headers to corresponding SSR pages, pre-rendered pages, and static assets such as CSS/JS files.
import { Config } from 'ownstak'
export default new Config()
.setResponseHeaders({
'X-Frame-Options': 'DENY',
'X-Content-Type-Options': 'nosniff',
'Referrer-Policy': 'strict-origin-when-cross-origin'
}, '/:path*')
.setResponseHeaders({
'Cache-Control': 'public, max-age=31536000, immutable'
}, '/assets/:path*')
Redirects
Static redirects can be defined using your server entry or by defining them in your ownstak.config.js file.
OwnStak will apply the redirects to corresponding SSR, pre-rendered pages, and static assets.
import { Config } from 'ownstak'
export default new Config()
.setRedirect('/old-page', '/new-page')
.setRedirect('/legacy-blog/:path*', '/blog/:path*', 301)
Supported features
Here’s a list of the features supported by OwnStak for TanStack Start: