Wiki Snippets

‘use client’ import { createContext, useContext, useState } from ‘react’;   export const MyContext = createContext();   export function MyProvider({children}) { const [mymessage, setMymessage] = useState("");   return ( <MyContext.Provider value={{ mymessage, setMymessage }}> {children} </MyContext.Provider> ) }   export function useMy() { const context = useContext(MyContext) if (!context) { throw new Error(’useTheme must be […]

const exec = require(’child_process’).exec var yourExecCmd = ‘ls -ltr’   // Function to exec shell cmd with callback function execWithCallback() { this.execCommand = function(cmd, callback) { exec(cmd, (error, stdout, stderr) =&gt; { if (error) { console.error(`exec error: ${error}`) return } console.log(’stdout:’, stdout) console.log(’stderr:’, stderr) callback(stdout) }) } }   var execWithCallback = new execWithCallback() execWithCallback.execCommand(yourExecCmd, […]

Regular import When using a regular component import, Next.js bundles the component’s code together with the rest of the components for a given route. This usually means you end up with a big chunk containing all the components code for each route. next/dynamic with ssr: true When using next/dynamic with ssr: true, Next.js splits the component’s code into a separate […]

Next.Js prior version 13 ( pages/ folder ) Next.Js version 13.4 ( app/ folder ) getStaticProps with revalidate fetch(URL, { next: { revalidate: 10 } }) – use this one getStaticProps fetch(URL, { cache: ‘no-store’ }) getServerSideProps fetch(URL, { cache: ‘force-cache’ }) getStaticPaths() generateStaticParams()