APIblok

logo
ui flow 1
ui flow 2
ui flow 7
ui flow 6
ui flow 3
ui flow 5
ui flow 8
ui flow 11
ui flow 4
ui flow 9
ui flow 10
ui flow 12

Inspiration

APIblok emerged from a real developer pain point that affects millions of programmers worldwide. As developers, we've all experienced the frustration of spending countless hours - sometimes even days - searching for the right API and then struggling to integrate it properly into our projects. The existing solutions were fragmented: documentation scattered across different platforms, generic help that doesn't consider your specific tech stack or experience level, and no intelligent assistance to guide you through the integration process. We envisioned a unified platform where developers could discover APIs effortlessly and get personalized, AI-powered assistance for seamless integration - transforming what used to take days into a matter of minutes.

What it does

APIblok is a comprehensive API discovery and integration platform designed to redefine how developers work with APIs.

It tackles two major pain points:

Finding the right API for your project.
Integrating it successfully and efficiently.

Key Features

Algolia-Powered Search: Lightning-fast API discovery with intelligent autocomplete, typo tolerance, and instant results.
AI Assistant (Google Gemini): Provides context-aware, personalized guidance tailored to your tech stack, experience level, and project goals.
Personalized Developer Experience: Whether you're a beginner or a seasoned engineer, APIblok adapts to your needs offering relevant insights every step of the way.

How we built it

We followed a strategic three-phase development process — Plan, Build, and Optimize.

Planning & Design

We began with user research and wireframing, crafting flows centered around the developer journey.

Frontend Development

Built using Next.js 15 for performance, SEO, and scalability.

Fully responsive design that adapts across all devices.

Content & Architecture Designed a flexible Storyblok CMS schema for structured, reusable API documentation.

Created an automated synchronization pipeline between Storyblok and Algolia, ensuring real-time search updates.

Integrated Google Gemini AI with custom prompt engineering for contextual, relevant responses.

Implemented a personalized onboarding system to tailor the AI experience for each user.

Challenges we ran into

Our journey was filled with technical hurdles that tested our creativity and teamwork.

Key Challenges:

Storyblok–Algolia Integration: Defining the optimal schema that balanced CMS flexibility with search performance.
Indexing Pipeline Issues: Managing large datasets and ensuring real-time synchronization without data loss.
Manual Data Entry Bottlenecks: The inability to import data via JSON slowed down workflows. A Storyblok import feature would drastically improve this process.
AI Relevance Control: Implementing strict filters to prevent off-topic responses and crafting effective prompts for various user experience levels.
Performance Optimization: Managing concurrent AI requests while maintaining React state stability to prevent duplicate keys and race conditions.

Accomplishments that we're proud of

We successfully delivered a fully functional MVP that demonstrates APIblok’s value proposition in action.

Highlights:

Lightning-fast API Search powered by Algolia with real-time autocomplete.
Context-aware AI Assistant that provides personalized, relevant guidance.
Automated Storyblok ↔ Algolia Sync for always up-to-date API data.
Personalization Engine that adapts responses based on onboarding data.
Intuitive, Responsive UI that makes API discovery and integration genuinely enjoyable.

What we learned

This project was a deep dive into modern software development and developer experience design.

We gained hands-on expertise in headless CMS architecture, learning to create flexible schemas that balance editorial needs with technical precision. Working with Algolia enhanced our understanding of advanced search features like typo tolerance, faceted filtering, and real-time indexing.

Integrating Gemini taught us the intricacies of prompt engineering, context management, and AI reliability. We also honed our skills in API design, synchronization, and complex data transformation.

Beyond the technical scope, we learned the importance of team collaboration, agile iteration, and maintaining a user-centered mindset—especially when building tools for developers.

What's next for APIblok

Our roadmap is focused on turning APIblok into the ultimate developer platform for API discovery and integration.

In the short term, we plan to expand our API database, improve categorization, and introduce advanced filtering options. We’re also developing IDE plugins for environments like VS Code, JetBrains, and Sublime Text, allowing developers to access APIblok directly within their workflow.

In the medium term, we’ll train a specialized AI model fine-tuned for API documentation and integration, delivering even more precise assistance. We’re also working on automatically generated video tutorials and interactive guides to make API integration more accessible through visual learning.

In the long term, we aim to build a community-driven ecosystem where developers can share integration examples and resources. Our vision includes a marketplace for premium API documentation and automated testing tools that simplify and verify API integrations end to end.

Built With

algolia
kendoreact
next.js
storyblok
vercel

Submitted to

Storyblok x Code and Coffee Hackathon 2025

Created by

I worked on this project as a frontend developer, mainly turning the design into real code so it could be used through the UI online. I also created the schema (model) in Storyblok, which was a bit challenging at first, but with support from my team, I was able to get it done successfully.

I helped integrate both Storyblok and Algolia into the app. The integration had its tricky moments, and there were challenges, especially in styling the UI, but through teamwork, we managed to make it work. I also contributed to the AI part of the project.

Through this experience, I learned a lot about integrating APIs, working with a headless CMS, and collaborating effectively with a team.

Ayomide Blessing Olofinsawe
Hi, I’m Ayomide, a web developer and technical writer
I contributed to the project as a UX/UI designer, working on the design system and visual design using Figma. I also deployed the application to Vercel for the first time, which was a great learning experience. Beyond design, I supported the team by organizing standups, ensuring smooth communication, and keeping everyone updated on progress.

Additionally, I helped set up the Storyblok account, integrated Algolia, and created a new project—both of which were first-time experiences for me.

Overall, the project was a valuable opportunity where I gained hands-on experience, learned new skills, and grew as both a designer and a team player. I’m excited to keep improving and applying these skills in the professional world.

Jeremiah Isijola
Popoola Temitope