🔍 GitHub Profile Finder – Built with Bolt

What followed was an exciting and seamless experience of building this project with the Bolt template.

🚀 Project Overview

I built a GitHub Profile Finder—a sleek, responsive, and fully functional web app that allows users to search for any GitHub username and instantly view their public profile details including:

• Name


• Bio


• Avatar


• Followers & Following count


• Repositories


• Location


• Company


• And more!

All of this is powered by the GitHub REST API.

📁 Project Structure

Here’s a peek at the file structure that kept things modular and scalable:

├── public/

│   └── vite.svg                    # Vite logo

├── src/

│   ├── components/                 # React components

│   │   ├── ErrorMessage.tsx        # Error display component

│   │   ├── LoadingSpinner.tsx      # Loading animation component

│   │   ├── SearchForm.tsx          # User search form

│   │   └── UserProfile.tsx         # User profile display

│   ├── services/                   # API services

│   │   └── githubApi.ts            # GitHub API integration

│   ├── types/                      # TypeScript type definitions

│   │   └── github.ts               # GitHub user interface

│   ├── App.tsx                     # Main application component

│   ├── index.css                   # Global styles (Tailwind imports)

│   ├── main.tsx                    # Application entry point

│   └── vite-env.d.ts               # Vite type definitions

├── index.html                      # HTML template

├── package.json                    # Dependencies and scripts

├── tailwind.config.js              # Tailwind CSS configuration

├── tsconfig.json                   # TypeScript configuration

├── vite.config.ts                  # Vite configuration

└── README.md                       # Project documentation

✨ Features

✅ Live search for any GitHub username

✅ Error handling for invalid users

✅ Clean, responsive UI with Tailwind CSS

✅ Loading spinner during API fetch

✅ Modular file structure

🧠 Challenges & Breakthroughs

While using Bolt, the AI model itself worked smoothly, but I did face a few friction points on the platform side:

🛑 Google Sign-In Issues: I tried signing up with Google twice, but both attempts failed. Eventually, I had to use my GitHub account to get started.

👻 Browser Extension Glitches:While AI was generating my project, my Phantom and MetaMask Chrome extensions kept popping up repeatedly—even though I wasn’t interacting with them at all. It disrupted the experience a bit. It might be that this error was due to my browser. Don't know.

These small bugs aside, once I was inside the workspace, everything worked as expected, and I was able to build and deploy my app with ease using github and netlify.

🧩 Favorite Bolt Features

Bolt made it effortless to get started:

🔥 Vite + React + TS combo out of the box

🎨 Tailwind pre-configured

✅ ESLint and TypeScript ready

🧹 Clean file organization

It saved hours of setup time and let me focus purely on building.

💻 Code Highlight: GitHub API Integration

// src/services/githubApi.ts

import { GitHubUser } from '../types/github';



export const fetchGitHubUser = async (username: string): Promise<GitHubUser> => {

  const response = await fetch(`https://api.github.com/users/${username}`);



  if (!response.ok) {

    if (response.status === 404) {

      throw new Error('User not found. Please check the username and try again.');

    } else if (response.status === 403) {

      throw new Error('API rate limit exceeded. Please try again later.');

    } else {

      throw new Error('Failed to fetch user data. Please try again.');

    }

  }



  return response.json();

};

👥 Team

This was an individual submission, but shoutout to the DEV and Bolt teams for making this possible! 🙌

📸 Preview

Here’s what the final product looks like:

👉 Live Demo: https://github-profile-finderapp.netlify.app/

❤️ Final Thoughts

Despite minor friction during onboarding, building with Bolt was overall an exciting and smooth experience. I was able to go from idea to deployment in just a few hours—exactly what a hackathon platform should offer.

Thanks for reading and happy building! ⚡