https://github.com/kshiti-24/blog-website
A Mega Blog Project build using React, Redux Toolkit(RTK) and Appwrite as backend.
https://github.com/kshiti-24/blog-website
appwrite react react-hooks react-router reactjs reactrouterdom redux redux-toolkit vite
Last synced: 2 months ago
JSON representation
A Mega Blog Project build using React, Redux Toolkit(RTK) and Appwrite as backend.
- Host: GitHub
- URL: https://github.com/kshiti-24/blog-website
- Owner: Kshiti-24
- Created: 2024-07-03T20:06:33.000Z (10 months ago)
- Default Branch: main
- Last Pushed: 2024-07-14T10:56:39.000Z (10 months ago)
- Last Synced: 2025-01-10T12:28:11.740Z (4 months ago)
- Topics: appwrite, react, react-hooks, react-router, reactjs, reactrouterdom, redux, redux-toolkit, vite
- Language: JavaScript
- Homepage: https://blog-app-fawn-eta.vercel.app
- Size: 67.4 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Blog Website (React + VITE)
**Blog Website** is a feature-rich React application designed to provide a seamless blogging experience. This repository houses the source code for Blog Website, a powerful platform offering user authentication, secure signup, login functionalities, and CRUD operations for creating, editing, and deleting blog posts.
## Sign-up Page
## All Post Page
## Add Post Page
## Post Page
## Edit Post Page
## Features
- **Register**: New users can sign up to create an account.
- **Login**: Registered users can log in to access their account.
- **Show Others' Posts**: Users can view posts made by other users.
- **Add Post**: Users can create and publish new blog posts.
- **Delete Post**: Users can delete their own posts.
- **Like Post**: Users can like posts to show appreciation.
- **Comment on Post**: Users can leave comments on posts.
- **View User Profile**: Users can view their profile and other users profiles.
- **Logout**: Users can log out of their account.
## Technologies Used
- **React**: A JavaScript library for building user interfaces.
- **Redux**: A state management library for JavaScript apps.
- **Appwrite**: An open-source backend server.
- **TailwindCSS**: A utility-first CSS framework for rapid UI development.
- **Vite**: A fast front-end build tool.
- **Vercel**: A platform for frontend developers, providing global deployment.
## Getting Started
### Prerequisites
Ensure you have the following installed on your local machine:
- Node.js
- npm (Node Package Manager)
- Appwrite backend setup
### Installation
1. Clone the repository:
```bash
git clone https://github.com/yourusername/blog-website.git
cd blog-website
```
2. Install dependencies:
```bash
npm install
```
3. Provide necessary environment variables to run the app properly:
```bash
VITE_APPWRITE_URL='YOUR_APPWRITE_URL'
VITE_APPWRITE_PROJECT_ID='YOUR_APPWRITE_PROJECT_ID'
VITE_APPWRITE_DATABASE_ID='YOUR_APPWRITE_DATABASE_ID'
VITE_APPWRITE_COLLECTION_ID='YOUR_APPWRITE_COLLECTION_ID'
VITE_APPWRITE_FEEDBACK_COLLECTION_ID='YOUR_APPWRITE_FEEDBACK_COLLECTION_ID'
VITE_APPWRITE_BUCKET_ID='YOUR_APPWRITE_BUCKET_ID'
VITE_APPWRITE_API_KEY='YOUR_APPWRITE_API_KEY'
VITE_TINYMCE_API_KEY='YOUR_TINYMCE_API_KEY'
VITE_EMAILVERIFICATION_URL='YOUR_EMAILVERIFICATION_URL'
```
4. Run the app:
```bash
npm run dev
```
5. Open your browser and navigate to:
```
http://localhost:3000
```