├── public
├── favicon.ico
└── zeit.svg
├── pages
├── about.mdx
├── _app.js
└── index.js
├── next.config.js
├── layouts
└── AboutPage.js
├── components
└── MDXProvider.js
├── package.json
├── .gitignore
├── README.md
└── yarn.lock
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/whoisryosuke/next-mdx-boilerplate/HEAD/public/favicon.ico
--------------------------------------------------------------------------------
/pages/about.mdx:
--------------------------------------------------------------------------------
1 | import AboutPage from "../layouts/AboutPage"
2 |
3 |
4 |
5 | # About
6 |
7 | A test MDX page.
8 |
9 |
--------------------------------------------------------------------------------
/next.config.js:
--------------------------------------------------------------------------------
1 | const withMDX = require('@next/mdx')({
2 | extension: /\.(md|mdx)$/,
3 | })
4 | module.exports = withMDX({
5 | // Pick up MDX files in the /pages/ directory
6 | pageExtensions: ['js', 'jsx', 'md', 'mdx'],
7 | })
--------------------------------------------------------------------------------
/pages/_app.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import MDXProvider from '../components/MDXProvider'
3 |
4 |
5 | export default ({Component, pageProps}) => (
6 |
7 |
8 |
9 | )
--------------------------------------------------------------------------------
/layouts/AboutPage.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 |
3 | export default function AboutPage({children}) {
4 | return (
5 |
6 | {children}
7 |
8 | )
9 | }
10 |
--------------------------------------------------------------------------------
/components/MDXProvider.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import {MDXProvider} from '@mdx-js/react'
3 |
4 | const mdComponents = {
5 | h1: props =>
6 | }
7 |
8 | export default ({children}) => (
9 |
10 | {children}
11 |
12 | )
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "next-mdx-boilerplate",
3 | "version": "0.1.0",
4 | "private": true,
5 | "scripts": {
6 | "dev": "next dev",
7 | "build": "next build",
8 | "start": "next start"
9 | },
10 | "dependencies": {
11 | "@mdx-js/loader": "^2.0.0",
12 | "@next/mdx": "^12.0.10",
13 | "next": "12.0.10",
14 | "react": "17.0.2",
15 | "react-dom": "17.0.2",
16 | "remark-gfm": "^3.0.1"
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.js
7 |
8 | # testing
9 | /coverage
10 |
11 | # next.js
12 | /.next/
13 | /out/
14 |
15 | # production
16 | /build
17 |
18 | # misc
19 | .DS_Store
20 |
21 | # debug
22 | npm-debug.log*
23 | yarn-debug.log*
24 | yarn-error.log*
25 |
26 | # local env files
27 | .env.local
28 | .env.development.local
29 | .env.test.local
30 | .env.production.local
31 |
--------------------------------------------------------------------------------
/public/zeit.svg:
--------------------------------------------------------------------------------
1 |
11 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/zeit/next.js/tree/canary/packages/create-next-app).
2 |
3 | ## Getting Started
4 |
5 | First, run the development server:
6 |
7 | ```bash
8 | npm run dev
9 | # or
10 | yarn dev
11 | ```
12 |
13 | Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
14 |
15 | You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
16 |
17 | ## Learn More
18 |
19 | To learn more about Next.js, take a look at the following resources:
20 |
21 | - [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
22 | - [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
23 |
24 | You can check out [the Next.js GitHub repository](https://github.com/zeit/next.js/) - your feedback and contributions are welcome!
25 |
26 | ## Deploy on ZEIT Now
27 |
28 | The easiest way to deploy your Next.js app is to use the [ZEIT Now Platform](https://zeit.co/import?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
29 |
30 | Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
31 |
--------------------------------------------------------------------------------
/pages/index.js:
--------------------------------------------------------------------------------
1 | import Head from 'next/head'
2 |
3 | const Home = () => (
4 |
5 |
6 |
Create Next App
7 |
8 |
9 |
10 |
11 |
12 | Welcome to Next.js!
13 |
14 |
15 |
16 | Get started by editing pages/index.js
17 |
18 |
19 |
48 |
49 |
50 |
59 |
60 |
186 |
187 |
200 |