This is a Next.js project bootstrapped with create-next-app.
It contains different useful utilities I developed for myself while working on different NextJS projects:
Problem: I need an application level cache with auto refresh. Built-in NextJS caching is request or page level.
Existing solutions: In 15 min didn't find anything nice and simple.
My Solution: "Server Memory" with expiry and auto-refresh. Does it in app RAM by default, can easily be extended to use file system, NoSQL DB or anything else you like as a memory provider ;)
// remember() gets an async parameterless function as incoming param
const latestDate: Date = await remember(getLatestDate)
// here you specify the hash name you can use later to invalidate it
.as("LATEST_DATE")
// for(...) gets an instance of MemoryDuration. There are helpers for most common time periods (e.g. minutes(), hours(), days())
// and you can stack them as you need (e.g. days(5).and(hours(4)).and(minutes(5)))
.for(seconds(5).and(milliseconds(50)))Problem: I need a simple global and persisted state management functionality and don't want to go through complex redux configuration.
Existing solutions: Redux is too complicated, others... I don't know any other options TBH...
My Solution: "Storage State" - as simple as React useState hook. Gracefully shares the provided state among all components. Uses LocalStorage by default, can easily be extended to use other memory provider ;)
// you don't even need this comment to understand how to use it, do you?
const {items, addItem, removeItem} = useStorageState<Record>("RECORDS")First, run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun devOpen http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.
This project uses next/font to automatically optimize and load Inter, a custom Google Font.