Are you tired of spending hours crafting emails, blogs, or letters? Meet WriterAI, an AI-based content writing tool that empowers you to produce high-quality content in a flash! Developed by Team 404 for the Hashnode x PlanetScale hackathon, WriterAI is your go-to solution for efficient writing.
What is WriterAI?
WriterAI is a web application that leverages artificial intelligence to generate top-notch content. By merely providing a one-to-two line input, you can receive up to five unique paragraphs in return. It’s like having your very own writing assistant, always ready to help!
Key Features of WriterAI
- Auto Text Completion: Produces up to 120 words with a mere 5-word input.
- Inbuilt Text Editor: Tailor your blogs, emails, and letters all in one place.
- Project Sharing: Collaborate with unlimited users on any project.
- Markdown Support: Easily incorporate images, tables, and code snippets.
- Project Download: Download your work in various formats, including JSON and Markdown.
- User Authentication: Secure login via email/password or Gmail.
- User Authorization: Regular validation of user authentication tokens.
Getting Started with WriterAI
To set up WriterAI on your local machine, follow these steps:
1. Clone the Project
Use Git to clone the project repository to your local machine. Open your terminal and run:
git clone [repository-link]
2. Install Dependencies
Navigate to the project folder and run the following command:
npm install
3. Configure Environment Variables
Create a file named .env in the project root and input the necessary API keys:
REACT_APP_FIREBASE_API_KEY=XXXXXXXX
REACT_APP_FIREBASE_AUTH_DOMAIN=XXXXXXXX
REACT_APP_FIREBASE_PROJECT_ID=XXXXXXXX
REACT_APP_FIREBASE_STORAGE_BUCKET=XXXXXXXX
REACT_APP_FIREBASE_MESSAGING_SENDER_ID=XXXXXXXX
REACT_APP_FIREBASE_APP_ID=XXXXXXXX
REACT_APP_FIREBASE_MEASUREMENT_ID=XXXXXXXX
REACT_APP_AI_API_KEY=XXXXXXXX
REACT_APP_BASE_URL=XXXXXXXX
Don’t forget to replace the placeholders with the actual values obtained from your Firebase and OpenAI accounts!
4. Run the Project
Start the backend and frontend servers:
npm start
Understanding the Code: An Analogy
Think of WriterAI’s codebase like a well-orchestrated symphony:
- Frontend (Conductor): This is where all the magic begins, guiding the user experience with the elegance of ReactJS.
- Backend (Cello Section): This is the backbone ensuring everything runs smoothly, managed by Ktor and Firebase.
- Database (Strings Section): Like skilled musicians, your data is stored securely with PlanetScale, ensuring harmony and scalability.
Troubleshooting Common Issues
If you encounter any issues while setting up WriterAI, here are a few troubleshooting tips:
- Double-check your environment variables to ensure values are correctly entered.
- Make sure you’ve enabled the proper APIs in Firebase.
- If you face CORS issues, verify your domain and SSL configurations.
For more insights, updates, or to collaborate on AI development projects, stay connected with fxis.ai.
More Resources
To dive deeper into the project, refer to these resources:
Final Thoughts
At fxis.ai, we believe that such advancements are crucial for the future of AI, as they enable more comprehensive and effective solutions. Our team is continually exploring new methodologies to push the envelope in artificial intelligence, ensuring that our clients benefit from the latest technological innovations.

