NextJS-Paper ^{^_5.1}

A simple, clean, flexible NextJS templates inspired by nanxiaobei/hugo-paper
Check out demo in github page

Overview

Feature

GFM supprots with tables using remarkjs/remark-gfm
Katex inline math using remarkjs/remark-math and remarkjs/remark-katex
Syntax highlighting using react-syntax-highlighter
Inner HTML using rehypejs/rehype-raw
Disqus comments using disqus/disqus-react
Dark mode using juliencrn/usehooks-ts

You can check out my commits if you interested

Install

npm run server

You can also serve this page with static htmls after build (which is recommended)

npm run build && npm run export

Configurations

`.env` file

# [OPTIONAL] SITE_NAME value. default is 'Paper'
SITE_NAME=Paper

# [OPTIONAL] SNS ids are all optional. Not shown if empty
INSTAGRAM=raeperd
GITHUB=raeperd
TWITTER=raeperd117

# [OPTIONAL] Disqus configuration. When u want disqus, below two values must be provided
DISQUS_SHORTNAME=nextjs-paper
SERVER_URL=https://raeperd.github.io/nextjs-paper

# [OPTIONAL] Default Author name. Not shown if empty
AUTHOR=raeperd

`next.config.js`


const isProduction = process.env.NODE_ENV === 'production'
const name = 'nextjs-paper'

module.exports = {
  assetPrefix: isProduction ? `/${name}/` : '',
  basePath: isProduction ? `/${name}` : '',
  images: {
    loader: 'akamai',
    path: '',
  },
  webpack(config) {
    config.module.rules.push({
      test: /\.svg$/i,
      issuer: /\.[jt]sx?$/,
      use: ['@svgr/webpack'],
    })

    return config
  },
}

If you want to deploy in github-page (like this repo does), assetPrefix and basePath must be configured as above

Notes

🙅🏻 Multilingual is not supported
⚙️ Build time may increase, as you want to have many markdown files

NextJS-Paper 5.1