https://github.com/falgunmpatel/rapid-write

A Blogging Website (React + Appwrite)
https://github.com/falgunmpatel/rapid-write

appwrite javascript react reacthookform tinymce

Last synced: about 1 month ago
JSON representation

A Blogging Website (React + Appwrite)

Host: GitHub
URL: https://github.com/falgunmpatel/rapid-write
Owner: falgunmpatel
License: mit
Created: 2024-04-26T14:18:55.000Z (about 2 years ago)
Default Branch: main
Last Pushed: 2024-06-13T14:36:54.000Z (almost 2 years ago)
Last Synced: 2025-07-06T01:36:36.383Z (11 months ago)
Topics: appwrite, javascript, react, reacthookform, tinymce
Language: JavaScript
Homepage: https://rapid-write-kappa.vercel.app
Size: 11.3 MB
Stars: 2
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

          

[![Contributors][contributors-shield]][contributors-url]

[![Forks][forks-shield]][forks-url]

[![Stargazers][stars-shield]][stars-url]

[![Issues][issues-shield]][issues-url]

[![MIT License][license-shield]][license-url]

[![LinkedIn][linkedin-shield]][linkedin-url]






  

    

  



  Table of Contents

  


    

      About The Project

      

        Demo Credentials

      

      

        Built With

      

    

    

      Getting Started

      

        Prerequisites

        Installation

      

    

    Contributing

    License

    Contact

    Acknowledgments

  




## About The Project

### 🚀 Rapid Write 📝

Rapid Write is a dynamic blogging website meticulously crafted with React for the frontend and Appwrite for the backend, offering a seamless and intuitive experience for bloggers and readers alike. With a focus on speed, efficiency, and functionality, Rapid Write leverages cutting-edge technologies such as react-hook-forms and TinyMCE Editor to provide users with a smooth and hassle-free writing experience.

🔑 Key Features

* User Authentication: Seamlessly manage user accounts with features for login, signup, and logout.

* Effortless Blogging: Create, edit, and delete posts with ease, all within an intuitive user interface.

* Streamlined Content Management: View all user posts or filter to see only your own, ensuring efficient content organization.

* State-of-the-Art State Management: Utilize Redux Toolkit for robust state management, ensuring optimal performance and scalability.

* Modular Component Architecture: Benefit from a well-organized and scalable codebase, enhancing maintainability and extensibility.

* And More: Explore additional features designed to enhance your blogging experience.

(back to top)




### 🪪 Demo Credentials

username: one@one.com

password = password

(back to top)




### 💻 Technologies Used

Frontend: React, react-hook-forms, TinyMCE Editor

Backend: Appwrite

State Management: Redux Toolkit

(back to top)


### Screenshots: 

  

   Home Page - All Users Posts

  

   User's Posts

  

  Other User's Post

  

  User's Post - Edit/Delete Option

  

   Login Form

  

   Signup Form

  

   Post Form



## Getting Started



### Prerequisites

Basic knowledge of **React** is required to setup this project.

Download latest version of npm here:

* npm

 ```sh

  npm install npm@latest

  ```

**NOTE**: I use npm version @10.1.0 while creating this project



### Installation

