Skip to content

Commit faaba0f

Browse files
authored
Simplify and convert with-vercel-fetch example to TypeScript (vercel#43403)
Simplified the example to just the specific feature, and converted to TypeScript. - `node-fetch@2` is either polyfilled by Next.js or a peerDep of `@vercel/fetch`, I can't quite tell, but either way it can be removed from the dependencies. ## Documentation / Examples - [X] Make sure the linting passes by running `pnpm build && pnpm lint` - [X] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
1 parent 396f9cc commit faaba0f

File tree

9 files changed

+59
-53
lines changed

9 files changed

+59
-53
lines changed

examples/with-vercel-fetch/fetch/browser.js

-3
This file was deleted.

examples/with-vercel-fetch/fetch/package.json

-4
This file was deleted.

examples/with-vercel-fetch/fetch/server.js

-4
This file was deleted.
+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
// For simplicity we are creating our own types here.
2+
// If you want the full types check out:
3+
// https://github.com/octokit/openapi-types.ts
4+
export type Repository = {
5+
id: number
6+
name: string
7+
full_name: string
8+
stargazers_count: number
9+
private: boolean
10+
} & Record<string, unknown>

examples/with-vercel-fetch/package.json

+8-4
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,15 @@
66
"start": "next start"
77
},
88
"dependencies": {
9-
"@vercel/fetch": "6.1.0",
9+
"@vercel/fetch": "^6.2.0",
1010
"next": "latest",
11-
"node-fetch": "2.6.7",
1211
"react": "^18.2.0",
13-
"react-dom": "^18.2.0",
14-
"unfetch": "4.2.0"
12+
"react-dom": "^18.2.0"
13+
},
14+
"devDependencies": {
15+
"@types/node": "^18.11.9",
16+
"@types/react": "^18.0.25",
17+
"@types/react-dom": "^18.0.9",
18+
"typescript": "^4.9.3"
1519
}
1620
}

examples/with-vercel-fetch/pages/index.js

-19
This file was deleted.
+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import type { InferGetStaticPropsType } from 'next'
2+
import type { Repository } from '../github'
3+
import createFetch from '@vercel/fetch'
4+
5+
export async function getStaticProps() {
6+
const fetch = createFetch()
7+
const res = await fetch('https://api.github.com/repos/vercel/next.js')
8+
const repo = (await res.json()) as Repository
9+
10+
return { props: { stars: repo.stargazers_count } }
11+
}
12+
13+
export default function HomePage({
14+
stars,
15+
}: InferGetStaticPropsType<typeof getStaticProps>) {
16+
return (
17+
<div>
18+
<p>Next.js has {stars} ⭐️</p>
19+
</div>
20+
)
21+
}

examples/with-vercel-fetch/pages/preact.js

-19
This file was deleted.
+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"compilerOptions": {
3+
"target": "es5",
4+
"lib": ["dom", "dom.iterable", "esnext"],
5+
"allowJs": true,
6+
"skipLibCheck": true,
7+
"strict": true,
8+
"forceConsistentCasingInFileNames": true,
9+
"noEmit": true,
10+
"esModuleInterop": true,
11+
"module": "esnext",
12+
"moduleResolution": "node",
13+
"resolveJsonModule": true,
14+
"isolatedModules": true,
15+
"jsx": "preserve",
16+
"incremental": true
17+
},
18+
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "github.d.ts"],
19+
"exclude": ["node_modules"]
20+
}

0 commit comments

Comments
 (0)