Skip to content

Commit f76639c

Browse files
hasparushasparus
authored
Merge pull request #39 from hasparus/new-landing--what-is-graphql
Add the wires / API gateway section
2 parents b3fe6f8 + 9855c27 commit f76639c

File tree

613 files changed

+1446
-355
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

613 files changed

+1446
-355
lines changed

‎.vscode/settings.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,5 +9,8 @@
99
"[typescript]": {
1010
"editor.defaultFormatter": "esbenp.prettier-vscode"
1111
},
12-
"tailwindCSS.classFunctions": ["clsx"]
12+
"tailwindCSS.classFunctions": ["clsx"],
13+
"editor.quickSuggestions": {
14+
"strings": "on"
15+
}
1316
}

‎next.config.js‎

Lines changed: 138 additions & 118 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
import nextra from "nextra"
44
import path from "node:path"
55
import withLess from "next-with-less"
6+
import nextBundleAnalyzer from "@next/bundle-analyzer"
67
import fs from "fs"
78

89
import { remarkGraphiQLComment } from "./src/remark-graphiql-comment.js"
@@ -29,130 +30,149 @@ const ALLOWED_SVG_REGEX = new RegExp(`${sep}icons${sep}.+\\.svg$`)
2930
/**
3031
* @type {import('next').NextConfig}
3132
*/
32-
export default withLess(
33-
withNextra({
34-
// reactStrictMode: true, provoke duplicated codemirror editors
35-
webpack(config) {
36-
// #region MDX
37-
const mdxRule = config.module.rules.find(rule =>
38-
rule.test?.test?.(".mdx"),
39-
)
40-
if (mdxRule) {
41-
mdxRule.resourceQuery = {
42-
not: /raw/,
43-
}
33+
const config = {
34+
// reactStrictMode: true, provoke duplicated codemirror editors
35+
webpack(config) {
36+
// #region MDX
37+
const mdxRule = config.module.rules.find(rule => rule.test?.test?.(".mdx"))
38+
if (mdxRule) {
39+
mdxRule.resourceQuery = {
40+
not: /raw/,
4441
}
45-
// Instead of transforming MDX, with ?source we can get
46-
// the raw content to process in a Server Component.
47-
config.module.rules.push({
48-
test: /\.mdx$/i,
49-
resourceQuery: /raw/,
50-
type: "asset/source",
51-
})
52-
// #endregion MDX
42+
}
43+
// Instead of transforming MDX, with ?source we can get
44+
// the raw content to process in a Server Component.
45+
config.module.rules.push({
46+
test: /\.mdx$/i,
47+
resourceQuery: /raw/,
48+
type: "asset/source",
49+
})
50+
// #endregion MDX
5351

54-
// #region SVGs
55-
const fileLoaderRule = config.module.rules.find(rule =>
56-
rule.test?.test?.(".svg"),
57-
)
52+
// #region SVGs
53+
const fileLoaderRule = config.module.rules.find(rule =>
54+
rule.test?.test?.(".svg"),
55+
)
5856

59-
fileLoaderRule.exclude = /\.svg$/i
57+
fileLoaderRule.exclude = /\.svg$/i
6058

61-
config.module.rules.push(
62-
// All .svg from /icons/ and with ?svgr are going to be processed by @svgr/webpack
63-
{
64-
test: ALLOWED_SVG_REGEX,
65-
use: ["@svgr/webpack"],
66-
},
67-
{
68-
test: /\.svg$/i,
69-
exclude: ALLOWED_SVG_REGEX,
70-
resourceQuery: /svgr/,
71-
use: [
72-
{
73-
loader: "@svgr/webpack",
74-
options: {
75-
dimensions: false, // **adds** viewBox.
59+
config.module.rules.push(
60+
// All .svg from /icons/ and with ?svgr are going to be processed by @svgr/webpack
61+
{
62+
test: ALLOWED_SVG_REGEX,
63+
use: ["@svgr/webpack"],
64+
},
65+
{
66+
test: /\.svg$/i,
67+
exclude: ALLOWED_SVG_REGEX,
68+
resourceQuery: /svgr/,
69+
use: [
70+
{
71+
loader: "@svgr/webpack",
72+
options: {
73+
typescript: true,
74+
svgoConfig: {
75+
plugins: [
76+
{
77+
name: "preset-default",
78+
params: {
79+
overrides: {
80+
minifyStyles: false,
81+
removeViewBox: false,
82+
removeTitle: false,
83+
},
84+
},
85+
},
86+
"removeXMLNS",
87+
"removeXlink",
88+
"prefixIds",
89+
],
7690
},
7791
},
78-
],
79-
},
80-
// Otherwise, we use the default file loader
81-
{
82-
...fileLoaderRule,
83-
test: /\.svg$/i,
84-
exclude: ALLOWED_SVG_REGEX,
85-
resourceQuery: {
86-
not: [...fileLoaderRule.resourceQuery.not, /svgr/],
8792
},
93+
],
94+
},
95+
// Otherwise, we use the default file loader
96+
{
97+
...fileLoaderRule,
98+
test: /\.svg$/i,
99+
exclude: ALLOWED_SVG_REGEX,
100+
resourceQuery: {
101+
not: [...fileLoaderRule.resourceQuery.not, /svgr/],
88102
},
89-
)
90-
// #endregion SVGs
103+
},
104+
)
105+
// #endregion SVGs
91106

92-
return config
93-
},
94-
output: "export",
95-
images: {
96-
loader: "custom",
97-
imageSizes: [16, 32, 48, 64, 96, 128, 256, 384],
98-
deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
99-
},
100-
transpilePackages: ["next-image-export-optimizer"],
101-
env: {
102-
nextImageExportOptimizer_imageFolderPath: "public/images",
103-
nextImageExportOptimizer_exportFolderPath: "out",
104-
nextImageExportOptimizer_quality: "75",
105-
nextImageExportOptimizer_storePicturesInWEBP: "true",
106-
nextImageExportOptimizer_exportFolderName: "nextImageExportOptimizer",
107-
// If you do not want to use blurry placeholder images, then you can set
108-
// nextImageExportOptimizer_generateAndUseBlurImages to false and pass
109-
// `placeholder="empty"` to all <ExportedImage> components.
110-
nextImageExportOptimizer_generateAndUseBlurImages: "true",
111-
// If you want to cache the remote images, you can set the time to live of the cache in seconds.
112-
// The default value is 0 seconds.
113-
nextImageExportOptimizer_remoteImageCacheTTL: "0",
114-
NEXT_PUBLIC_GA_ID:
115-
process.env.NODE_ENV === "production" ? "UA-44373548-16" : "",
116-
},
117-
headers: async () => {
118-
return [
119-
{
120-
source: "/graphql",
121-
headers: [
122-
{
123-
key: "Access-Control-Allow-Origin",
124-
value: "*",
125-
},
126-
{
127-
key: "Access-Control-Allow-Methods",
128-
value: "GET, POST, OPTIONS",
129-
},
130-
{
131-
key: "Access-Control-Allow-Headers",
132-
value: "Content-Type",
133-
},
134-
],
135-
},
136-
]
137-
},
138-
trailingSlash: true,
139-
// Only for local development, skip 200 statusCode due following error:
140-
//
141-
// `statusCode` is not undefined or valid statusCode for route {"source":"/conf/attendee/:path*","destination":"https://graphql-conf-attendee-nextjs.vercel.app/:path*","statusCode":200}
142-
// `statusCode` is not undefined or valid statusCode for route {"source":"/swapi-graphql/:path*","destination":"https://graphql.github.io/swapi-graphql/:path*","statusCode":200}
143-
// Valid redirect statusCode values are 301, 302, 303, 307, 308
144-
redirects: () => vercelJSON.redirects.filter(o => o.statusCode !== 200),
145-
async rewrites() {
146-
return [
147-
{
148-
source: "/swapi-graphql/:path*",
149-
destination: "https://swapi-graphql.netlify.app/:path*",
150-
},
151-
{
152-
source: "/graphql",
153-
destination: "https://swapi-graphql.netlify.app/graphql",
154-
},
155-
]
156-
},
157-
}),
158-
)
107+
return config
108+
},
109+
output: "export",
110+
images: {
111+
loader: "custom",
112+
imageSizes: [16, 32, 48, 64, 96, 128, 256, 384],
113+
deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
114+
},
115+
transpilePackages: ["next-image-export-optimizer"],
116+
env: {
117+
nextImageExportOptimizer_imageFolderPath: "public/images",
118+
nextImageExportOptimizer_exportFolderPath: "out",
119+
nextImageExportOptimizer_quality: "75",
120+
nextImageExportOptimizer_storePicturesInWEBP: "true",
121+
nextImageExportOptimizer_exportFolderName: "nextImageExportOptimizer",
122+
// If you do not want to use blurry placeholder images, then you can set
123+
// nextImageExportOptimizer_generateAndUseBlurImages to false and pass
124+
// `placeholder="empty"` to all <ExportedImage> components.
125+
nextImageExportOptimizer_generateAndUseBlurImages: "true",
126+
// If you want to cache the remote images, you can set the time to live of the cache in seconds.
127+
// The default value is 0 seconds.
128+
nextImageExportOptimizer_remoteImageCacheTTL: "0",
129+
NEXT_PUBLIC_GA_ID:
130+
process.env.NODE_ENV === "production" ? "UA-44373548-16" : "",
131+
},
132+
headers: async () => {
133+
return [
134+
{
135+
source: "/graphql",
136+
headers: [
137+
{
138+
key: "Access-Control-Allow-Origin",
139+
value: "*",
140+
},
141+
{
142+
key: "Access-Control-Allow-Methods",
143+
value: "GET, POST, OPTIONS",
144+
},
145+
{
146+
key: "Access-Control-Allow-Headers",
147+
value: "Content-Type",
148+
},
149+
],
150+
},
151+
]
152+
},
153+
trailingSlash: true,
154+
// Only for local development, skip 200 statusCode due following error:
155+
//
156+
// `statusCode` is not undefined or valid statusCode for route {"source":"/conf/attendee/:path*","destination":"https://graphql-conf-attendee-nextjs.vercel.app/:path*","statusCode":200}
157+
// `statusCode` is not undefined or valid statusCode for route {"source":"/swapi-graphql/:path*","destination":"https://graphql.github.io/swapi-graphql/:path*","statusCode":200}
158+
// Valid redirect statusCode values are 301, 302, 303, 307, 308
159+
redirects: () => vercelJSON.redirects.filter(o => o.statusCode !== 200),
160+
async rewrites() {
161+
return [
162+
{
163+
source: "/swapi-graphql/:path*",
164+
destination: "https://swapi-graphql.netlify.app/:path*",
165+
},
166+
{
167+
source: "/graphql",
168+
destination: "https://swapi-graphql.netlify.app/graphql",
169+
},
170+
]
171+
},
172+
}
173+
174+
const withBundleAnalyzer = nextBundleAnalyzer({
175+
enabled: process.env.ANALYZE === "true",
176+
})
177+
178+
export default withBundleAnalyzer(withLess(withNextra(config)))

‎package.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@
66
"packageManager": "[email protected]",
77
"scripts": {
88
"build": "next build && next-image-export-optimizer",
9+
"serve": "pnpx serve out",
10+
"analyze": "ANALYZE=true next build",
911
"check:links": "lychee --verbose --no-progress './src/pages/**/*.mdx' --base https://graphql.org",
1012
"dev": "next",
1113
"format": "pnpm format:check --write",
@@ -15,13 +17,14 @@
1517
"lint:docs:ci": "eslint --ignore-path .gitignore src/pages/learn --format eslint-formatter-github",
1618
"postbuild": "next-sitemap",
1719
"prebuild": "tsx src/get-github-info.ts",
18-
"start": "next start",
1920
"test": "echo \"no tests\" && exit 1",
2021
"validate:snippets": "node scripts/validate-snippets.js"
2122
},
2223
"dependencies": {
2324
"@graphql-tools/schema": "10.0.23",
2425
"@headlessui/react": "^2.2.4",
26+
"@igorkowalczyk/is-browser": "^5.1.0",
27+
"@next/bundle-analyzer": "^15.4.5",
2528
"@radix-ui/react-radio-group": "^1.2.2",
2629
"@tailwindcss/container-queries": "^0.1.1",
2730
"@tailwindcss/nesting": "0.0.0-insiders.565cd3e",

0 commit comments

Comments
 (0)