1. Signup/Login @[Appwrite](https://appwrite.io/)

2. Setup an Appwrite Project.

    Appwrite Project Setup:

    1. Signup/Login to your appwrite account.

    2. Create a new project with desired title & region.

    3. Project -> Settings -> **Copy Project ID, and Api Endpoint** 

    4. Project -> Database Section -> Create Database -> **Copy Database Id** -> Create Collection -> **Copy Colection Id**

    5. Project -> Database -> Collection -> Settings -> **Update Permissions** -> Add a role -> All Users -> **Check all (Create, Read, Update, Delete)**

    6. Inside the created collention -> Attributes -> Create Attribute ->

      i. title -> String -> required

      ii. content -> String -> required

      iii. featuredImage -> String -> required

      iv. status -> String -> required

      v. userId -> String -> required 

    7. Project -> Storage Section -> Create Bucket -> **Copy Bucket Id** -> Required for setting up .env

    8. Project -> Storage -> Bucket -> Settings ->  **Update Permissions** -> Add a role -> All Users -> **Check all (Create, Read, Update, Delete)**

3. Create/Login TinyMCE Account -> Copy your API KEY -> Required for setting up .env

4. Clone the repo

   ```sh

   git clone https://github.com/falgunmpatel/rapid-write

   ```

5. Install NPM packages

   ```sh

   npm install

   ```

6. Create a .env file in the root directory of the project and add following content to it

    ```.env.sample

      VITE_APPWRITE_URL= "Your Apprite Project Api Endpoint"

      VITE_APPWRITE_PROJECT_ID="Your Apprite Project PROJECT ID"

      VITE_APPWRITE_DATABASE_ID="Your Apprite Project DATABASE ID"

      VITE_APPWRITE_COLLECTION_ID="Your Apprite Project COLLECTION ID"

      VITE_APPWRITE_BUCKET_ID="Your Apprite Project BUCKET ID"

      VITE_TINYMCE_API_KEY="Your TinyMCE API KEY"

    ```

7. Run the project by runnint the following command in the root directory of the project

    ```sh

      npm run dev

    ```

(back to top)




## Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".

Don't forget to give the project a star! Thanks again!

1. Fork the Project

2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)

3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)

4. Push to the Branch (`git push origin feature/AmazingFeature`)

5. Open a Pull Request

(back to top)




## License

Distributed under the MIT License. See `LICENSE.txt` for more information.

(back to top)




## Contact

Name - Falgun Patel

Email - falgunmpatel9123@gmail.com

Project Link: [rapid-write](https://github.com/falgunmpatel/rapid-write)

(back to top)




## Acknowledgments

  1. **React Playlist** @[ChaiAurCode](https://www.youtube.com/@chaiaurcode) 


      **Mentor**: [Hitesh Choudhary](https://github.com/hiteshchoudhary)

  2. **Backend**: Docs @[Appwrite](https://appwrite.io/) 

  3. **Frontend**: Docs @[React](https://react.dev/)

  4. **Forms**: Docs @[React-Hook-Forms](https://react-hook-form.com/)

  5. **Editor for Creting Posts** : Docs @[TinyMCE](https://www.tiny.cloud/)

  6. **Toolchain/Bundler**: Docs @[Vite](https://vitejs.dev/guide/)

(back to top)


[contributors-shield]: https://img.shields.io/github/contributors/falgunmpatel/rapid-write.svg?style=for-the-badge

[contributors-url]: https://github.com/falgunmpatel/rapid-write/graphs/contributors

[forks-shield]: https://img.shields.io/github/forks/falgunmpatel/rapid-write.svg?style=for-the-badge

[forks-url]: https://github.com/falgunmpatel/rapid-write/network/members

[stars-shield]: https://img.shields.io/github/stars/falgunmpatel/rapid-write.svg?style=for-the-badge

[stars-url]: https://github.com/falgunmpatel/rapid-write/stargazers

[issues-shield]: https://img.shields.io/github/issues/falgunmpatel/rapid-write.svg?style=for-the-badge

[issues-url]: https://github.com/falgunmpatel/rapid-write/issues

[license-shield]: https://img.shields.io/github/license/falgunmpatel/rapid-write.svg?style=for-the-badge

[license-url]: https://github.com/falgunmpatel/rapid-write/blob/master/LICENSE

[linkedin-shield]: https://img.shields.io/badge/-LinkedIn-black.svg?style=for-the-badge&logo=linkedin&colorB=555

[linkedin-url]: https://linkedin.com/in/falgunmpatel

ecosyste.ms

Data

Tools

Indexes

Applications

Experiments

Awesome

https://github.com/falgunmpatel/rapid-write

Awesome Lists containing this project

README