Building an Ai SaaS with MindsDB, GPT4, and React: SmartFeed.ai

Building an Ai SaaS with MindsDB, GPT4, and React: SmartFeed.ai

SmartFeed.Ai: the Future of Reading Online.

ยท

5 min read

I started building my open-source SaaS MVP called SmartFeedAi a week ago. Unaware of machine learning platforms like MindsDB, I started coding with React and Flask, excited to leverage Python's powerful machine learning libraries in the backend. But as I started building, I realized the challenges that MLOps professionals and developers who build machine learning apps for production face (more on that later).

When I discovered MindsDB on Twitter, I knew it was the solution my app needed. However, by the time I became aware of MindsDB and MindsDB hackathon, only 7 days remained until the end of the hackathon. I decided to scrap my Flask backend completely and use Express.js with MindsDB instead (even though I was unfamiliar with it at the time). It was really a race against time for me, but I got to learn so much and I'm excited to share my story, product, and learnings with all of you! ๐Ÿš€

๐Ÿ“– The App Idea (and Future of Content)

There is a lot of fear-mongering on Twitter that the rise of generative AI will lead to a decline in human-generated content. I don't think so. On the contrary, I see AI as an opportunity to revolutionize the way we consume content.

Introducing SmartFeed.ai ๐Ÿš€, the ultimate solution to help you browse through online content efficiently! Here's a quick Demo video:

With the MVP version of SmartFeed.ai, you can easily generate short summaries of articles from just a URL using the powerful MindsDB NLP engine.

The MVP has minimal features due to the time constraints of the hackathon but the potential and vision of SmartFeedai are immense. AI has the power to change and improve the way people consume content, and SmartFeedai is at the forefront of this revolution. As SmartFeedai continues to evolve, I believe it will become an essential tool for anyone who wants to stay informed and up-to-date in today's fast-paced world.

๐Ÿ”ฉ How does it work?

  • SmartFeed.ai uses MindsDB for GPT-4 model that can perform NLP tasks. MindsDB makes it easy for developers of all skill levels to integrate AI into their applications by automating and integrating top machine learning frameworks (including GPT-4) into the data stack as "AI Tables". This innovative approach allows you to train and use models directly with your database, speeding up the development process.

  • For the backend API, I chose to use Express.js, a flexible and minimalistic web framework for Node.js. It allowed me to quickly and easily set up the endpoints I needed to make requests and retrieve data from the server.

  • To extract data from web pages, I turned to Cheerio, a fast and efficient library for web scraping in Node.js. With Cheerio, I was able to parse the HTML content of websites and extract the specific data I needed, which was essential for my project's functionality.

  • I used React for the frontend of my project due to its component-based architecture and virtual DOM, which allowed for a dynamic and responsive user interface.

  • Finally, I used mindsdb-js-sdk to access MindsDB Cloud's GPT-4 model. MindsDB Cloud is an excellent platform for training and using machine learning models without the need for extensive infrastructure setup. The SDK allowed me to connect to the MindsDB Cloud API and use the models for my project's predictions.

๐Ÿ’ป How to Use SmartFeed.ai?

  1. Create a MindsDB cloud account - you can get your free account here. It's going to allow us to train a Machine Learning model in minutes!!

  2. We will use the MindsDB cloud editor to create a GPT-4 model that can take long text, understand it and provide a summary based on the given prompt. Here are the SQL commands you have to enter to create the model which will use:

     CREATE MODEL text_summary
     PREDICT text_summary
     USING
         engine = 'openai',
         model_name = 'gpt-4',
         input_column = 'text_long',
         max_tokens = 200,
         prompt_template = 'Summarize the following text, but only enough to inspire intrigue. text:{{text_long}}';
    

    Notice how I have used the prompt in the prompt_template property, feel free to use your own prompts based on what kind of response you want from your AI reading assistant ;)

  3. After pasting the above code into the MindsDB cloud editor, click > Run to execute the query and wait for the model to be trained and ready to use.

  4. Clone the Smartfeedai repository:

     git clone https://github.com/avionmission/
    
  5. To run the backend, run this command (use the email and password of your MindsDB cloud account):

     cd smartfeedai/api
     MINDSDB_USER=<email> MINDSDB_PASS=<password> npm start
    
  6. To run the React Frontend, run:

     cd smartfeedai
     npm start
    
  7. That's it! ๐ŸŽ‰๐ŸŽ‰ Now you can use SmartFeed.ai on your localhost port 3000.

๐Ÿ‚Conclusion

In conclusion, SmartFeed.ai is a solution that has the potential to change the way we consume online content. This was made possible with the power of MindsDB and its integration of top machine learning frameworks, such as GPT-4, making it accessible to developers of all skill levels. As SmartFeed.ai continues to evolve, it has the potential to become an essential tool for anyone who wants to stay informed and up-to-date in today's fast-paced world.

I am happy about the partnership between Hashnode and MindsDB that brought about this incredible hackathon. The event was a great opportunity to learn about machine learning tech and expand my skill set.

I highly recommend checking out their official documentation and joining their Slack community. Start building your machine learning projects today by creating a free account on MindsDB Cloud and taking advantage of the incredible tools available to you. Thank you again for this opportunity! ๐Ÿš€๐Ÿ™Œ๐Ÿผ๐Ÿค–

ย