create-next-mdx-blog-app 2.1.4 → 2.1.6

package/README.md

@@ -16,7 +16,7 @@ This starter kit is built with **Static Site Generation (SSG)** compliance at it
 ## ⚙️ Project Setup
 
 ### Prerequisites
-- **Node.js**: Ensure you have Node.js installed (version 15.x or later).
+- **Node.js**: Ensure you have Node.js installed (version 18.17.0 or later).
 - **NPM**: Node Package Manager comes with Node.js.
 
 ### Installation
@@ -31,7 +31,13 @@ This starter kit is built with **Static Site Generation (SSG)** compliance at it
    npm install
    ```
 
-3. Start the development server:
+3. Configure environment variables:
+   ```bash
+   cp .env.example .env.local
+   # Fill in SUPABASE_URL, SUPABASE_ANON_KEY, ANTHROPIC_API_KEY, and others in .env.local
+   ```
+
+4. Start the development server:
    ```bash
    npm run dev
    ```
@@ -40,17 +46,13 @@ If you want, you can also run this project using the following command:
    ```bash
    npx create-next-mdx-blog-app .
    ```
-This will instantly create and setup the starter kit project for you to work on.
+This will clone the repository, install dependencies, and guide you through environment setup automatically.
 
 ## ![NPM](https://img.shields.io/badge/NPM-CB3837?style=for-the-badge&logo=npm&logoColor=white) Package
 
-### Install via NPM
-
-```bash
-npm install create-next-mdx-blog-app
-```
+### Quick Start
 
-### Quick Start with NPX
+**`npx create-next-mdx-blog-app .`**
 
 ```bash
 npx create-next-mdx-blog-app .
@@ -59,7 +61,7 @@ npx create-next-mdx-blog-app .
 ### Package Information
 
 - **Package Name**: `create-next-mdx-blog-app`
