This is a Next.js project bootstrapped with create-next-app.

Global Blog Functionality

• Author page
• Category page
• Custom 404 Error
• Pages like About Us and Contact Us
• Search Functionality
• Sitemap generating
• Tags and Categories

Blog Homepage Functionality

• On homepage the recent 4 blog posts display and Load More button displays older posts

Blog Post Functionality

• Breadcrumbs
• Comments displaying on blog posts after approval in Sanity Studio
• Form builder option within Rich Text Editor
• Gallery slider
• Option to add caption to images
• Option to add Similar/Recent posts on blog post
• Progress bar calculating reading post
• Read time calculation
• Sharing posts
• Sitewide settings in Sanity for Social Media, Site Title and Menu Data
• Sticky Navigation Headings
• Two Column Text option
• Videos embed

Getting Started

Project needs to run in Node Version 18. Install Next.JS with TailwindCSS

npx create-next-app@latest {project-name} --typescript --eslint

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying pages/index.tsx. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Learn More

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation - learn about Next.js features and API.
• Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Sanity Setup

Run the following command and run through the steps in the terminal:

yarn create sanity@latest

Setup Sanity initialization

Create ".env.local" in the root of the repository

You will need to add the following code:

NEXT_PUBLIC_SANITY_DATASET={value}
NEXT_PUBLIC_SANITY_PROJECT_ID={value}
NEXT_PUBLIC_SANITY_API_VERSION={value}
SANITY_API_READ_TOKEN={token}

When creating Sanity API Token, make sure the token has editor permissions set.