Next Blog App

Description

Next Blog is a powerful blogging platform built with Next.js with typescript, utilizing Tailwind CSS for styling. It enables users to effortlessly create, publish, and share their thoughts with the world. Authentication is provided through Next Auth, supporting Google and GitHub login options. The backend is developed in Next.js, following a clean architecture model with providers, use cases, and repositories. Data persistence is managed using Prisma for MongoDB, ensuring a robust and scalable solution.

Features

• Effortless Blogging: Seamlessly create, publish, and share your thoughts.
• Authentication: Secure login via Google and GitHub authentication provided by Next Auth.
• Tailwind CSS: Utilizes Tailwind CSS for customizable and responsive styling.
• Image Upload: Easily upload images to your blog posts using Cloudinary.
• Toast Notifications: Utilizes Sonner for toast notifications to enhance user experience.
• Clean Architecture: Follows a modular and scalable architecture with providers, use cases, and repositories.
• Database Management: Prisma and MongoDB combination ensures efficient data storage and retrieval.

Built with

• Next.js: React framework for building server-side rendered React applications.
• TypeScript: A superset of JavaScript that adds static typing and other features to the language.
• Tailwind CSS: Utility-first CSS framework for rapid UI development.
• Cloudinary: Image and video management platform for uploading and storing media files.
• Next Auth: Authentication library for Next.js applications.
• Prisma: Modern database toolkit for TypeScript and Node.js.
• MongoDB: Scalable NoSQL database for storing blog data.
• Sonner: Toast notification library for enhancing user experience.

Usage

• Authentication: Log in to the platform using your Google or GitHub account to access all features and manage your blog effectively.
• Create Post: Create new blog posts by navigating to the "Create Post" section. Fill in the title, content, category, and optionally, attach images or links to enrich your post.
• Categorize Posts: Assign specific categories to your posts to organize them effectively. Choose from existing categories or create new ones to suit your content.
• Add Links and Images: Enhance your blog posts by embedding links and images within the content. Use the provided editor to easily add and format text, links, and images.
• Image Upload: To add an image to your blog post, use the image upload component provided in the UI. Images will be uploaded to Cloudinary, and the URLs will be stored along with your blog post.
• Update Post: Edit and update your existing blog posts by accessing the "Edit Post" feature. Make changes to the title, content, category, or attached media as needed.
• Delete Post: Remove unwanted or outdated blog posts from your platform using the "Delete Post" functionality. Exercise caution as this action is irreversible.
• Dashboard: Access your personal dashboard to view and manage your posts. From the dashboard, you can see a list of your own posts and perform actions like editing or deleting them.

Installation

1. Clone this repository:

   git clone https://github.com/MuhdHanish/next_blog_app.git
   

2. Navigate to the project directory:

   cd next_blog_app
   

3. Install dependencies by running: npm install or yarn install

4. Rename .env.example to .env and fill in the necessary environment variables.

5. Start the Server npm run dev or yarn dev

6. Access the application at http://localhost:3000.

Feedback

If you have any feedback, please reach me at muhammedhanish11@gmail.com or connect with me on LinkedIn.

Contributing

Contributions are welcome! If you'd like to contribute to this project, please follow these steps:

1. Fork this repository.
2. Create a new branch for your feature or bug fix.
3. Make your changes and commit them to your branch.
4. Push your changes to your forked repository.
5. Submit a pull request to the main repository.

Support

Show your support by 🌟 the project!!