-- **Version**: `2.1.4`
+- **Version**: `2.1.5`
 - **License**: MIT
 - **Homepage**: [https://www.npmjs.com/package/create-next-mdx-blog-app](https://www.npmjs.com/package/create-next-mdx-blog-app/)
 

package/bin/create.js

@@ -1,8 +1,6 @@
 #!/usr/bin/env node
-const { execa } = require('execa');
 const path = require('path');
 const fs = require('fs');
-const inquirer = require('inquirer');
 const degit = require('degit');
 
 // GitHub repository URL of the template (the repo you want to clone)
@@ -20,16 +18,15 @@ async function setup() {
   }
 
   // Ask the user if they want to set up the blog
-  const answers = await inquirer.prompt([
-    {
-      type: 'confirm',
-      name: 'install',
-      message: 'Do you want to set up a Next.js MDX blog app here?',
-      default: true,
-    },
-  ]);
+  // inquirer v9+ is ESM-only — use dynamic import and the @inquirer/prompts confirm helper
+  const { confirm } = await import('@inquirer/prompts');
+  const { execa } = await import('execa');
+  const install = await confirm({
+    message: 'Do you want to set up a Next.js MDX blog app here?',
+    default: true,
+  });
 
-  if (!answers.install) {
+  if (!install) {
     console.log('Aborted the installation.');
     return;
   }
@@ -37,22 +34,26 @@ async function setup() {
   console.log('Setting up the Next.js MDX blog app...');
 
   try {
-    // Use degit to clone the repository into the current directory
-    const emitter = degit(repoUrl, { cache: false, force: true });
+    // Clone only the Next.js app subdirectory directly into cwd
+    // so the user gets project files at the root without repo meta-files
+    console.log('Cloning repository...');
+    const emitter = degit(`${repoUrl}/mdx-medium-blog-post-provider`, { cache: false, force: true });
     await emitter.clone(cwd);
 
-    // If there's no package.json, initialize it first
-    if (!hasPackageJson) {
-      console.log('Initializing npm project...');
-      await execa('npm', ['init', '-y'], { stdio: 'inherit' }); // Initialize package.json with default values
-    }
-
-    // Install dependencies
+    // Install dependencies — app root is now cwd
     console.log('Installing dependencies...');
-    await execa('npm', ['install'], { stdio: 'inherit' });
+    await execa('npm', ['install'], {
+      stdio: 'inherit',
+      cwd,
+    });
 
     console.log('Next.js MDX Blog setup completed!');
-    console.log('To start the app, run:');
+    console.log('');
+    console.log('Before starting the app, configure your environment variables:');
+    console.log('  cp .env.example .env.local');
+    console.log('  # Fill in SUPABASE_URL, SUPABASE_ANON_KEY, ANTHROPIC_API_KEY, and others in .env.local');
+    console.log('');
+    console.log('Then start the development server:');
     console.log('  npm run dev');
   } 
   catch (error) {

package/package.json

@@ -1,9 +1,20 @@
 {
   "name": "create-next-mdx-blog-app",
-  "version": "2.1.4",
+  "version": "2.1.6",
+  "description": "A production-ready technical blog starter kit built with Next.js, MDX, Supabase, and TypeScript.",
+  "author": {
+    "name": "Abdullah Muhammad",
+    "url": "https://github.com/CodingAbdullah"
+  },
+  "files": [
+    "bin/"
+  ],
   "bin": {
     "create-next-mdx-blog-app": "./bin/create.js"
   },
+  "engines": {
+    "node": ">=18.17.0"
+  },
   "homepage": "https://next-mdx-blog-starter-sigma.vercel.app/",
   "repository": {
     "type": "git",
@@ -21,7 +32,7 @@
     "supabase",
     "typescript"
   ],
-  "license": "MIT License",
+  "license": "MIT",
   "scripts": {
     "dev": "next dev",
     "build": "next build",
@@ -47,7 +58,7 @@
     "degit": "^2.8.4",
     "execa": "^9.6.1",
     "gray-matter": "^4.0.3",
-    "inquirer": "^13.3.2",
+    "@inquirer/prompts": "^8.3.2",
     "lucide-react": "^1.7.0",
     "next": "^16.2.1",
     "next-mdx-remote": "^6.0.0",

package/.env.example

@@ -1,17 +0,0 @@
-# Supabase — required for dynamic blog post fetching
-SUPABASE_URL=
-SUPABASE_ANON_KEY=
-
-# Anthropic — required for the Blog Assistant chat feature
-ANTHROPIC_API_KEY=
-
-# GitHub — optional but recommended for the <GitHubGist> component
-# Without a token, the GitHub API allows 60 requests/hr per IP.
-# With a token (read-only gist scope), the limit rises to 5,000 requests/hr.
-GITHUB_TOKEN=
-
-# GitHub username used to construct mdxgists.net URLs (defaults to CodingAbdullah)
-GITHUB_USERNAME=
-
-# Base URL for mdxgists.net links (defaults to https://mdxgists.net)
-GIST_BASE_URL=

package/CLAUDE.md

@@ -1,401 +0,0 @@
-# CLAUDE.md
-Production Configuration File
-Project: Next-MDX-Blog-Starter
-
----
-
-# PROJECT PURPOSE
-
-This repository is a production-grade Next.js App Router blog starter kit built using MDX, Supabase, AWS S3, and TypeScript strict mode.
-
-This project follows a Static Site Generation (SSG-first) architecture and is optimized for performance, SEO, maintainability, and production deployment.
-
-Claude Sonnet 4 is the primary coding model used to develop and maintain this project.
-
-Claude acts as a senior production engineer responsible for generating safe, correct, production-ready code.
-
----
-
-# CORE STACK
-
-Framework
-• Next.js (App Router only)
-• React
-• TypeScript (strict mode mandatory)
-
-Content
-• MDX
-• gray-matter
-• next-mdx-remote
-
-Database
-• Supabase (direct integration via Server Components)
-
-Storage
-• AWS S3 (image storage)
-
-UI
-• shadcn/ui
-• lucide-react
-
-Other
-• Docker
-• Vercel Analytics
-
----
-
-# ARCHITECTURE RULES
-
-This project is SSG-first.
-
-Claude must always prefer Static Site Generation over dynamic rendering.
-
-Use dynamic rendering ONLY when explicitly required.
-
-All blog posts must be statically generated when possible.
-
-Use generateStaticParams when applicable.
-
-Avoid unnecessary client-side rendering.
-
-Prefer Server Components over Client Components.
-
-Never introduce performance regressions.
-
----
-
-# TYPESCRIPT REQUIREMENTS (MANDATORY)
-
-All generated code must:
-
-• use strict mode
-• never use any
-• include explicit types
-• include proper return types
-• include proper interfaces
-• include proper error handling
-• be production-ready
-• be compile-ready immediately
-
-Never generate placeholder code.
-Never generate incomplete code.
-Never generate mock implementations.
-
----
-
-# PROJECT STRUCTURE RULES
-
-Claude must respect existing project structure.
-
-Key directories:
-
-/app
-/src/markdown
-/src/utils
-/src/utils/functions
-/src/utils/functions/crud
-/src/utils/functions/supabase_client
-/components
-/components/customMDXComponents
-/scripts
-
-Never restructure folders unless explicitly instructed.
-
-Never break import paths.
-
----
-
-# MDX SYSTEM RULES
-
-Static MDX:
-
-• Must be statically generated at build time
-• Must use gray-matter for frontmatter parsing
-• Must support metadata generation
-
-Dynamic MDX:
-
-• Must use next-mdx-remote
-• Must render server-side only
-• Must never expose raw MDX to client
-
-Frontmatter must include:
-
----
-title: string
-description: string
-publishedAt: string
-author: string
-tags: string[]
-image: string
----
-
-Claude must validate frontmatter when generating MDX logic.
-
----
-
-# MDX COMPONENT RULES
-
-File: mdx-components.tsx
-
-Must override:
-
-• img → Next Image
-• a → Next Link
-
-Must maintain accessibility.
-
-Custom MDX components must live inside:
-
-/components/customMDXComponents
-
-Examples:
-
-• CodeBlock
-• MDXImage
-• GitHubGist
-
-All components must be fully typed.
-
----
-
-# SUPABASE RULES
-
-Supabase is integrated directly.
-
-Claude must NOT create custom backend APIs unless explicitly instructed.
-
-Supabase client location:
-
-/src/utils/functions/supabase_client
-
-CRUD functions location:
-
-/src/utils/functions/crud
-
-Rules:
-
-• Never expose secrets
-• Never expose service role key
-• Use environment variables
-• Use server-side access
-• Respect Row Level Security
-
-Environment variables allowed:
-
-SUPABASE_URL
-SUPABASE_ANON_KEY
-
-Never commit .env files.
-
----
-
-# AWS S3 RULES
-
-AWS S3 is used for image storage.
-
-Claude must:
-
-• Use public image URLs
-• Use Next Image component
-• Never expose credentials
-• Never embed secrets
-
-S3 domain configuration exists in next.config.ts
-
----
-
-# DOCKER RULES
-
-Docker must:
-
-• Use multi-stage builds
-• Use production Node runtime
-• Exclude dev dependencies
-• Inject environment variables at runtime
-• Expose port 3000
-
-Claude must generate production-ready Docker configurations only.
-
----
-
-# ANALYTICS RULES
-
-Vercel Analytics is used.
-
-Claude must:
-
-• Keep analytics lightweight
-• Avoid blocking rendering
-• Avoid performance regressions
-
----
-
-# ARTICLE MANAGER SCRIPT RULES
-
-File:
-
-/scripts/action-script/article-manager.ts
-
-Commands supported:
-
-insert
-delete
-update
-fetch
-fetchAll
-
-Claude must:
-
-• Maintain CLI interface
-• Validate arguments
-• Provide proper error handling
-• Provide proper exit codes
-• Maintain strict typing
-
-Never break script interface.
-
----
-
-# PERFORMANCE RULES
-
-Claude must:
-
-• Prefer Server Components
-• Avoid unnecessary Client Components
-• Avoid hydration mismatches
-• Avoid blocking rendering
-• Optimize images
-• Optimize imports
-• Avoid unnecessary JS
-
----
-
-# SECURITY RULES
-
-Claude must never:
-
-• expose secrets
-• expose environment variables
-• leak Supabase credentials
-• introduce unsafe eval
-• introduce vulnerabilities
-
-All input must be validated.
-
----
-
-# GIT WORKFLOW RULES (CRITICAL)
-
-Claude must NEVER commit automatically.
-
-Claude must NEVER commit after generating code.
-
-Claude must NEVER create commits unless explicitly instructed.
-
-Claude must ONLY commit when the user explicitly writes:
-
-commit changes
-create commit
-commit this feature
-
-Without explicit commit instruction, Claude must NOT commit.
-
-All commits must be batch commits.
-
----
-
-# BRANCH WORKFLOW RULES (CRITICAL)
-
-Claude must NEVER create branches automatically.
-
-Claude must NEVER invent branch names.
-
-Branches may ONLY be created when explicitly instructed.
-
-Allowed prefixes:
-
-dev/
-fix/
-
-Claude must NEVER commit directly to main or master.
-
-Claude must NEVER switch branches automatically.
-
----
-
-# COMMIT SAFETY RULES
-
-When committing, Claude must ensure:
-
-• only relevant files included
-• no unrelated files included
-• no secrets included
-• code compiles
-• strict TypeScript passes
-• commit is atomic
-
-Commit messages must be clear and professional.
-
----
-
-# CODE GENERATION REQUIREMENTS
-
-All generated code must:
-
-• be production-ready
-• be fully typed
-• include error handling
-• follow modern best practices
-• follow Next.js App Router patterns
-• be modular
-• be maintainable
-
-Claude must never generate placeholder implementations.
-
-Claude must never generate incomplete logic.
-
-Claude must never generate fake implementations.
-
----
-
-# DEPLOYMENT TARGETS
-
-Project must remain compatible with:
-
-• Vercel
-• Docker deployment
-• Static hosting (SSG mode)
-
-Claude must preserve deployment compatibility.
-
----
-
-# DEFAULT BEHAVIOR
-
-Unless explicitly instructed otherwise, Claude must assume:
-
-• production environment
-• strict TypeScript required
-• Supabase integration active
-• AWS S3 active
-• SSG preferred
-
-Claude must behave as a senior production engineer.
-
----
-
-# PRIORITY ORDER
-
-Claude must prioritize in this order:
-
-1 Security
-2 Type safety
-3 Performance
-4 Maintainability
-5 SEO
-6 Developer experience
-
----
-
-END OF FILE

package/Dockerfile

@@ -1,37 +0,0 @@
-# Dockerize the Next.js application and run a production version in a container using this Dockerfile
-# Build stage
-FROM node:20-alpine AS builder
-
-WORKDIR /app
-
-# Copy package files
-COPY package*.json ./
-
-# Install dependencies
-RUN npm ci
-
-# Copy the rest of the application
-COPY . .
-
-# Build the application
-RUN npm run build
-
-# Production stage
-FROM node:20-alpine AS runner
-
-WORKDIR /app
-
-# Set environment variables
-ENV NODE_ENV=production
-
-# Copy necessary files from builder
-COPY --from=builder /app/next.config.ts ./
-COPY --from=builder /app/public ./public
-COPY --from=builder /app/.next/standalone ./
-COPY --from=builder /app/.next/static ./.next/static
-
-# Expose the port the app runs on
-EXPOSE 3000
-
-# Command to run the application
-CMD ["node", "server.js"]

package/components.json

@@ -1,21 +0,0 @@
-{
-  "$schema": "https://ui.shadcn.com/schema.json",
-  "style": "new-york",
-  "rsc": true,
-  "tsx": true,
-  "tailwind": {
-    "config": "",
-    "css": "src/app/globals.css",
-    "baseColor": "neutral",
-    "cssVariables": true,
-    "prefix": ""
-  },
-  "aliases": {
-    "components": "@/components",
-    "utils": "@/lib/utils",
-    "ui": "@/components/ui",
-    "lib": "@/lib",
-    "hooks": "@/hooks"
-  },
-  "iconLibrary": "lucide"
-}

package/eslint.config.mjs

@@ -1,16 +0,0 @@
-import { dirname } from "path";
-import { fileURLToPath } from "url";
-import { FlatCompat } from "@eslint/eslintrc";
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = dirname(__filename);
-
-const compat = new FlatCompat({
-  baseDirectory: __dirname,
-});
-
-const eslintConfig = [
-  ...compat.extends("next/core-web-vitals", "next/typescript"),
-];
-
-export default eslintConfig;