https://github.com/prathampatel25/blogutopia

BlogUtopia
https://github.com/prathampatel25/blogutopia

Last synced: 4 months ago
JSON representation

BlogUtopia

• Host: GitHub
• URL: https://github.com/prathampatel25/blogutopia
• Owner: PrathamPatel25
• Created: 2024-12-20T03:58:57.000Z (7 months ago)
• Default Branch: main
• Last Pushed: 2024-12-29T11:55:31.000Z (6 months ago)
• Last Synced: 2024-12-29T12:28:07.033Z (6 months ago)
• Language: JavaScript
• Homepage: https://blog-utopia.vercel.app
• Size: 839 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


# 📝 BlogUtopia

[![Live Demo](https://img.shields.io/badge/demo-live-brightgreen.svg)](https://blog-utopia.vercel.app/)

[![React](https://img.shields.io/badge/react-%2320232a.svg?style=flat&logo=react&logoColor=%2361DAFB)](https://reactjs.org/)

[![Tailwind](https://img.shields.io/badge/tailwindcss-%2338B2AC.svg?style=flat&logo=tailwind-css&logoColor=white)](https://tailwindcss.com/)

[![Vite](https://img.shields.io/badge/vite-%23646CFF.svg?style=flat&logo=vite&logoColor=white)](https://vitejs.dev/)

[![Appwrite](https://img.shields.io/badge/Appwrite-%23F02E65.svg?style=flat&logo=Appwrite&logoColor=white)](https://appwrite.io/)

A modern, feature-rich blogging platform for creative minds

[Live Demo](https://blog-utopia.vercel.app/) | [Report Bug](https://github.com/PrathamPatel25/BlogUtopia/issues) | [Request Feature](https://github.com/PrathamPatel25/BlogUtopia/issues)



## ✨ Key Features

- 📝 **Rich Text Editor** powered by React Quill for immersive content creation

- 🎨 **Modern UI/UX** with responsive design and smooth animations

- 🔐 **Secure Authentication** via Appwrite

- 🌓 **Dark/Light Mode** for comfortable reading

- 📱 **Mobile-First Design** with full responsiveness

- ⚡ **Lightning Fast** performance with Vite

- 🔄 **Real-time Updates** with Redux state management

- 🖼️ **Image Upload** with drag-and-drop support

- 📊 **User Dashboard** for content management

## 🛠️ Tech Stack

### Frontend Architecture

```

React

└── State Management

    ├── Redux Toolkit

    └── React Hook Form

└── Routing

    └── React Router DOM v7

└── UI Components

    ├── React Quill (Rich Text Editor)

    ├── GSAP (Animations)

    └── Lucide React (Icons)

└── Styling

    └── Tailwind CSS

```

### Backend Services

```

Appwrite

└── Authentication

└── Database

└── Storage

└── File Management

```

## 🚀 Quick Start

### Prerequisites

- Node.js (v16 or higher)

- npm or yarn

- Git

### Installation & Setup

1. **Clone the repository**

   ```bash

   git clone https://github.com/PrathamPatel25/BlogUtopia.git

   cd BlogUtopia

   ```

2. **Install dependencies**

   ```bash

   npm install

   ```

3. **Environment Configuration**

   Create a `.env` file:

   ```env

   VITE_APPWRITE_URL=your_appwrite_url

   VITE_APPWRITE_PROJECT_ID=your_project_id

   VITE_APPWRITE_DATABASE_ID=your_database_id

   VITE_APPWRITE_COLLECTION_ID=your_collection_id

   VITE_APPWRITE_BUCKET_ID=your_bucket_id

   ```

4. **Start development server**

   ```bash

   npm run dev

   ```

## 📱 Features Overview

### For Readers

- Intuitive navigation

- Responsive reading experience

- Social sharing options

### For Writers

- Rich text editing

- Image upload and management

## 👨‍💻 Author

**Pratham Patel**

- LinkedIn: [Pratham Patel](https://www.linkedin.com/in/pratham-patel-0920-/)

- GitHub: [@PrathamPatel25](https://github.com/PrathamPatel25)

## 🙏 Acknowledgments

- [React Quill](https://github.com/zenoamaro/react-quill)

- [Appwrite](https://appwrite.io/)

- [GSAP](https://greensock.com/gsap/)

- [Tailwind CSS](https://tailwindcss.com/)

---



If you find BlogUtopia helpful, please consider giving it a ⭐️!