https://github.com/emanuelefavero/next-markdown-blog
A Next.js markdown blog static site generator
https://github.com/emanuelefavero/next-markdown-blog
blog markdown next nextjs static-site-generator
Last synced: 6 months ago
JSON representation
A Next.js markdown blog static site generator
- Host: GitHub
- URL: https://github.com/emanuelefavero/next-markdown-blog
- Owner: emanuelefavero
- License: mit
- Created: 2023-01-29T13:07:18.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-04-16T16:59:32.000Z (over 1 year ago)
- Last Synced: 2025-02-04T16:50:26.710Z (8 months ago)
- Topics: blog, markdown, next, nextjs, static-site-generator
- Language: JavaScript
- Homepage: https://next-markdown-blog-ivory.vercel.app
- Size: 1.17 MB
- Stars: 2
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# Next.js Markdown Blog
A Next.js markdown blog static site generator (SSG)
> Note: This project is built with the Next.js Pages Router, to see how to create a Markdown Blog with the Next.js App Router check the [next-markdown-blog-app-router](https://github.com/emanuelefavero/next-markdown-blog-app-router) repository
## Live Demo
- [https://next-markdown-blog-ivory.vercel.app/](https://next-markdown-blog-ivory.vercel.app/)
#### Screenshot
## How to use
### Installation
- clone the repo and `cd` into it, then run:
```bash
npm install
```### Development
- run the development server:
```bash
npm run dev
```## How to create new posts
- create a new markdown file in the `posts` directory
- add the following front-matter to the top of the file:```markdown
---
title: 'My New Post'
date: 'Jan 29 2023'
excerpt: 'This is my new post'
cover_image: '/images/posts/my-new-post-cover-image.jpg'
---
```- add the content of your post below the front-matter in markdown format
> Note: add a cover image in the `public/images/posts` directory and reference it in the front-matter
## Test Static Site Generation
- run the build command:
```bash
npm run build
```- install serve:
```bash
npm install -g serve
```- run the static site:
```bash
serve -s out -p 8000
```## Used Packages
- [marked](https://www.npmjs.com/package/marked) - Markdown parser for creating Blog posts from markdown files
- [gray-matter](https://www.npmjs.com/package/gray-matter) - a front-matter parser for parsing metadata at the top of files## License
- [MIT](LICENSE.md)