Markdown blog boilerplate for Next.js, with TypeScript, SASS/SCSS, Styled Components, Jest, ESLint, Prettier, and deployed with Serverless.
Markdown is rendered via remark and remark-html, with the Markdown metadata handled via gray-matter.
Also supports imports with absolute paths.
It runs UI tests with Cypress, for which I'd recommend only testing "critical" aspects of the app, as these tests are harder to maintain than the other unit tests, but these can catch many other things.
All pages are statically generated, meaning they'll be built via server for the first time they're requested (akin to SSR), but the subsequent requests will be as if a pre-rendered static page, incredibly fast (while still being updated after the initial load). This is good for SEO and also for showing up-to-date pages to clients quickly.
It also has a dynamic sitemap and an RSS feed.
Demo at markdown-blog-nextjs-boilerplate.onbrn.com.
See more boilerplates at nextjs-boilerplates.onbrn.com.
make install # installs dependencies
make start # starts the app
make pretty # prettifies the code
make test # runs linting and tests (including UI tests via cypress)
make test/update # runs tests, updating snapshots
make test/cypress # opens cypress to manually run/watch tests (easier for writing and testing/updating them)
make deploy # deploys to markdown-blog-nextjs-boilerplate.onbrn.com (requires `serverless` to be installed globally)NOTE: If you're looking for the previous version which deployed to Vercel, this was the latest commit with it.
Here are some things you will likely want to change before "publishing" this, or after cloning it:
- Analytics code (
usefathom.com) andtheme-colorinpages/_document.tsx - Name, repository, author, and version in
package.json - Values in
lib/constants.tsandstyles/__variables.scss - Service name, domain, and env values in
serverless.yml - Values in
.env.sample - Title, description, and links in this
README.mdfile - URL in
public/robots.txt - Author and copyright in
pages/rss.xml.ts