Skip to content

A Mega Blog Project build using React, Redux Toolkit(RTK) and appwrite as backend.

License

Notifications You must be signed in to change notification settings

Vrighu/ApneVichar

Repository files navigation

Mega Blog

Welcome to the GitHub repository for the Mega Blog App! This repository contains the source code for a powerful blogging platform equipped with essential features like user authentication, post management, and content creation. It utilizes Appwrite as the backend service for managing the database and storage operations.

image

Introduction

Mega Blog is a full-fledged blog application built with React.js that offers the following features:

  • User Management:

    • Users can register for new accounts using a signup form with validation (powered by React Hook Form).

    • image

    • Existing users can log in securely using Appwrite for authentication.

    • image

    • Users can log out seamlessly, clearing authentication tokens.

  • Post Creation:

    • Authorized users can create new blog posts, crafting content with ease using a rich text editor (like TinyMCE).

    • image

    • Post data is stored securely in Appwrite's database.

  • Post Listing:

    • A clear and organized list displays all published blog posts.
    • Each post showcases the title, author, and a snippet of the content.
    • Consider implementing pagination or sorting for extensive post management (optional).
    • image
  • Update Post:

    • Users can update their existing post if the same user that is Logged in and have their own post.

    • User can also delete their own post.

    • image

    • image

  • Route Management:

    • The application leverages react-router-dom for efficient routing between different sections.
    • Specific routes handle authentication (login, logout), post creation, and post listing.

Tech Stack

  • Frontend: React.js
  • Form Handling: React Hook Form
  • Rich Text Editor: TinyMCE (or similar)
  • State Management: Redux with react-redux
  • Routing: react-router-dom
  • Backend: Appwrite (for database, storage, and authentication)

Deployment & Repository

Installation

  1. Clone the repository: git clone https://github.com/Vrighu/ApneVichar.git

  2. Navigate to the project directory: cd mega-blog

  3. Install dependencies: npm install

  4. Running the Development Server : npm run dev

  5. Access the application in your browser at http://localhost:5173 (or the port specified in package.json).

Appwrite Configuration

  • Create an Appwrite account and project at https://appwrite.io.

  • Obtain your project's endpoint URL, project ID, and API key.

  • Create a .env file at the project root and add the following environment variables, replacing placeholders with your actual values:

    1. VITE_APPWRITE_URL=""
    2. VITE_APPWRITE_PROJECT_ID=""
    3. VITE_APPWRITE_DATABASE_ID=""
    4. VITE_APPWRITE_COLLECTION_ID=""
    5. VITE_APPWRITE_BUCKET_ID=""
    6. VITE_TINY_EDITOR_API_KEY=""

About

A Mega Blog Project build using React, Redux Toolkit(RTK) and appwrite as backend.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published