Note: making functionality first
A dynamic and personalized blogging platform built with Next.js 14 using the App Router (no actions). Create and manage your blog posts stored as Markdown files (.md) within the posts
folder.
-
Dynamic Content: Blog posts are created as Markdown files in the
posts
folder, allowing easy content management. -
Metadata Extraction: Utilizing Gray-matter, extract metadata for each blog post, including title, author, date, and featured status.
-
Dynamic Routing: Next.js handles dynamic routing for individual blog posts via the
/posts/[slug]
route. Able to like/dislike, comment and reply posts. -
Listing Posts: Display featured posts on the home page, all posts on the all-posts page, and provide individual pages for each blog post.
-
React-Markdown: Render blog post content using React-Markdown, facilitating easy formatting with Markdown.
-
User Authentication: Implemented NextAuth for account creation with credentials, supporting secure login with email and password. Additionally, enable third-party authentication using GitHub and Google. User data is securely stored in the database.
-
Profile Management: Change your profile details to suit your liking - avatar, username, password...
-
See other profiles
-
Clone the Repository: Begin by cloning this repository to your local machine.
-
Install Dependencies: Execute
npm install
oryarn install
to install required dependencies. -
Create Blog Posts: In the
posts
folder, craft blog posts as.md
files. Define metadata at the top and then write content in Markdown. -
Run the Project: Use
npm run dev
oryarn dev
to launch the Next.js development server. -
Explore Your Blog: Open your web browser and visit
http://localhost:3000
to view and navigate your blog. Individual posts can be accessed at/posts/[slug]
.
- Next.js 14: React framework for server-side rendering and smooth navigation.
- TypeScript: Enhances code quality and developer productivity with static typing.
- Shadcn (UI elements): Modern React component library for a visually appealing interface.
- Tailwind CSS: Utility-first framework for responsive and consistent designs.
- MongoDB: NoSQL database for secure storage of user data.
- NextAuth: Authentication library for Next.js, supporting email/password and third-party logins.
- Markdown (Content storage): Lightweight syntax for managing blog post content.
-
License: This project is licensed under the MIT License - see the LICENSE file for details.
-
Privacy Policy: Read the Privacy Policy.
-
Terms of Service: View the Terms of Service.