A modern blog platform built with Next.js, TypeScript, and Tailwind CSS.
Check out the live demo of NextBlogX here.
- 📝 Markdown-based content management
- 🎨 Responsive design with Tailwind CSS
- 🚀 Fast page loads with Next.js App Router
- 🔍 SEO-friendly with metadata optimization
- 📱 Mobile-first approach
- 🖋 Typography-focused reading experience
npm install nextblogx
# or
yarn add nextblogxAfter installation, you can create a new Next.js project with NextBlogX:
npx create-next-app my-blog --example https://github.com/nembal/nextblogx- Clone the repository:
git clone https://github.com/nembal/nextblogx.git
cd nextblogx- Install dependencies:
npm install
# or
yarn install- Run the development server:
npm run dev
# or
yarn dev- Open http://localhost:3000 with your browser to see the result.
To create a new blog post, add a Markdown file to the src/content/posts directory. Each post should have a .md extension and include frontmatter metadata at the top of the file.
---
title: "Your Post Title"
date: "2023-05-15T09:35:07.322Z"
excerpt: "A brief summary of your post"
coverImage: "/images/posts/your-image.jpg" # Optional
author:
name: "Your Name"
picture: "/images/authors/your-picture.jpg" # Optional
tags: # Optional
- tag1
- tag2
---nextblogx/
├── public/ # Static assets
├── src/
│ ├── app/ # Next.js App Router pages
│ ├── components/ # React components
│ ├── content/ # Blog content
│ │ └── posts/ # Markdown blog posts
│ └── lib/ # Utility functions
├── tailwind.config.ts # Tailwind CSS configuration
├── next.config.ts # Next.js configuration
└── package.json # Project dependencies
For detailed API documentation and information on how to extend NextBlogX, see the API.md file.
This project uses Tailwind CSS for styling. You can customize the design by modifying the tailwind.config.ts file.
The main components are located in the src/components directory. You can modify these components to change the layout and appearance of the blog.
Update the site metadata in the src/app/layout.tsx file to change the site title, description, and other metadata.
This is a Next.js project, so it can be easily deployed to platforms like Vercel, Netlify, or any other hosting service that supports Next.js applications.
The easiest way to deploy your Next.js app is to use the Vercel Platform.
Contributions are welcome! Please feel free to submit a Pull Request.
This project is licensed under the MIT License - see the LICENSE file for details.