A sample react app with blogging functionality featuring user authentication and blog creation using Appwrite as a backend service.
-
Clone the repository:
git clone https://github.com/iHirenDev/CodersBlog.git cd CodersBlog
-
Install dependencies:
Make sure you have Node.js installed. Then, run:
npm install
-
Running the App:
To start the development server, run:
npm run dev
-
Set up an Appwrite server by following the Appwrite setup guide.
- Create a new project in Appwrite.
- Set up collections for users and blogs.
- Configure your
.env
file with Appwrite project details:
VITE_APPWRITE_URL=https://[YOUR_APPWRITE_ENDPOINT] VITE_APP_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]
Name | Description |
---|---|
Redux | A JS library for predictable and maintainable global state management. |
React Router | Declarative routing for React web applications. |
Appwrite | End-to-end backend server for Web, Mobile, Native, or Backend apps. |
Tailwind CSS | Tailwind CSS is a utility-first CSS framework for rapidly building modern websites without ever leaving your HTML. |
React Hook Form | Performant, flexible and extensible forms with easy-to-use validation. |
Tiny MCE | TinyMCE is the most advanced WYSIWYG HTML editor designed to simplify website content creation. |
Framer Motion | A production-ready motion library for React. |
For a complete list, see package.json.
- User registration and authentication
- Create, edit, and delete blog posts
- Theming using redux store
- Mobile device friendly responsive UI
- Rich Text Editor using Tiny MCE for user friendly content creation