Getting started with Vike

Welcome to Vike 🔨

This guide will walk your through your first steps using Vike.

If you feel confident, you can skip this guide and directly go to:

Guides > Routing

Guides > Data Fetching

Guides > Pre-rendering (SSG)

Guides > Common Issues

Scaffold your first Vike app

Use Bati to scaffold a new Vike app.

You can skip exploring Bati's UI for now and directly run the following command instead:

npmpnpmyarnbun

npm create @batijs/app --react
# Or:
npm create @batijs/app --vue
# Or:
npm create @batijs/app --solid

This scaffolds a Vike app that uses vike-react/vike-vue/vike-solid which are the official React, Vue, and Solid integrations maintained by the Vike team.

While we recommend using vike-react/vike-vue/vike-solid you can also manually integrate React/Vue/Solid yourself.

Then:

# Install dependencies:
pnpm install
# Start your app:
pnpm run dev

You can now go to localhost:3000 (or localhost:3001 if localhost:3000 is busy).

You created your first Vike app 🎉

Your app is:

A rich interactive client-side app.
- TODO: add screenshot of interactive counter.
Server-side rendered (SSR) for optimized SEO (the page's content is rendered to HTML).
- TODO: add screenshot of HTML

Routing

TODO

Data

TODO

Data Fetching
Data Mutation

Pre-rendering

TODO