React GitHub API தெரியாம Profile Search பண்ணுறது கஷ்டமா? 😱 Secret 🔥 | API Project | Tamil
🔥 In this video, we build a complete GitHub Profile Finder using React + GitHub API + Responsive UI!
Perfect for beginners, portfolio projects, and anyone learning React in 2025.
Timestamps:
00:00 - Introduction and Project Overview (GitHub Search Functionality)
00:01:18 - Project Setup, Importing Styles, and HTML Structure (JSX)
00:02:47 - State Management (useState) and Input Validation
00:07:34 - Core Logic: Asynchronous API Fetch (async/await and try/catch)
00:12:16 - Rendering the User Profile Card (Avatar, Name, and Bio)
00:16:36 - Displaying Key Stats (Followers, Repos) and Profile Link
00:21:10 - Detailed Explanation of CSS Styling
00:24:39 - Final Demonstration and Conclusion
You’ll learn:
🔹 How to fetch data from the GitHub API
🔹 How to handle state, API errors, and loading
🔹 Building responsive UI in plain CSS
🔹 Writing clean React components
🔹 Creating a real-world project for your resume/portfolio
This is a step-by-step tutorial, fully beginner-friendly, and by the end you’ll have a fully working project that you can deploy or add to your GitHub.
🚀 What We Build in This Video:
✔ GitHub Username Search
✔ Fetch GitHub Profile Data
✔ Show Avatar, Name, Bio, Followers, Repos
✔ Error Handling (User not found)
✔ Clean & Responsive UI
✔ React Hooks (useState, useEffect)
✔ Full Source Code Included
📦 Source Code (React + Plain CSS)
👉 https://github.com/codewithaswin-yt/g...
🧠 Perfect For:
React beginners
Portfolio builders
Students preparing for interviews
Developers learning API integration
Anyone improving frontend skills
🔧 Technologies Used:
React JS
GitHub REST API
Fetch API
Plain CSS
Responsive Design
📢 Want More Projects?
Comment “More React Projects” if you want tutorials like:
⭐ Weather App
⭐ Movie Search App
⭐ Expense Tracker
⭐ Todo + LocalStorage
⭐ Chat App
🔔 Subscribe for Daily Coding Content
🚀 MERN | React | Node.js | Frontend Projects
🔥 Tips, Facts, & Daily Coding Motivation