This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// server.js | |
const { createServer } = require('http'); | |
const next = require('next'); | |
const { promises, existsSync } = require('fs'); | |
const dev = (process.env.NODE_ENV || '').indexOf('production') === -1; | |
const app = next({ dev }); | |
const handle = app.getRequestHandler(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
"scripts": { | |
"dev": "node server.js", | |
"build": "next build", | |
"start": "NODE_ENV=production node server.js" | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { useRouter } from 'next/router' | |
import Head from 'next/head' | |
export default function Fact({ fact }) { | |
const router = useRouter() | |
return ( | |
<div style={{ textAlign: 'center' }}> | |
<h1>A fact about cat</h1> | |
<br/> | |
<p>{fact}</p> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const Product = (props) => { | |
return <div> | |
{ props.data.map(p => <div key={p.id}>{p.name}</div>) } | |
</div> | |
} | |
export const getServerSideProps = async (context) => { | |
const {name} = context.query | |
//you can fetch data from your api like this | |
// const res = await |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//... | |
<Link href={'/products/potato'}> | |
<button>Potato</button> | |
</Link> | |
//... |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//... | |
<Link href={`/loading/product?name=potato`}> | |
<button>Potato</button> | |
</Link> | |
//... |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//... | |
const {name} = router.query; | |
React.useEffect(() => { | |
router.replace(`/products/${name}`); | |
}) | |
//... |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//... | |
const [steep, setSteep] = useState<number>(0); | |
//... |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//inside the parent of carousel Dialog | |
const [dialogOpen, setDialogOpen] = useState<number>(0); | |
//inside a carousel Dialog | |
const [steep, setSteep] = useState<number>(0); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {useRouter} from "next/router"; | |
//... | |
const router = useRouter(); | |
const {router_steep} = router.query | |
const steep = (isNaN(+router_steep) || +router_steep < 0) ? 0 | |
: +router_steep; |
OlderNewer