Next Smooth Doc

Overview:

NextJS Smooth Doc is a minimal doc generator based on Next.js and mdx. It was migrated from smooth DOC in just 4 days in order to compare the framework difference. According to the author, using Next.js is more enjoyable and easy to implement compared to Gatsby.js.

Features:

• Minimal Doc Generator: NextJS Smooth Doc is designed to generate minimalistic documentation.
• Based on Next.js & mdx: It is built on top of Next.js, a popular React framework, and makes use of mdx, which allows you to write JSX in markdown files.
• Easy to Implement: The author claims that Next.js is easier to implement compared to Gatsby.js.
• Migration: NextJS Smooth Doc was migrated from smooth DOC in just 4 days, showcasing the ease of migration between the two frameworks.

Installation:

To install NextJS Smooth Doc, follow these steps:

1. Install Next.js and create a new project:

npx create-next-app my-docs

2. Navigate to the project directory:

cd my-docs

3. Install the required dependencies:

npm install next-mdx-remote @mdx-js/react

4. Create a new file called docs.mdx in the pages directory and add your documentation content.

5. Edit the pages/index.js file and add the following code to retrieve and render the docs.mdx file:

import { getMdxNode } from 'next-mdx-remote';
import { MDXRemote } from 'next-mdx-remote';

import DocsLayout from '../components/DocsLayout';
import { getContent } from '../lib/docs';

export default function Home({ mdxSource }) {
  return (
    <DocsLayout>
      <MDXRemote {...mdxSource} components={{/**/}} />
    </DocsLayout>
  );
}

export async function getStaticProps() {
  const content = await getContent();
  const mdxNode = getMdxNode(content);

  return {
    props: {
      mdxSource: mdxNode
    },
  };
}

6. Start the Next.js development server:

npm run dev

7. Access your NextJS Smooth Doc documentation at http://localhost:3000.

Summary:

NextJS Smooth Doc is a minimal documentation generator based on Next.js and mdx. It offers an easy-to-implement approach for generating documentation and has been successfully migrated from smooth DOC to Next.js in just a few days. The framework comparison indicates that implementing Next.js for documentation is more enjoyable.