diff --git a/examples/with-netlify-cms/README.md b/examples/with-netlify-cms/README.md index 05147176e604dd26d18caf16e93eb047eec52e55..8873d179b883a1ca2de577dae070457a6ce1c05b 100644 --- a/examples/with-netlify-cms/README.md +++ b/examples/with-netlify-cms/README.md @@ -41,5 +41,4 @@ Sites take its content from markdown files in `/content`. Two of pages (`home` a Blog component loads all posts (during build!) and lists them out [How to load multiple md files](https://medium.com/@shawnstern/importing-multiple-markdown-files-into-a-react-component-with-webpack-7548559fce6f) -Posts are separate static sites thanks to dynamically created export map. I took inspiration on how to do it from -[here](https://medium.com/@joranquinten/for-my-own-website-i-used-next-js-725678e65b09) +Updated to take advantange of the new `getStaticPaths` and `getStaticProps` data-fetching functions. diff --git a/examples/with-netlify-cms/next.config.js b/examples/with-netlify-cms/next.config.js index b2d7c9b9bde46058faab220d1ec27c41be81f609..d8767255714dfd4c57a152f0e59edb40f84445be 100644 --- a/examples/with-netlify-cms/next.config.js +++ b/examples/with-netlify-cms/next.config.js @@ -1,19 +1,3 @@ -const fs = require('fs') -const blogPostsFolder = './content/blogPosts' - -const getPathsForPosts = () => - fs.readdirSync(blogPostsFolder).reduce((acc, blogName) => { - const trimmedName = blogName.substring(0, blogName.length - 3) - return Object.assign(acc, { - [`/blog/post/${trimmedName}`]: { - page: '/blog/post/[slug]', - query: { - slug: trimmedName, - }, - }, - }) - }, {}) - module.exports = { webpack: configuration => { configuration.module.rules.push({ @@ -22,10 +6,4 @@ module.exports = { }) return configuration }, - async exportPathMap(defaultPathMap) { - return { - ...defaultPathMap, - ...getPathsForPosts(), - } - }, } diff --git a/examples/with-netlify-cms/pages/blog/index.js b/examples/with-netlify-cms/pages/blog/index.js index 9a17e722934dc834d69fb33f2533aaeefce9b631..97b275097d8af3e46e4ec255375bb9756b056f3f 100644 --- a/examples/with-netlify-cms/pages/blog/index.js +++ b/examples/with-netlify-cms/pages/blog/index.js @@ -40,9 +40,14 @@ const Blog = ({ postsList }) => ( ) -Blog.getInitialProps = async () => { +export async function getStaticProps() { const postsList = await importBlogPosts() - return { postsList } + + return { + props: { + postsList, + }, // will be passed to the page component as props + } } export default Blog diff --git a/examples/with-netlify-cms/pages/blog/post/[slug].js b/examples/with-netlify-cms/pages/blog/post/[slug].js index 2f9bb3956c16bebde037016ce458e5632a4e156f..b24c1d9148747b608b3c82027ecb725512642eb1 100644 --- a/examples/with-netlify-cms/pages/blog/post/[slug].js +++ b/examples/with-netlify-cms/pages/blog/post/[slug].js @@ -1,9 +1,11 @@ +import fs from 'fs' +import path from 'path' import Layout from '../../../components/layout' const Post = ({ blogpost }) => { if (!blogpost) return