fast way to store stuff locally without any db in nextjs
#Localstorage
pallid remnant
dim thicketBOT
Hi @pallid remnant. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
Next.js is a server-side rendering framework, and localStorage is a browser API. This means you can't directly use localStorage in your Next.js code that runs on the server. You can only use it from client-side code.
However, if you want to store data on the client side without a database, you can use localStorage in a React component that runs in the browser. Here's a simple example:
import { useEffect, useState } from 'react';
function Component() {
const [data, setData] = useState(null);
// Load data from localStorage when component mounts
useEffect(() => {
const storedData = localStorage.getItem('myData');
if (storedData) {
setData(JSON.parse(storedData));
}
}, []);
// Save data to localStorage whenever it changes
useEffect(() => {
localStorage.setItem('myData', JSON.stringify(data));
}, [data]);
// Rest of your component...
}
In this example, myData is the key in localStorage where your data is stored. You can replace 'myData' with any string that suits your application.
Remember that localStorage is limited (usually 5MB), synchronous, and only available in the browser. It's not suitable for storing large amounts of data or sensitive user information.