Streamlit App to Showcase API Integration

This application was created as part of a programming workshop I’m conducting in collaboration with a non-profit organization dedicated to empowering underprivileged children through technology.

While this app is designed to be a simple, fun app, it is a practical demonstration of how similar concepts can be harnessed to develop real-world applications utilizing a wide range of API connections. In this particular project, we utilized the free tier provided by API Ninjas. API Ninja boasts an extensive collection of APIs spanning categories like Entertainment, Transportation, Healthcare, Finance, Places, Baby Names, and more.

A brief internet search will reveal a multitude of API providers who provide a wide range of opportunities with minimal exertion. The possibilities for innovation are limitless when you can access such a diverse selection of APIs.

API integration plays a crucial role in modern real applications:

Access to External Services: APIs allow applications to access external services, data, or functionality provided by third-party providers.

Data Exchange: APIs facilitate the seamless data exchange between different software systems, enabling them to work together cohesively.

Efficiency and Speed: Instead of reinventing the wheel, developers can leverage APIs to save time and effort.

Scalability: APIs make it easier to scale an application. As the application grows, you can integrate additional services or resources through APIs without major overhauls.

Cross-Platform Compatibility: APIs allow applications to run on different platforms, such as web, mobile, and desktop, while maintaining data consistency and functionality.

Cost Savings: Leveraging existing APIs can reduce development costs. It eliminates the need to build and maintain every component of an application from scratch.

Flexibility: APIs provide flexibility in choosing the best tools and services for specific tasks.

The main goal was to acquaint the participants with API integration, a vital aspect in creating applications that leverage Large Language Models (LLMs) from providers such as OpenAI, HuggingFace, and others, which we will delve into in upcoming sessions.

The App is hosted on “Streamlit Community Cloud.” You can try it here:

The app is divided into four parts:

1. Dad jokes

It generates a funny (almost!) random dad joke with a button click.

source: author

2. Riddles

It generates a random riddle to pick your brain.

source: author

3. Facts

Generates random facts.

source: author

4. Trivia

It generates trivia; most of it is news to me 😂

source: author

Under the hood, UI uses Streamlit components and makes HTTP API calls using requests the package.

The API offers a uniform and standardized interface at “https://api.api-ninjas.com/v1/{type} “ where “type” can be any of the following:dadajokes, facts, riddles, trivia

In each of the four types, the initial step involves invoking thefetch_data function, passing their respective type as an argument. Thefetch_data The function then Invokes the respective API end-point and returns the data in json the format.

Please be aware that to utilize API Ninja, you must acquire API KEY and include it in your HTTP request. For the free tier, which comes with limited usage, all that is required is to create a free account and generate the API Key:

def fetch_data(type):
    with st.spinner("Working..."):
        ### prepare API key and URL
        api_key = st.secrets["API_KEY"]
        api_url = f"https://api.api-ninjas.com/v1/{type}"

        ### invoke API and get the response
        response = requests.get(url=api_url, headers={"X-Api-Key": api_key})
        if response.status_code == requests.codes.ok:
            ### Convert data to JSON format
            data = jsonify(response)
            status = "OK"
        else:
            data = {"code": response.status_code, "message": response.text}
            status = "ERROR"
    return status, data

The returned data is then displayed to the user as a custom markdown element:

def display(text, font="sans-serif", color="white", size="25px"):
    st.markdown(
        f'<p style="font-family:{font}; color:{color}; font-size: {size};">{text}</p>',
        unsafe_allow_html=True,
    )

With the emergence of accessible open-source frameworks and user-friendly APIs, distributing your data applications to stakeholders has become effortless. There’s no longer a necessity to rely on cluttered Jupyter Notebooks for presentations. Instead, you can have your application or ML model expose API endpoints (using Flask/FastAPI), host it either internally or on cloud platforms like AWS, Azure, or GCP, and seamlessly connect them to a straightforward yet refined mobile friendly Streamlit/Reflex user interface. This approach streamlines the process.

For access to the complete source code, please visit the GitHub repo.

www.sunilssingh.me