stayte v0.1.2
Read the docs here
Introduction
Stayte is a library that helps you to create persistent state in your application by using every possible peristent storage (cookies, query, local storage or session storage) in natural way.
tired to re-invent the wheel at every new project, Stayte is here to help you to save time and effort.
It's inspired by the concept of signal and it's a great fit for React applications, but it can be used in any JavaScript application.
Stayte could also be used in the server side by applying a simple patch (only next.js is supported for now).
Features
- ๐ Signal-like
- ๐พ Persistent state
- ๐ Type-Safe
- ๐ก SSR Friendly
- ๐งช Fully tested
- ๐ฆ Zod validation
Inspiration
The name stayte is the concatenation of the words "stay" and "state".
Stayte is inspired by multiple libraries, here is a list of them:
Concept
What is a "persistent state" ?
A persistent state is a state that is stored in a place that is not destroyed when the application is closed, like a page reload or a tab close.
There is many different area that is used to store a peristent state
- Local storage (client)
- Session storage (client)
- Cookies (SSR)
- Query string (SSR)
In many project, as a developer, you will need to interact with a peristent state by using the native browser API or by using a library
Problem, there is no library that regroup all peristent state in one place, with a unified API.
Stayte is here to help you to save time and effort.
What is a "gluon" ?
A gluon is the smallest unit of stayte, it's a class used to interact with every peristent state.
He's able to subscribe to changes, set a value and get the value.
It's look like a signal from preact
Also a gluon can be composed of other gluons and make a chain of reaction.
:::info The name "gluon" is inspired by the physical gluon, it's a quantum particle that is responsible of the link between the quarks. :::
Basic usage
Declare a gluon
The first way to use staye is to use it in vanilla javascript code.
You declare a gluon by calling the gluon
funcition and passing the name of the gluon and
the source where the gluon will be persisted or not (memory source)
import { gluon } from "stayte";
const nameGluon = gluon('name', {
from: <source>
})
allowed source are:
query
: The query string of the urlcookies
: The cookies of the browserlocalStorage
: The local storage of the browsersessionStorage
: The session storage of the browsermemory
: The memory of the browser
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago