Easy way to migrate your existing page router code or content directory code to the app router file convention in one click with nodejs script

[jeevankc17]

Script to Translate All .mdx Files from the content Directory to the app Directory

Introduction

If you felt uncomfortable working with Nextra 4.x releases that comes with two Top-Level Folders i.e. app directory and content directory.
I will explain how to create a script in Node.js that reads all .mdx files from a content directory and converts them to the file convention that works with app directory.

We'll use Node.js and its built-in fs (File System) module to read, write, and process these files.

Prerequisites

Before getting started, ensure you have the following:

• Node.js installed on your machine.
• A basic understanding of JavaScript and file system operations.
• A project structure with a content directory containing .mdx files that need conversion.

Workflow Overview

The script will create page.mdx file and copy all the code from your whatever_name.mdx file then then put the page.mdx file to the whatever_name folder and delete the whatever_name.mdx file.

Writing the Script

To automate this task, we’ll create a script using Node.js. The script will:

Step-by-Step Script

const fs = require('fs');
const path = require('path');

// Function to process the directory
function processDirectory(directory) {
    const items = fs.readdirSync(directory);

    items.forEach(item => {
        const itemPath = path.join(directory, item);
        const stat = fs.statSync(itemPath);

        // Check if it's a directory and recursively process subdirectories
        if (stat.isDirectory()) {
            processDirectory(itemPath);
        } else if (stat.isFile() && path.extname(item) === '.mdx') {
            // Convert the .mdx file to a .md file
            const fileName = path.basename(item, '.mdx');
            const newFilePath = path.join('app', fileName + '.md');

            // Read the content of the original .mdx file
            const content = fs.readFileSync(itemPath, 'utf-8');

            // Write the content to the new .md file in the app directory
            fs.writeFileSync(newFilePath, content, 'utf-8');

            // Optionally, remove the original .mdx file
            // fs.unlinkSync(itemPath); // Uncomment this line if you want to delete the .mdx file
        }
    });
}

// Set the root directory to content
const targetDirectory = 'content';  // Path to the content directory
processDirectory(targetDirectory);

console.log('Conversion complete.');

/my-nextjs-project
  ├── content
  │   ├── file1.md
  │   ├── subfolder
  │   │   ├── file2.md
  ├── scripts
  │   ├── convert.js  (this script)
  
  To run this code use the command `node scripts/convert.js`
  
  Rememver to put the content  in const targetDirectory = 'content';     with the actual path