花びら React, simplified
React without the
overengineering ⚡️
No server component BS, no infinite boilerplate, just React, Vite and all the tools you love.
import { useStore } from '@hanabira/store';
// likes starts at 0 — set once in createStore()
const LikeButton = () => {
const [likes, setLikes] = useStore('likes');
const addLike = () => setLikes((prevLikes) => prevLikes + 1);
return (
<button onClick={addLike}>
❤️ {likes}
</button>
);
};Hana makes state global by default
This button and the navbar badge are two separate components reading the same store. Try it.
Two components, one useStore('likes') — no context, no
providers, no prop drilling. Go on, click it.
機能 What's in the box
Instead of server components, we give you...
Hana gives you strong foundations without the overhead
-
Simple State Management
Hana comes with a high performance, easy-to-use state solution that makes state management a breeze. No boilerplate, no complexity, just simple and effective state management ✈️
-
Powerful Routing
Hana includes a powerful router that automatically maps your file-system into routes and includes advanced features like loading pages and route based error pages ❤️
- Powered by tools you love
Hana uses powerful tools like Vite that make it simple and easy to use and customize. Hana is the ultimate Vite + React, all tools included setup to build your next big idea on.
- Superpowers included
Hana includes a bunch of utilities like route-based error pages and loading pages, easy peasy token and cookie-based authentication and a lot more to make your life easier.
道 Routes from files
Your file system is the router.
Drop a file in pages/ and it's a route. Click a file to
see where it takes you — dynamic params included.
pages/
🌸 Welcome home
pages/index.jsx renders at /. No config, no route table.
About us
pages/about.jsx becomes /about. That's the whole story.
Flower #42
Brackets are dynamic params — useParams() gives you { id: '42' }.
404, gracefully
_404.jsx catches anything that doesn't match. Loading pages work the same way.
仲間 Backed by the best
Used & sponsored by the very best.
声 Community voices
Feedback From Our Community
-
Building with Hana has been the most straightforward approach to getting an app production ready”
Desmond Sofua
Founder, MailPigeon
-
Top notch developer experience even for newbies to frontend”
Sebastian Livingstone
UI/UX Designer
-
Integration with backend systems, especially with built-in support for leaf PHP really has the full stack experience”
Andy Apenteng
Fullstack Developer
花 Grow with us
Connect with our community of devs.
