├── .gitignore
├── README.md
├── components
├── Header.js
└── Layout.js
├── next.config.js
├── now.json
├── package-lock.json
├── package.json
├── pages
├── About.js
├── Post.js
└── index.js
└── server.js
/.gitignore:
--------------------------------------------------------------------------------
1 | .idea/
2 | *.log
3 | npm-debug.log
4 | yarn-error.log
5 | .DS_Store
6 | build/
7 | node_modules/
8 | dist/
9 | .cache
10 | .next/
11 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Next JS Application
2 |
3 | # Full Series Tutorial
4 | https://codeytek.com/course/next-js-tutorials-for-beginners/
5 |
6 | ## Description :clipboard:
7 | > A Next JS Application Demo.
8 |
9 | ## Installation :wrench:
10 |
11 | 1. Clone this repo by running `git clone https://github.com/imranhsayed/next-js-app`
12 | 2. `cd next-js-app`
13 | 3. `npm install`
14 | 4. `npm run dev`
15 |
16 | ## Useful Links: :link:
17 |
18 | 1. [Next JS Docs](https://nextjs.org/learn/basics/getting-started/setup)
19 |
20 | ## Instructions :point_right:
21 |
22 | ## Branches Information :point_right:
23 |
24 | 1. [simple-nextjs-app](https://github.com/imranhsayed/next-js-app/tree/simple-nextjs-app) Simple next js app
25 | 2. [express-with-next)](https://github.com/imranhsayed/next-js-app/tree/express-with-next)) Simple next js app with custom express server
26 | 3. [express-with-next-ssr)](https://github.com/imranhsayed/next-js-app/tree/express-with-next-ssr)) Custom end point by creating express server, and displaying clean URL for single post ( `'/post/slug' instead of '/post?id=22'` )
27 | 3. [shared-component-navigation](https://github.com/imranhsayed/next-js-app/tree/shared-component-navigation) Example to show navigation and Creating Layout Component that can be shared between multiple component.
28 | 4. [dynamic-page-query-string](https://github.com/imranhsayed/next-js-app/tree/dynamic-page-query-string) Example to create dynamic post pages by extracting query string from url using `withRouter`
29 | 5. [route-masking](https://github.com/imranhsayed/next-js-app/tree/route-masking) Example to show a different URL on the browser than the actual URL that your app sees by adding "as" props to the link.
30 |
31 | ## [Custom Express Configuration with next js](https://github.com/imranhsayed/next-js-app/tree/express-with-next)
32 |
33 | ```ruby
34 | const express = require( 'express' );
35 | const next = require( 'next' );
36 |
37 | const port = 3000;
38 | const dev = process.env.NODE_ENV !== 'production';
39 | const app = next( { dev } );
40 | const handle = app.getRequestHandler();
41 |
42 | /**
43 | * app (next js ) will prepare our server with express, and then,
44 | * wrap express application inside next
45 | *
46 | */
47 | app.prepare()
48 | .then( () => {
49 | const server = express();
50 |
51 | /**
52 | * This will override the default '/about' next js route and when user goes to '/about'
53 | * it will serve index.js because route '/' which we are rendering in app.render() belongs to index.js
54 | */
55 | server.get( '/about', ( req, res ) => {
56 | return app.render( req, res, '/' );
57 | } );
58 |
59 | /**
60 | * Wrapping express app inside next will allow us to create routes by using
61 | * express js function inside of the next js build
62 | *
63 | * '*' means all routes which are not explicit , use this route for them.
64 | */
65 | server.get( '*', ( req, res ) => {
66 | return handle( req, res );
67 | } );
68 |
69 | server.listen( port, ( err ) => {
70 | if ( err ) {
71 | throw err;
72 | }
73 | console.warn( `Ready on http://localhost:${port}` );
74 | } );
75 | } );
76 | ```
77 |
78 | ## Common Commands :computer:
79 |
80 | 1. `dev` Starts local development server at [http://localhost:3000](http://localhost:3000)
81 | 2. `build` Runs build
82 | 3. `start` Runs next js server
83 |
84 | ## Built With :zap:
85 |
86 | 1. Node
87 | 2. Express
88 | 3. React
89 | 4. Next JS
90 | 5. Webpack
91 | 6. Babel
92 |
93 | # Useful Blogs
94 |
95 | 1. [Headless WordPress with Next JS](https://medium.com/kata-engineering/headless-wordpress-next-js-what-we-learned-c10abdf80f6a)
96 |
97 | # Useful Links
98 |
99 | 1. [GraphQL API Plugin for WordPress](https://github.com/wp-graphql/wp-graphql)
100 |
101 | ## Author :bust_in_silhouette:
102 |
103 | * **[Imran Sayed](https://codeytek.com)**
104 |
105 | ## License
106 |
107 | [](http://badges.mit-license.org)
108 |
109 | - **[MIT license](http://opensource.org/licenses/mit-license.php)**
110 |
--------------------------------------------------------------------------------
/components/Header.js:
--------------------------------------------------------------------------------
1 | import Link from 'next/link';
2 |
3 | const linkStyle = {
4 | marginRight: 15
5 | };
6 |
7 | const Header = () => (
8 |
9 |
10 |
Home
11 |
12 |
13 |
About
14 |
15 |
16 |
11 |
12 | {props.children}
13 |
14 | );
15 |
16 | export default Layout
17 |
--------------------------------------------------------------------------------
/next.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | target: 'serverless'
3 | }
4 |
--------------------------------------------------------------------------------
/now.json:
--------------------------------------------------------------------------------
1 | {
2 | "version": 2,
3 | "builds": [{ "src": "package.json", "use": "@now/next" }]
4 | }
5 |
--------------------------------------------------------------------------------
/package-lock.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "next-js-app",
3 | "version": "1.0.0",
4 | "lockfileVersion": 1,
5 | "requires": true,
6 | "dependencies": {
7 | "@next/env": {
8 | "version": "12.1.0",
9 | "resolved": "https://registry.npmjs.org/@next/env/-/env-12.1.0.tgz",
10 | "integrity": "sha512-nrIgY6t17FQ9xxwH3jj0a6EOiQ/WDHUos35Hghtr+SWN/ntHIQ7UpuvSi0vaLzZVHQWaDupKI+liO5vANcDeTQ==",
11 | "dev": true
12 | },
13 | "@next/swc-android-arm64": {
14 | "version": "12.1.0",
15 | "resolved": "https://registry.npmjs.org/@next/swc-android-arm64/-/swc-android-arm64-12.1.0.tgz",
16 | "integrity": "sha512-/280MLdZe0W03stA69iL+v6I+J1ascrQ6FrXBlXGCsGzrfMaGr7fskMa0T5AhQIVQD4nA/46QQWxG//DYuFBcA==",
17 | "dev": true,
18 | "optional": true
19 | },
20 | "@next/swc-darwin-arm64": {
21 | "version": "12.1.0",
22 | "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-12.1.0.tgz",
23 | "integrity": "sha512-R8vcXE2/iONJ1Unf5Ptqjk6LRW3bggH+8drNkkzH4FLEQkHtELhvcmJwkXcuipyQCsIakldAXhRbZmm3YN1vXg==",
24 | "dev": true,
25 | "optional": true
26 | },
27 | "@next/swc-darwin-x64": {
28 | "version": "12.1.0",
29 | "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-12.1.0.tgz",
30 | "integrity": "sha512-ieAz0/J0PhmbZBB8+EA/JGdhRHBogF8BWaeqR7hwveb6SYEIJaDNQy0I+ZN8gF8hLj63bEDxJAs/cEhdnTq+ug==",
31 | "dev": true,
32 | "optional": true
33 | },
34 | "@next/swc-linux-arm-gnueabihf": {
35 | "version": "12.1.0",
36 | "resolved": "https://registry.npmjs.org/@next/swc-linux-arm-gnueabihf/-/swc-linux-arm-gnueabihf-12.1.0.tgz",
37 | "integrity": "sha512-njUd9hpl6o6A5d08dC0cKAgXKCzm5fFtgGe6i0eko8IAdtAPbtHxtpre3VeSxdZvuGFh+hb0REySQP9T1ttkog==",
38 | "dev": true,
39 | "optional": true
40 | },
41 | "@next/swc-linux-arm64-gnu": {
42 | "version": "12.1.0",
43 | "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-12.1.0.tgz",
44 | "integrity": "sha512-OqangJLkRxVxMhDtcb7Qn1xjzFA3s50EIxY7mljbSCLybU+sByPaWAHY4px97ieOlr2y4S0xdPKkQ3BCAwyo6Q==",
45 | "dev": true,
46 | "optional": true
47 | },
48 | "@next/swc-linux-arm64-musl": {
49 | "version": "12.1.0",
50 | "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-12.1.0.tgz",
51 | "integrity": "sha512-hB8cLSt4GdmOpcwRe2UzI5UWn6HHO/vLkr5OTuNvCJ5xGDwpPXelVkYW/0+C3g5axbDW2Tym4S+MQCkkH9QfWA==",
52 | "dev": true,
53 | "optional": true
54 | },
55 | "@next/swc-linux-x64-gnu": {
56 | "version": "12.1.0",
57 | "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-12.1.0.tgz",
58 | "integrity": "sha512-OKO4R/digvrVuweSw/uBM4nSdyzsBV5EwkUeeG4KVpkIZEe64ZwRpnFB65bC6hGwxIBnTv5NMSnJ+0K/WmG78A==",
59 | "dev": true,
60 | "optional": true
61 | },
62 | "@next/swc-linux-x64-musl": {
63 | "version": "12.1.0",
64 | "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-12.1.0.tgz",
65 | "integrity": "sha512-JohhgAHZvOD3rQY7tlp7NlmvtvYHBYgY0x5ZCecUT6eCCcl9lv6iV3nfu82ErkxNk1H893fqH0FUpznZ/H3pSw==",
66 | "dev": true,
67 | "optional": true
68 | },
69 | "@next/swc-win32-arm64-msvc": {
70 | "version": "12.1.0",
71 | "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-12.1.0.tgz",
72 | "integrity": "sha512-T/3gIE6QEfKIJ4dmJk75v9hhNiYZhQYAoYm4iVo1TgcsuaKLFa+zMPh4056AHiG6n9tn2UQ1CFE8EoybEsqsSw==",
73 | "dev": true,
74 | "optional": true
75 | },
76 | "@next/swc-win32-ia32-msvc": {
77 | "version": "12.1.0",
78 | "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-12.1.0.tgz",
79 | "integrity": "sha512-iwnKgHJdqhIW19H9PRPM9j55V6RdcOo6rX+5imx832BCWzkDbyomWnlzBfr6ByUYfhohb8QuH4hSGEikpPqI0Q==",
80 | "dev": true,
81 | "optional": true
82 | },
83 | "@next/swc-win32-x64-msvc": {
84 | "version": "12.1.0",
85 | "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-12.1.0.tgz",
86 | "integrity": "sha512-aBvcbMwuanDH4EMrL2TthNJy+4nP59Bimn8egqv6GHMVj0a44cU6Au4PjOhLNqEh9l+IpRGBqMTzec94UdC5xg==",
87 | "dev": true,
88 | "optional": true
89 | },
90 | "accepts": {
91 | "version": "1.3.7",
92 | "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.7.tgz",
93 | "integrity": "sha512-Il80Qs2WjYlJIBNzNkK6KYqlVMTbZLXgHx2oT0pU/fjRHyEp+PEfEPY0R3WCwAGVOtauxh1hOxNgIf5bv7dQpA==",
94 | "requires": {
95 | "mime-types": "~2.1.24",
96 | "negotiator": "0.6.2"
97 | }
98 | },
99 | "array-flatten": {
100 | "version": "1.1.1",
101 | "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
102 | "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
103 | },
104 | "body-parser": {
105 | "version": "1.19.0",
106 | "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.19.0.tgz",
107 | "integrity": "sha512-dhEPs72UPbDnAQJ9ZKMNTP6ptJaionhP5cBb541nXPlW60Jepo9RV/a4fX4XWW9CuFNK22krhrj1+rgzifNCsw==",
108 | "requires": {
109 | "bytes": "3.1.0",
110 | "content-type": "~1.0.4",
111 | "debug": "2.6.9",
112 | "depd": "~1.1.2",
113 | "http-errors": "1.7.2",
114 | "iconv-lite": "0.4.24",
115 | "on-finished": "~2.3.0",
116 | "qs": "6.7.0",
117 | "raw-body": "2.4.0",
118 | "type-is": "~1.6.17"
119 | },
120 | "dependencies": {
121 | "debug": {
122 | "version": "2.6.9",
123 | "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
124 | "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
125 | "requires": {
126 | "ms": "2.0.0"
127 | }
128 | },
129 | "http-errors": {
130 | "version": "1.7.2",
131 | "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.7.2.tgz",
132 | "integrity": "sha512-uUQBt3H/cSIVfch6i1EuPNy/YsRSOUBXTVfZ+yR7Zjez3qjBz6i9+i4zjNaoqcoFVI4lQJ5plg63TvGfRSDCRg==",
133 | "requires": {
134 | "depd": "~1.1.2",
135 | "inherits": "2.0.3",
136 | "setprototypeof": "1.1.1",
137 | "statuses": ">= 1.5.0 < 2",
138 | "toidentifier": "1.0.0"
139 | }
140 | },
141 | "ms": {
142 | "version": "2.0.0",
143 | "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
144 | "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
145 | },
146 | "setprototypeof": {
147 | "version": "1.1.1",
148 | "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.1.tgz",
149 | "integrity": "sha512-JvdAWfbXeIGaZ9cILp38HntZSFSo3mWg6xGcJJsd+d4aRMOqauag1C63dJfDw7OaMYwEbHMOxEZ1lqVRYP2OAw=="
150 | },
151 | "statuses": {
152 | "version": "1.5.0",
153 | "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
154 | "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow="
155 | }
156 | }
157 | },
158 | "bytes": {
159 | "version": "3.1.0",
160 | "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.0.tgz",
161 | "integrity": "sha512-zauLjrfCG+xvoyaqLoV8bLVXXNGC4JqlxFCutSDWA6fJrTo2ZuvLYTqZ7aHBLZSMOopbzwv8f+wZcVzfVTI2Dg=="
162 | },
163 | "caniuse-lite": {
164 | "version": "1.0.30001312",
165 | "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001312.tgz",
166 | "integrity": "sha512-Wiz1Psk2MEK0pX3rUzWaunLTZzqS2JYZFzNKqAiJGiuxIjRPLgV6+VDPOg6lQOUxmDwhTlh198JsTTi8Hzw6aQ==",
167 | "dev": true
168 | },
169 | "content-disposition": {
170 | "version": "0.5.3",
171 | "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.3.tgz",
172 | "integrity": "sha512-ExO0774ikEObIAEV9kDo50o+79VCUdEB6n6lzKgGwupcVeRlhrj3qGAfwq8G6uBJjkqLrhT0qEYFcWng8z1z0g==",
173 | "requires": {
174 | "safe-buffer": "5.1.2"
175 | }
176 | },
177 | "content-type": {
178 | "version": "1.0.4",
179 | "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.4.tgz",
180 | "integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA=="
181 | },
182 | "cookie": {
183 | "version": "0.4.0",
184 | "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.4.0.tgz",
185 | "integrity": "sha512-+Hp8fLp57wnUSt0tY0tHEXh4voZRDnoIrZPqlo3DPiI4y9lwg/jqx+1Om94/W6ZaPDOUbnjOt/99w66zk+l1Xg=="
186 | },
187 | "cookie-signature": {
188 | "version": "1.0.6",
189 | "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
190 | "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
191 | },
192 | "depd": {
193 | "version": "1.1.2",
194 | "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz",
195 | "integrity": "sha1-m81S4UwJd2PnSbJ0xDRu0uVgtak="
196 | },
197 | "destroy": {
198 | "version": "1.0.4",
199 | "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
200 | "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
201 | },
202 | "ee-first": {
203 | "version": "1.1.1",
204 | "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
205 | "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
206 | },
207 | "encodeurl": {
208 | "version": "1.0.2",
209 | "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
210 | "integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k="
211 | },
212 | "escape-html": {
213 | "version": "1.0.3",
214 | "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
215 | "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
216 | },
217 | "etag": {
218 | "version": "1.8.1",
219 | "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
220 | "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
221 | },
222 | "express": {
223 | "version": "4.17.1",
224 | "resolved": "https://registry.npmjs.org/express/-/express-4.17.1.tgz",
225 | "integrity": "sha512-mHJ9O79RqluphRrcw2X/GTh3k9tVv8YcoyY4Kkh4WDMUYKRZUq0h1o0w2rrrxBqM7VoeUVqgb27xlEMXTnYt4g==",
226 | "requires": {
227 | "accepts": "~1.3.7",
228 | "array-flatten": "1.1.1",
229 | "body-parser": "1.19.0",
230 | "content-disposition": "0.5.3",
231 | "content-type": "~1.0.4",
232 | "cookie": "0.4.0",
233 | "cookie-signature": "1.0.6",
234 | "debug": "2.6.9",
235 | "depd": "~1.1.2",
236 | "encodeurl": "~1.0.2",
237 | "escape-html": "~1.0.3",
238 | "etag": "~1.8.1",
239 | "finalhandler": "~1.1.2",
240 | "fresh": "0.5.2",
241 | "merge-descriptors": "1.0.1",
242 | "methods": "~1.1.2",
243 | "on-finished": "~2.3.0",
244 | "parseurl": "~1.3.3",
245 | "path-to-regexp": "0.1.7",
246 | "proxy-addr": "~2.0.5",
247 | "qs": "6.7.0",
248 | "range-parser": "~1.2.1",
249 | "safe-buffer": "5.1.2",
250 | "send": "0.17.1",
251 | "serve-static": "1.14.1",
252 | "setprototypeof": "1.1.1",
253 | "statuses": "~1.5.0",
254 | "type-is": "~1.6.18",
255 | "utils-merge": "1.0.1",
256 | "vary": "~1.1.2"
257 | },
258 | "dependencies": {
259 | "debug": {
260 | "version": "2.6.9",
261 | "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
262 | "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
263 | "requires": {
264 | "ms": "2.0.0"
265 | }
266 | },
267 | "http-errors": {
268 | "version": "1.7.2",
269 | "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.7.2.tgz",
270 | "integrity": "sha512-uUQBt3H/cSIVfch6i1EuPNy/YsRSOUBXTVfZ+yR7Zjez3qjBz6i9+i4zjNaoqcoFVI4lQJ5plg63TvGfRSDCRg==",
271 | "requires": {
272 | "depd": "~1.1.2",
273 | "inherits": "2.0.3",
274 | "setprototypeof": "1.1.1",
275 | "statuses": ">= 1.5.0 < 2",
276 | "toidentifier": "1.0.0"
277 | }
278 | },
279 | "mime": {
280 | "version": "1.6.0",
281 | "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
282 | "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg=="
283 | },
284 | "ms": {
285 | "version": "2.0.0",
286 | "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
287 | "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
288 | },
289 | "path-to-regexp": {
290 | "version": "0.1.7",
291 | "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
292 | "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
293 | },
294 | "send": {
295 | "version": "0.17.1",
296 | "resolved": "https://registry.npmjs.org/send/-/send-0.17.1.tgz",
297 | "integrity": "sha512-BsVKsiGcQMFwT8UxypobUKyv7irCNRHk1T0G680vk88yf6LBByGcZJOTJCrTP2xVN6yI+XjPJcNuE3V4fT9sAg==",
298 | "requires": {
299 | "debug": "2.6.9",
300 | "depd": "~1.1.2",
301 | "destroy": "~1.0.4",
302 | "encodeurl": "~1.0.2",
303 | "escape-html": "~1.0.3",
304 | "etag": "~1.8.1",
305 | "fresh": "0.5.2",
306 | "http-errors": "~1.7.2",
307 | "mime": "1.6.0",
308 | "ms": "2.1.1",
309 | "on-finished": "~2.3.0",
310 | "range-parser": "~1.2.1",
311 | "statuses": "~1.5.0"
312 | },
313 | "dependencies": {
314 | "ms": {
315 | "version": "2.1.1",
316 | "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz",
317 | "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg=="
318 | }
319 | }
320 | },
321 | "setprototypeof": {
322 | "version": "1.1.1",
323 | "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.1.tgz",
324 | "integrity": "sha512-JvdAWfbXeIGaZ9cILp38HntZSFSo3mWg6xGcJJsd+d4aRMOqauag1C63dJfDw7OaMYwEbHMOxEZ1lqVRYP2OAw=="
325 | },
326 | "statuses": {
327 | "version": "1.5.0",
328 | "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
329 | "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow="
330 | }
331 | }
332 | },
333 | "finalhandler": {
334 | "version": "1.1.2",
335 | "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.2.tgz",
336 | "integrity": "sha512-aAWcW57uxVNrQZqFXjITpW3sIUQmHGG3qSb9mUah9MgMC4NeWhNOlNjXEYq3HjRAvL6arUviZGGJsBg6z0zsWA==",
337 | "requires": {
338 | "debug": "2.6.9",
339 | "encodeurl": "~1.0.2",
340 | "escape-html": "~1.0.3",
341 | "on-finished": "~2.3.0",
342 | "parseurl": "~1.3.3",
343 | "statuses": "~1.5.0",
344 | "unpipe": "~1.0.0"
345 | },
346 | "dependencies": {
347 | "debug": {
348 | "version": "2.6.9",
349 | "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
350 | "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
351 | "requires": {
352 | "ms": "2.0.0"
353 | }
354 | },
355 | "ms": {
356 | "version": "2.0.0",
357 | "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
358 | "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
359 | },
360 | "statuses": {
361 | "version": "1.5.0",
362 | "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
363 | "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow="
364 | }
365 | }
366 | },
367 | "forwarded": {
368 | "version": "0.1.2",
369 | "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
370 | "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ="
371 | },
372 | "fresh": {
373 | "version": "0.5.2",
374 | "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
375 | "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac="
376 | },
377 | "iconv-lite": {
378 | "version": "0.4.24",
379 | "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
380 | "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
381 | "requires": {
382 | "safer-buffer": ">= 2.1.2 < 3"
383 | }
384 | },
385 | "inherits": {
386 | "version": "2.0.3",
387 | "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
388 | "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
389 | },
390 | "ipaddr.js": {
391 | "version": "1.9.0",
392 | "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.0.tgz",
393 | "integrity": "sha512-M4Sjn6N/+O6/IXSJseKqHoFc+5FdGJ22sXqnjTpdZweHK64MzEPAyQZyEU3R/KRv2GLoa7nNtg/C2Ev6m7z+eA=="
394 | },
395 | "isomorphic-unfetch": {
396 | "version": "3.0.0",
397 | "resolved": "https://registry.npmjs.org/isomorphic-unfetch/-/isomorphic-unfetch-3.0.0.tgz",
398 | "integrity": "sha512-V0tmJSYfkKokZ5mgl0cmfQMTb7MLHsBMngTkbLY0eXvKqiVRRoZP04Ly+KhKrJfKtzC9E6Pp15Jo+bwh7Vi2XQ==",
399 | "requires": {
400 | "node-fetch": "^2.2.0",
401 | "unfetch": "^4.0.0"
402 | }
403 | },
404 | "js-tokens": {
405 | "version": "4.0.0",
406 | "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
407 | "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
408 | "dev": true
409 | },
410 | "loose-envify": {
411 | "version": "1.4.0",
412 | "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
413 | "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
414 | "dev": true,
415 | "requires": {
416 | "js-tokens": "^3.0.0 || ^4.0.0"
417 | }
418 | },
419 | "media-typer": {
420 | "version": "0.3.0",
421 | "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
422 | "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g="
423 | },
424 | "merge-descriptors": {
425 | "version": "1.0.1",
426 | "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz",
427 | "integrity": "sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E="
428 | },
429 | "methods": {
430 | "version": "1.1.2",
431 | "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
432 | "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
433 | },
434 | "mime-db": {
435 | "version": "1.40.0",
436 | "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.40.0.tgz",
437 | "integrity": "sha512-jYdeOMPy9vnxEqFRRo6ZvTZ8d9oPb+k18PKoYNYUe2stVEBPPwsln/qWzdbmaIvnhZ9v2P+CuecK+fpUfsV2mA=="
438 | },
439 | "mime-types": {
440 | "version": "2.1.24",
441 | "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.24.tgz",
442 | "integrity": "sha512-WaFHS3MCl5fapm3oLxU4eYDw77IQM2ACcxQ9RIxfaC3ooc6PFuBMGZZsYpvoXS5D5QTWPieo1jjLdAm3TBP3cQ==",
443 | "requires": {
444 | "mime-db": "1.40.0"
445 | }
446 | },
447 | "ms": {
448 | "version": "2.1.1",
449 | "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz",
450 | "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg=="
451 | },
452 | "nanoid": {
453 | "version": "3.3.1",
454 | "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.1.tgz",
455 | "integrity": "sha512-n6Vs/3KGyxPQd6uO0eH4Bv0ojGSUvuLlIHtC3Y0kEO23YRge8H9x1GCzLn28YX0H66pMkxuaeESFq4tKISKwdw==",
456 | "dev": true
457 | },
458 | "negotiator": {
459 | "version": "0.6.2",
460 | "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.2.tgz",
461 | "integrity": "sha512-hZXc7K2e+PgeI1eDBe/10Ard4ekbfrrqG8Ep+8Jmf4JID2bNg7NvCPOZN+kfF574pFQI7mum2AUqDidoKqcTOw=="
462 | },
463 | "next": {
464 | "version": "12.1.0",
465 | "resolved": "https://registry.npmjs.org/next/-/next-12.1.0.tgz",
466 | "integrity": "sha512-s885kWvnIlxsUFHq9UGyIyLiuD0G3BUC/xrH0CEnH5lHEWkwQcHOORgbDF0hbrW9vr/7am4ETfX4A7M6DjrE7Q==",
467 | "dev": true,
468 | "requires": {
469 | "@next/env": "12.1.0",
470 | "@next/swc-android-arm64": "12.1.0",
471 | "@next/swc-darwin-arm64": "12.1.0",
472 | "@next/swc-darwin-x64": "12.1.0",
473 | "@next/swc-linux-arm-gnueabihf": "12.1.0",
474 | "@next/swc-linux-arm64-gnu": "12.1.0",
475 | "@next/swc-linux-arm64-musl": "12.1.0",
476 | "@next/swc-linux-x64-gnu": "12.1.0",
477 | "@next/swc-linux-x64-musl": "12.1.0",
478 | "@next/swc-win32-arm64-msvc": "12.1.0",
479 | "@next/swc-win32-ia32-msvc": "12.1.0",
480 | "@next/swc-win32-x64-msvc": "12.1.0",
481 | "caniuse-lite": "^1.0.30001283",
482 | "postcss": "8.4.5",
483 | "styled-jsx": "5.0.0",
484 | "use-subscription": "1.5.1"
485 | }
486 | },
487 | "node-fetch": {
488 | "version": "2.6.7",
489 | "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.7.tgz",
490 | "integrity": "sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ==",
491 | "requires": {
492 | "whatwg-url": "^5.0.0"
493 | }
494 | },
495 | "object-assign": {
496 | "version": "4.1.1",
497 | "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
498 | "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
499 | "dev": true
500 | },
501 | "on-finished": {
502 | "version": "2.3.0",
503 | "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
504 | "integrity": "sha1-IPEzZIGwg811M3mSoWlxqi2QaUc=",
505 | "requires": {
506 | "ee-first": "1.1.1"
507 | }
508 | },
509 | "parseurl": {
510 | "version": "1.3.3",
511 | "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
512 | "integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ=="
513 | },
514 | "picocolors": {
515 | "version": "1.0.0",
516 | "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
517 | "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==",
518 | "dev": true
519 | },
520 | "postcss": {
521 | "version": "8.4.5",
522 | "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.5.tgz",
523 | "integrity": "sha512-jBDboWM8qpaqwkMwItqTQTiFikhs/67OYVvblFFTM7MrZjt6yMKd6r2kgXizEbTTljacm4NldIlZnhbjr84QYg==",
524 | "dev": true,
525 | "requires": {
526 | "nanoid": "^3.1.30",
527 | "picocolors": "^1.0.0",
528 | "source-map-js": "^1.0.1"
529 | }
530 | },
531 | "prop-types": {
532 | "version": "15.6.2",
533 | "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz",
534 | "integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==",
535 | "dev": true,
536 | "requires": {
537 | "loose-envify": "^1.3.1",
538 | "object-assign": "^4.1.1"
539 | }
540 | },
541 | "proxy-addr": {
542 | "version": "2.0.5",
543 | "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.5.tgz",
544 | "integrity": "sha512-t/7RxHXPH6cJtP0pRG6smSr9QJidhB+3kXu0KgXnbGYMgzEnUxRQ4/LDdfOwZEMyIh3/xHb8PX3t+lfL9z+YVQ==",
545 | "requires": {
546 | "forwarded": "~0.1.2",
547 | "ipaddr.js": "1.9.0"
548 | }
549 | },
550 | "qs": {
551 | "version": "6.7.0",
552 | "resolved": "https://registry.npmjs.org/qs/-/qs-6.7.0.tgz",
553 | "integrity": "sha512-VCdBRNFTX1fyE7Nb6FYoURo/SPe62QCaAyzJvUjwRaIsc+NePBEniHlvxFmmX56+HZphIGtV0XeCirBtpDrTyQ=="
554 | },
555 | "range-parser": {
556 | "version": "1.2.1",
557 | "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
558 | "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg=="
559 | },
560 | "raw-body": {
561 | "version": "2.4.0",
562 | "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.4.0.tgz",
563 | "integrity": "sha512-4Oz8DUIwdvoa5qMJelxipzi/iJIi40O5cGV1wNYp5hvZP8ZN0T+jiNkL0QepXs+EsQ9XJ8ipEDoiH70ySUJP3Q==",
564 | "requires": {
565 | "bytes": "3.1.0",
566 | "http-errors": "1.7.2",
567 | "iconv-lite": "0.4.24",
568 | "unpipe": "1.0.0"
569 | },
570 | "dependencies": {
571 | "http-errors": {
572 | "version": "1.7.2",
573 | "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.7.2.tgz",
574 | "integrity": "sha512-uUQBt3H/cSIVfch6i1EuPNy/YsRSOUBXTVfZ+yR7Zjez3qjBz6i9+i4zjNaoqcoFVI4lQJ5plg63TvGfRSDCRg==",
575 | "requires": {
576 | "depd": "~1.1.2",
577 | "inherits": "2.0.3",
578 | "setprototypeof": "1.1.1",
579 | "statuses": ">= 1.5.0 < 2",
580 | "toidentifier": "1.0.0"
581 | }
582 | },
583 | "setprototypeof": {
584 | "version": "1.1.1",
585 | "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.1.tgz",
586 | "integrity": "sha512-JvdAWfbXeIGaZ9cILp38HntZSFSo3mWg6xGcJJsd+d4aRMOqauag1C63dJfDw7OaMYwEbHMOxEZ1lqVRYP2OAw=="
587 | },
588 | "statuses": {
589 | "version": "1.5.0",
590 | "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
591 | "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow="
592 | }
593 | }
594 | },
595 | "react": {
596 | "version": "16.8.6",
597 | "resolved": "https://registry.npmjs.org/react/-/react-16.8.6.tgz",
598 | "integrity": "sha512-pC0uMkhLaHm11ZSJULfOBqV4tIZkx87ZLvbbQYunNixAAvjnC+snJCg0XQXn9VIsttVsbZP/H/ewzgsd5fxKXw==",
599 | "dev": true,
600 | "requires": {
601 | "loose-envify": "^1.1.0",
602 | "object-assign": "^4.1.1",
603 | "prop-types": "^15.6.2",
604 | "scheduler": "^0.13.6"
605 | }
606 | },
607 | "react-dom": {
608 | "version": "16.8.6",
609 | "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.8.6.tgz",
610 | "integrity": "sha512-1nL7PIq9LTL3fthPqwkvr2zY7phIPjYrT0jp4HjyEQrEROnw4dG41VVwi/wfoCneoleqrNX7iAD+pXebJZwrwA==",
611 | "dev": true,
612 | "requires": {
613 | "loose-envify": "^1.1.0",
614 | "object-assign": "^4.1.1",
615 | "prop-types": "^15.6.2",
616 | "scheduler": "^0.13.6"
617 | }
618 | },
619 | "safe-buffer": {
620 | "version": "5.1.2",
621 | "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
622 | "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
623 | },
624 | "safer-buffer": {
625 | "version": "2.1.2",
626 | "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
627 | "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
628 | },
629 | "scheduler": {
630 | "version": "0.13.6",
631 | "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.13.6.tgz",
632 | "integrity": "sha512-IWnObHt413ucAYKsD9J1QShUKkbKLQQHdxRyw73sw4FN26iWr3DY/H34xGPe4nmL1DwXyWmSWmMrA9TfQbE/XQ==",
633 | "dev": true,
634 | "requires": {
635 | "loose-envify": "^1.1.0",
636 | "object-assign": "^4.1.1"
637 | }
638 | },
639 | "serve-static": {
640 | "version": "1.14.1",
641 | "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.14.1.tgz",
642 | "integrity": "sha512-JMrvUwE54emCYWlTI+hGrGv5I8dEwmco/00EvkzIIsR7MqrHonbD9pO2MOfFnpFntl7ecpZs+3mW+XbQZu9QCg==",
643 | "requires": {
644 | "encodeurl": "~1.0.2",
645 | "escape-html": "~1.0.3",
646 | "parseurl": "~1.3.3",
647 | "send": "0.17.1"
648 | },
649 | "dependencies": {
650 | "debug": {
651 | "version": "2.6.9",
652 | "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
653 | "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
654 | "requires": {
655 | "ms": "2.0.0"
656 | },
657 | "dependencies": {
658 | "ms": {
659 | "version": "2.0.0",
660 | "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
661 | "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
662 | }
663 | }
664 | },
665 | "http-errors": {
666 | "version": "1.7.2",
667 | "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.7.2.tgz",
668 | "integrity": "sha512-uUQBt3H/cSIVfch6i1EuPNy/YsRSOUBXTVfZ+yR7Zjez3qjBz6i9+i4zjNaoqcoFVI4lQJ5plg63TvGfRSDCRg==",
669 | "requires": {
670 | "depd": "~1.1.2",
671 | "inherits": "2.0.3",
672 | "setprototypeof": "1.1.1",
673 | "statuses": ">= 1.5.0 < 2",
674 | "toidentifier": "1.0.0"
675 | }
676 | },
677 | "mime": {
678 | "version": "1.6.0",
679 | "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
680 | "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg=="
681 | },
682 | "send": {
683 | "version": "0.17.1",
684 | "resolved": "https://registry.npmjs.org/send/-/send-0.17.1.tgz",
685 | "integrity": "sha512-BsVKsiGcQMFwT8UxypobUKyv7irCNRHk1T0G680vk88yf6LBByGcZJOTJCrTP2xVN6yI+XjPJcNuE3V4fT9sAg==",
686 | "requires": {
687 | "debug": "2.6.9",
688 | "depd": "~1.1.2",
689 | "destroy": "~1.0.4",
690 | "encodeurl": "~1.0.2",
691 | "escape-html": "~1.0.3",
692 | "etag": "~1.8.1",
693 | "fresh": "0.5.2",
694 | "http-errors": "~1.7.2",
695 | "mime": "1.6.0",
696 | "ms": "2.1.1",
697 | "on-finished": "~2.3.0",
698 | "range-parser": "~1.2.1",
699 | "statuses": "~1.5.0"
700 | }
701 | },
702 | "setprototypeof": {
703 | "version": "1.1.1",
704 | "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.1.tgz",
705 | "integrity": "sha512-JvdAWfbXeIGaZ9cILp38HntZSFSo3mWg6xGcJJsd+d4aRMOqauag1C63dJfDw7OaMYwEbHMOxEZ1lqVRYP2OAw=="
706 | },
707 | "statuses": {
708 | "version": "1.5.0",
709 | "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
710 | "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow="
711 | }
712 | }
713 | },
714 | "source-map-js": {
715 | "version": "1.0.2",
716 | "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
717 | "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
718 | "dev": true
719 | },
720 | "styled-jsx": {
721 | "version": "5.0.0",
722 | "resolved": "https://registry.npmjs.org/styled-jsx/-/styled-jsx-5.0.0.tgz",
723 | "integrity": "sha512-qUqsWoBquEdERe10EW8vLp3jT25s/ssG1/qX5gZ4wu15OZpmSMFI2v+fWlRhLfykA5rFtlJ1ME8A8pm/peV4WA==",
724 | "dev": true
725 | },
726 | "toidentifier": {
727 | "version": "1.0.0",
728 | "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz",
729 | "integrity": "sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw=="
730 | },
731 | "tr46": {
732 | "version": "0.0.3",
733 | "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz",
734 | "integrity": "sha1-gYT9NH2snNwYWZLzpmIuFLnZq2o="
735 | },
736 | "type-is": {
737 | "version": "1.6.18",
738 | "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
739 | "integrity": "sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==",
740 | "requires": {
741 | "media-typer": "0.3.0",
742 | "mime-types": "~2.1.24"
743 | }
744 | },
745 | "unfetch": {
746 | "version": "4.1.0",
747 | "resolved": "https://registry.npmjs.org/unfetch/-/unfetch-4.1.0.tgz",
748 | "integrity": "sha512-crP/n3eAPUJxZXM9T80/yv0YhkTEx2K1D3h7D1AJM6fzsWZrxdyRuLN0JH/dkZh1LNH8LxCnBzoPFCPbb2iGpg=="
749 | },
750 | "unpipe": {
751 | "version": "1.0.0",
752 | "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
753 | "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw="
754 | },
755 | "use-subscription": {
756 | "version": "1.5.1",
757 | "resolved": "https://registry.npmjs.org/use-subscription/-/use-subscription-1.5.1.tgz",
758 | "integrity": "sha512-Xv2a1P/yReAjAbhylMfFplFKj9GssgTwN7RlcTxBujFQcloStWNDQdc4g4NRWH9xS4i/FDk04vQBptAXoF3VcA==",
759 | "dev": true,
760 | "requires": {
761 | "object-assign": "^4.1.1"
762 | }
763 | },
764 | "utils-merge": {
765 | "version": "1.0.1",
766 | "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
767 | "integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM="
768 | },
769 | "vary": {
770 | "version": "1.1.2",
771 | "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
772 | "integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw="
773 | },
774 | "webidl-conversions": {
775 | "version": "3.0.1",
776 | "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
777 | "integrity": "sha1-JFNCdeKnvGvnvIZhHMFq4KVlSHE="
778 | },
779 | "whatwg-url": {
780 | "version": "5.0.0",
781 | "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz",
782 | "integrity": "sha1-lmRU6HZUYuN2RNNib2dCzotwll0=",
783 | "requires": {
784 | "tr46": "~0.0.3",
785 | "webidl-conversions": "^3.0.0"
786 | }
787 | }
788 | }
789 | }
790 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "next-js-app",
3 | "version": "1.0.0",
4 | "description": "",
5 | "main": "index.js",
6 | "scripts": {
7 | "dev": "next",
8 | "build": "next build",
9 | "start": "next start -p $PORT",
10 | "now-build": "next build"
11 | },
12 | "keywords": [],
13 | "author": "",
14 | "license": "ISC",
15 | "devDependencies": {
16 | "next": "^12.1.0",
17 | "react": "^16.8.6",
18 | "react-dom": "^16.8.6"
19 | },
20 | "dependencies": {
21 | "express": "^4.17.1",
22 | "isomorphic-unfetch": "^3.0.0"
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/pages/About.js:
--------------------------------------------------------------------------------
1 | import Layout from "../components/Layout";
2 |
3 | export default function About() {
4 | return (
5 |
6 | This is the about page
7 |
8 | )
9 | };
10 |
--------------------------------------------------------------------------------
/pages/Post.js:
--------------------------------------------------------------------------------
1 | import { withRouter } from 'next/router';
2 | import Layout from '../components/Layout';
3 |
4 | const Content = withRouter( props => (
5 |
6 |
{ props.router.query.title }
7 |
This is the blog post content
8 |
Batman TV Shows
8 |
9 | {props.shows.map(show => (
10 | -
11 |
12 | {show.name}
13 |
14 |
15 | ))}
16 |
17 |
42 |
43 | );
44 |
45 | Index.getInitialProps = async function() {
46 | const res = await fetch('https://api.tvmaze.com/search/shows?q=batman');
47 | const data = await res.json();
48 |
49 | console.log(`Show data fetched. Count: ${data.length}`);
50 |
51 | return {
52 | shows: data.map(entry => entry.show)
53 | }
54 | };
55 |
56 |
57 |
58 | export default Index
59 |
--------------------------------------------------------------------------------
/server.js:
--------------------------------------------------------------------------------
1 | const express = require('express');
2 | const next = require('next');
3 |
4 | const port = parseInt(process.env.PORT, 10) || 3000;
5 | const dev = process.env.NODE_ENV !== 'production';
6 | const app = next({ dev });
7 | const handle = app.getRequestHandler();
8 |
9 | app
10 | .prepare()
11 | .then(() => {
12 | const server = express();
13 |
14 | // Express server handlers
15 | server.get('/p/:id', (req, res) => {
16 | const actualPage = '/post';
17 | const queryParams = { title: req.params.id };
18 | app.render(req, res, actualPage, queryParams);
19 | });
20 |
21 | server.get('/post/:slug', (req, res) => {
22 | const queryParams = { slug: req.params.slug, apiRoute: 'post' };
23 | app.render(req, res, '/post', queryParams);
24 | });
25 |
26 | server.get('/page/:slug', (req, res) => {
27 | const queryParams = { slug: req.params.slug, apiRoute: 'page' };
28 | app.render(req, res, '/post', queryParams);
29 | });
30 |
31 | server.get('/category/:slug', (req, res) => {
32 | const queryParams = { slug: req.params.slug };
33 | app.render(req, res, '/category', queryParams);
34 | });
35 |
36 | // Fallback handler
37 | server.get('*', (req, res) => {
38 | return handle(req, res)
39 | });
40 |
41 | // Listen on the default port (3000)
42 | server.listen(dev, err => {
43 | if (err) throw err;
44 | console.log('> Ready on http://localhost:3000')
45 | })
46 | })
47 | .catch(error => {
48 | console.error(error.stack);
49 | process.exit(1)
50 | });
51 |
--------------------------------------------------------------------------------