Skip to main content
Prerequisites:
  • Node.js version 18 or higher
  • Anywhere Vite can run
Hana is built by design to be simple to integrate into any project. At it’s core, Hana is just a simple Vite and React setup, and we’ve got a superfast way to get you set up using your favourite package manager.
1

Run the setup tool

npm create hana-app@latest # for npm users
yarn create hana-app@latest # for yarn users
pnpm create hana-app@latest # for pnpm users
This will walk you through a series of prompts to help set up your project
2

Preview locally

Navigate to the generated project, and start the vite server:
npm run dev
A local preview of your documentation will be available at http://localhost:3000.

​
Install in existing Vite app

If you already have a React app running through Vite, Hana’s modular approach allows you to pick any piece, and install it into your app for a gradual adoption experience.
1

Find the module to install

pnpm install @hanabira/<module>
Every Hana module can be installed as a standalone package, so just head over to the documentation for the functionality you need and run the install script
2

Follow the install guide

Most Hana modules can be used right on install, but if you need to do any config, you can follow the config guide tied to the module you want to use. For example, we can set default values and save our global state to sessionStorage
import { createStore, PersistedState } from '@hanabira/store';

createStore({
    state: {
		updated: false
	},
    plugins: [
        new PersistedState({
            storage: window.sessionStorage,
            exclude: ['rates'],
        }),
    ],
});
Every module will include its own config/setup guide

​
Next steps

Now that you have your application running, explore these key features:

Hana Store

Set up a global store in your application for easy access to data from any component

File Router

Take advantage of file-based routing powered by React Router with no setup

Hana Auth

Let Hana take care of the annoying parts of authentication like middleware & config

Everyday Utils

Install Hana Utils for access to everyday features like caching & data fetching
Need help? Join our community to receive help from existing users