diff --git a/examples/with-sitemap/.env b/examples/with-sitemap/.env new file mode 100644 index 0000000000000000000000000000000000000000..8d8ccb6fca0e4f3c4915195fbe162af2ddf8d11a --- /dev/null +++ b/examples/with-sitemap/.env @@ -0,0 +1,2 @@ +# Used to add the domain to sitemap.xml, replace it with a real domain in production +WEBSITE_URL=http://localhost:3000 \ No newline at end of file diff --git a/examples/with-sitemap/README.md b/examples/with-sitemap/README.md new file mode 100644 index 0000000000000000000000000000000000000000..a6d6d7b56b76bc22d0579c9f149b28d2d5af960c --- /dev/null +++ b/examples/with-sitemap/README.md @@ -0,0 +1,51 @@ +# With Sitemap example + +This example shows how to generate a `sitemap.xml` file based on the pages in your [Next.js](https://nextjs.org/) app. The sitemap will be generated and saved in the `public` directory after starting the development server or by making a build. + +## Deploy your own + +Deploy the example using [Vercel](https://vercel.com): + +[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/import/project?template=https://github.com/vercel/next.js/tree/canary/examples/hello-world) + +## How to use + +### Using `create-next-app` + +Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [npm](https://docs.npmjs.com/cli/init) or [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) to bootstrap the example: + +```bash +npx create-next-app --example with-sitemap with-sitemap-app +# or +yarn create next-app --example with-sitemap with-sitemap-app +``` + +### Download manually + +Download the example: + +```bash +curl https://codeload.github.com/vercel/next.js/tar.gz/canary | tar -xz --strip=2 next.js-canary/examples/with-sitemap +cd with-sitemap +``` + +Install it and run: + +```bash +npm install +npm run dev +# or +yarn +yarn dev +``` + +Your app should be up and running on [http://localhost:3000](http://localhost:3000) and the sitemap should now be available in [http://localhost:3000/sitemap.xml](http://localhost:3000/sitemap.xml)! If it doesn't work, post on [GitHub discussions](https://github.com/vercel/next.js/discussions). + +To change the website URL used by `sitemap.xml`, open the file `.env` and change the `WEBSITE_URL` environment variable: + +```bash +# Used to add the domain to sitemap.xml, replace it with a real domain in production +WEBSITE_URL=https://my-domain.com +``` + +Deploy it to the cloud with [Vercel](https://vercel.com/import?filter=next.js&utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)). diff --git a/examples/with-sitemap/next.config.js b/examples/with-sitemap/next.config.js new file mode 100644 index 0000000000000000000000000000000000000000..08a972d01c6d605811a117c8a7a30156d4302eb3 --- /dev/null +++ b/examples/with-sitemap/next.config.js @@ -0,0 +1,9 @@ +module.exports = { + webpack: (config, { isServer }) => { + if (isServer) { + require('./scripts/generate-sitemap') + } + + return config + }, +} diff --git a/examples/with-sitemap/package.json b/examples/with-sitemap/package.json new file mode 100644 index 0000000000000000000000000000000000000000..beb83580fa2e24d77d6dd2588399296c6171b23c --- /dev/null +++ b/examples/with-sitemap/package.json @@ -0,0 +1,18 @@ +{ + "name": "with-sitemap", + "version": "0.1.0", + "scripts": { + "dev": "next dev", + "build": "next build", + "start": "next start" + }, + "dependencies": { + "next": "latest", + "react": "^16.13.1", + "react-dom": "^16.13.1" + }, + "devDependencies": { + "globby": "^11.0.1" + }, + "license": "MIT" +} diff --git a/examples/with-sitemap/pages/contact.js b/examples/with-sitemap/pages/contact.js new file mode 100644 index 0000000000000000000000000000000000000000..0d718f02d5fc97b7f48f783904c8aeb7bf202477 --- /dev/null +++ b/examples/with-sitemap/pages/contact.js @@ -0,0 +1,128 @@ +import Head from 'next/head' + +export default function Home() { + return ( +
+ + Create Next App + + + +
+

+ Welcome to Next.js! +

+ +

Contact Page

+
+ + + + + + +
+ ) +} diff --git a/examples/with-sitemap/pages/index.js b/examples/with-sitemap/pages/index.js new file mode 100644 index 0000000000000000000000000000000000000000..1379c5f92dabbcfc18e5f501a853ffa0bb34bed7 --- /dev/null +++ b/examples/with-sitemap/pages/index.js @@ -0,0 +1,209 @@ +import Head from 'next/head' + +export default function Home() { + return ( +
+ + Create Next App + + + +
+

+ Welcome to Next.js! +

+ +

+ Get started by editing pages/index.js +

+ +
+ +

Documentation →

+

Find in-depth information about Next.js features and API.

+ + + +

Learn →

+

Learn about Next.js in an interactive course with quizzes!

+ + + +

Examples →

+

Discover and deploy boilerplate example Next.js projects.

+ + + +

Deploy →

+

+ Instantly deploy your Next.js site to a public URL with Vercel. +

+ +
+
+ + + + + + +
+ ) +} diff --git a/examples/with-sitemap/public/favicon.ico b/examples/with-sitemap/public/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..4965832f2c9b0605eaa189b7c7fb11124d24e48a Binary files /dev/null and b/examples/with-sitemap/public/favicon.ico differ diff --git a/examples/with-sitemap/public/sitemap.xml b/examples/with-sitemap/public/sitemap.xml new file mode 100644 index 0000000000000000000000000000000000000000..73774003a77ab5000a082eaa62eedc19e5af4bb5 --- /dev/null +++ b/examples/with-sitemap/public/sitemap.xml @@ -0,0 +1,10 @@ + + + http://localhost:3000/contact + hourly + + + http://localhost:3000 + hourly + + \ No newline at end of file diff --git a/examples/with-sitemap/public/vercel.svg b/examples/with-sitemap/public/vercel.svg new file mode 100644 index 0000000000000000000000000000000000000000..fbf0e25a651c28931b2fe8afa2947e124eebc74f --- /dev/null +++ b/examples/with-sitemap/public/vercel.svg @@ -0,0 +1,4 @@ + + + \ No newline at end of file diff --git a/examples/with-sitemap/scripts/generate-sitemap.js b/examples/with-sitemap/scripts/generate-sitemap.js new file mode 100644 index 0000000000000000000000000000000000000000..4bd49377b2c506dd99d4df6da42d4989d4e30029 --- /dev/null +++ b/examples/with-sitemap/scripts/generate-sitemap.js @@ -0,0 +1,28 @@ +const fs = require('fs') +const globby = require('globby') + +function addPage(page) { + const path = page.replace('pages', '').replace('.js', '').replace('.mdx', '') + const route = path === '/index' ? '' : path + + return ` + ${`${process.env.WEBSITE_URL}${route}`} + hourly + ` +} + +async function generateSitemap() { + // Ignore Next.js specific files (e.g., _app.js) and API routes. + const pages = await globby([ + 'pages/**/*{.js,.mdx}', + '!pages/_*.js', + '!pages/api', + ]) + const sitemap = ` +${pages.map(addPage).join('\n')} +` + + fs.writeFileSync('public/sitemap.xml', sitemap) +} + +generateSitemap()