WriterAI is a cutting-edge web application that harnesses the power of artificial intelligence to make content creation easier and faster. Whether you need to write emails, blogs, letters, or more, WriterAI is your go-to solution. In this guide, we’ll walk you through the setup process, explore its features, and provide some troubleshooting tips. So, let’s dive in!

Introduction to WriterAI

Imagine having a virtual writing assistant at your fingertips. With WriterAI, you simply provide a sample input of one to two lines, and the AI generates five different paragraphs for you! Developed by Ishant and Vaibhav during the #Hashnode x PlanetScale hackathon, WriterAI combines user-friendly interfaces and robust AI capabilities. It is not just about writing; you can also share projects and work collaboratively with your team.

Exploring WriterAI Features

• Auto Text Completion: Generates up to 120 words from just 5 input words.
• Inbuilt Text Editor: Perfect for writing blogs, emails, and other content.
• Project Sharing: Collaborate with an unlimited number of users.
• Markdown Support: Enhance your projects with images, tables, and hyperlinks.
• Project Download: Download projects in JSON, XML, and Markdown formats.
• User Authentication: Email-password and Gmail authentication supported.
• User Authorization: Auth tokens validated automatically every 5 minutes.

Setting Up WriterAI

Setting up WriterAI on your local machine can be done in just a few steps. For the frontend, follow the instructions below:

Frontend Setup

1. Clone the project from the repository.
2. Open your terminal in the project folder and run:

npm install

3. Create a new file named .env in the root folder of the project.
4. Within the .env file, input your Firebase API key and other credentials as follows:

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

5. Save the file and run npm start in both frontend and backend terminals to start the project.

Backend Setup

For backend setup, refer to the Backend Repository.

Understanding the Code: An Analogy

Think of the WriterAI application like a bakery.

1. Ingredients (Frontend): Just as a bakery needs quality ingredients (like flour, sugar, and eggs), WriterAI relies on technologies like ReactJS and MaterialUI to create the user interface that will be delightful and interactive.
2. Recipes (Backend): The backend is akin to the recipes in the bakery. Developed using Kotlin’s Ktor framework and backed by PlanetScale’s database, it ensures the correct preparation and storage of all her recipes (user data).
3. The Baker (AI): The AI is the experienced baker who uses these quality ingredients and recipes to whip up delicious treats (high-quality content). Just as the baker knows how to mix and bake, the AI knows how to consider user inputs and generate diverse content.

Troubleshooting Common Issues

If you encounter any issues during your setup, here are a few troubleshooting tips:

• Make sure you’ve installed all dependencies correctly. Run npm install again if needed.
• Verify that your .env file contains the correct API keys and is placed in the right folder.
• If you experience CORS errors, ensure that SSL is enabled on your domain.

For more insights, updates, or to collaborate on AI development projects, stay connected with fxis.ai.

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.

Want to Experience WriterAI?

You can explore the power of WriterAI by visiting the demo site and see it in action. Don’t forget to check out the video demo for a quick guide on how to use this fantastic tool!

Happy writing with WriterAI!