-
Notifications
You must be signed in to change notification settings - Fork 0
/
ssg.js
53 lines (48 loc) · 1.32 KB
/
ssg.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
import Car from "../components/Car";
import fetchCars from "./api/fakeCars";
const SSGPage = ({ data }) => (
<>
<div className="type">
<h3 className="title">Static-Site Generation</h3>
<h4 className="description">
All data is being fetched a single time on the server and displayed to
all clients
</h4>
<h4 className="description">
(Notice the date when data was generated never changes)
</h4>
<a
className="link"
href="https://github.com/Josh-McFarlin/nextjs-rendering/blob/main/src/pages/ssg.js"
>
View the source here
</a>
</div>
<br />
<div className="type">
<p className="title">
Data Generated: {new Date(data.date).toLocaleString()}
</p>
{data.cars.map((car) => (
<Car key={car.vin} {...car} />
))}
</div>
</>
);
export async function getStaticProps(context) {
const data = await new Promise((resolve) =>
fetchCars(null, { json: (input) => resolve(input) })
);
/*
* When using getStaticProps, local API routes cannot be used
* because the server is not running during static generation.
* We can get around this by calling the API handler directly
* with mocked server routing.
*/
return {
props: {
data,
},
};
}
export default SSGPage;