https://github.com/hritik-6918/nextjs-blog-cms-wisp
Next.js 14 Blog - backed by Wisp CMS
https://github.com/hritik-6918/nextjs-blog-cms-wisp
Last synced: about 2 months ago
JSON representation
Next.js 14 Blog - backed by Wisp CMS
- Host: GitHub
- URL: https://github.com/hritik-6918/nextjs-blog-cms-wisp
- Owner: hritik-6918
- License: mit
- Created: 2024-08-08T11:48:18.000Z (10 months ago)
- Default Branch: main
- Last Pushed: 2024-08-09T11:57:40.000Z (10 months ago)
- Last Synced: 2024-08-09T13:06:48.676Z (10 months ago)
- Language: TypeScript
- Homepage: https://nextjs-blog-cms-wisp-hritik6918.vercel.app
- Size: 559 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Next.js 14 Blog using Server Components - Backed by Wisp CMS
[](/)
[](/)
[](/)
**Featured Links**
This is a [Next.js](https://nextjs.org/docs/getting-started/installation), [Tailwind CSS](https://tailwindcss.com/), [Shadcn](https://ui.shadcn.com/) blogging template. This version is using Next.js 14 App Router with [React Server Components](https://nextjs.org/docs/getting-started/react-essentials#server-components) and uses [Wisp](https://wisp.blog/?utm_source=github&utm_medium=web&utm_campaign=nextjs-blog-cms-wisp) for publishing blog posts.
The most feature-rich Next.js blog template out there that is easily configurable and customizable.
## About Wisp
Wisp is a modern CMS for adding blogs to websites. It features an intuitive, medium-like editorial experience so that you can focus on writing instead of getting distracted by markdown.
## Features
- Beautiful blog starter kit with server rendering using Next.js 14 Server Components
- Responsive layout for mobile devices
- Filter blog posts by tags
- About page
- Light & dark mode
- Automatic hierarchical sitemap generation
- Automatic Open Graph image generation
- Automatic Related Posts suggestions
- RSS Feed
## Technologies
- [Next.js 14](https://nextjs.org/) using App Router & TypeScript
- [Wisp](https://wisp.blog/?utm_source=github&utm_medium=web&utm_campaign=nextjs-blog-cms-wisp) to manage blog posts
- [Tailwind CSS](https://tailwindcss.com/) for CSS framework
- [Shadcn UI](https://ui.shadcn.com/) for UI components
- [ESLint](https://eslint.org/) for static analysis
- [TypeScript](https://www.typescriptlang.org/) for type safety
- Font optimization with [next/font](https://nextjs.org/docs/app/api-reference/components/font)
## Quick Start Guide
First, install the dependencies:
```bash
npm install
```
Then, copy the `.env.example` file to `.env`:
```bash
cp .env.example .env
```
Note: You will need to get the `NEXT_PUBLIC_BLOG_ID` variable with the Blog ID obtained from wisp after creating an account.
Finally, run the development server:
```bash
npm run dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.