NEW PROJECT – Logo Finder

Category: | Posted on:March 7, 2024
logo finder app

As part of my React API practice, I built a dirt simple Logo Finder using Clearbit’s Logo API. Simply enter a web domain, and the app will retrieve a logo image.


This is the third in a series of simple API fetching apps that I’ve built so far this year after the Public API’s List and the Open Library Search. The API for this one is definitely the simplest one yet, almost to a fault, but it did offer an opportunity to use the React 18 onError event for images.


I’ve been relying on Vite’s default project styles for all of these API projects for the sake of expedience, so the Logo Finder doesn’t look like much. There’s a state that catches the user’s input in the search field. That then gets injected into a src attribute to populate the image. If the user’s submission is not a valid domain, or the domain does not have an accessible logo, then the onError event triggers an error message to appear.

The API required attribution this time, so I tacked that on at the end. I didn’t realize it until after I had already uploaded it and started this log. I need to keep a better eye out for copyright requirements in the future.


The first issue with this was that the API was actually simpler than I needed it to be. It’s just an img src with some optional size and format parameters that can be tacked on the end. I didn’t even need to use fetch. I could probably build out some options for modifying those, but I don’t know that it would expose me to any concepts I haven’t used before.

The next issue was detecting whether the src state was a valid domain and prompting the user with an error message if not. I had trouble thinking of a way to test that before the src gets dumped into the img element and displays a broken image. I didn’t know that the onError event was an option so I fiddled with some ugly conditionals before relenting and looking it up. Glad to know there’s an elegant solution built into React.


I initially didn’t plan to do a full post on this project since it was so rudimentary. I kind of started building it before I realized how limited the options were going to be and just rolled on with it. In hindsight I did get a nugget of new knowledge out of it in the img event, and I should just commit to documenting everything anyway. It’s good for posterity and for my own absorption of what I’m learning.

Tags: ,

Related Logs

  • NEW PROJECT – Catholic Liturgical Date Checker

    May 29, 2024

    The Liturgical Date Checker project uses the Liturgical Calendar API to display information about Catholic Holy days. On page load it fetches info for today, tomorrow, and yesterday. It also has a search field that will return celebration info about a specific date. Objective This is just more basic API practice. I started this in […]

    Continue Reading
  • NEW PROJECT – Open Library Search

    February 25, 2024

    Added another API fetching project, Open Library Search. The app pings the Internet Archive‘s Open Library Search API to retrieve author, publication, purchase, and topic data for a user-provided book title. Objective My goal is to continue cranking out simple fetch projects until I can do them without relying on a crutch. I used my […]

    Continue Reading
  • UPDATE – Public APIs List Functionality

    February 15, 2024

    There are several new enhancements to the Public APIs List project. Hide CORS APIs I added a checkbox at the top that will filter out any APIs that require CORS headers in order to fetch them. It was the first additional feature that came to mind as I was evaluating the available keys in the […]

    Continue Reading