added project

nirajxdev · nirajxdev · commit 5a17b5841f9c · 2025-11-29T23:53:32.000+05:30
diff --git a/10_github-profile/index.html b/10_github-profile/index.html
@@ -7,6 +7,15 @@
     <script src="https://cdn.tailwindcss.com"></script>
 </head>
 <body>
-    
+    <div class="container">
+        <h1>GitHub Profile Viewer</h1>
+        <form id="profileForm">
+            <input type="text" id="username" placeholder="Enter GitHub username" required>
+            <button type="submit">Search</button>
+        </form>
+        <div id="profileContainer" class="profile"></div>
+    </div>
+
+    <script src="script.js"></script>
 </body>
 </html>
diff --git a/10_github-profile/script.js b/10_github-profile/script.js
@@ -0,0 +1,35 @@
+document.getElementById('profileForm').addEventListener('submit', function(event) {
+    event.preventDefault();
+    const username = document.getElementById('username').value;
+    fetchGitHubProfile(username);
+});
+
+async function fetchGitHubProfile(username) {
+    const profileContainer = document.getElementById('profileContainer');
+    profileContainer.innerHTML = '';
+
+    try {
+        const response = await fetch(`https://api.github.com/users/${username}`);
+        if (!response.ok) throw new Error('Profile not found');
+
+        const profileData = await response.json();
+        displayProfile(profileData);
+    } catch (error) {
+        profileContainer.innerHTML = `<p>${error.message}</p>`;
+    }
+}
+
+function displayProfile(profile) {
+    const profileHTML = `
+        <img src="${profile.avatar_url}" alt="Avatar" class="avatar">
+        <div class="profile-info">
+            <h2>${profile.name}</h2>
+            <p><strong>Username:</strong> ${profile.login}</p>
+            <p><strong>Followers:</strong> ${profile.followers}</p>
+            <p><strong>Following:</strong> ${profile.following}</p>
+            <p><strong>Public Repos:</strong> ${profile.public_repos}</p>
+            <a href="${profile.html_url}" target="_blank">Visit Profile</a>
+        </div>
+    `;
+    document.getElementById('profileContainer').innerHTML = profileHTML;
+}
