🌟 GitHub User Cards

Welcome to the GitHub User Cards project! 🎉 In this project, you'll interact with the GitHub API to create dynamic social cards displaying user profiles. The goal is to practice working with APIs, promises, and DOM manipulation while having some fun! 🚀

🛠️ What You'll Practice

🖥️ JavaScript

• 🛠️ Building DOM components using JavaScript functions.
• 📦 Using 3rd-party libraries like Axios.
• 🤝 Understanding promises: .then & .catch.
• 🌐 Making HTTP GET requests.
• 📚 Utilizing array methods.

🌐 DOM

• 🖱️ Selecting elements.
• ✍️ Manipulating the DOM.
• 🎯 Handling events and event listeners.

---

🚀 Project Setup

⚙️ Setting Up the Project with Git

Follow these steps to set up your project and start coding:

1. 🍴 Fork this repository to your own GitHub account.

2. 📥 Clone your forked repository to your local machine. (Don't clone the original repo by mistake!)

   git clone <your-forked-repo-url>

3. 🌿 Create a new branch for your work:

   git checkout -b <your-first-name-last-name>

4. 💾 Commit your changes regularly as you progress.

   git add .
   git commit -m "Descriptive commit message"

5. 🔄 Push your changes to GitHub:

   git push origin <your-first-name-last-name>

📝 Completing the Project

1. Submit a Pull Request to merge your branch into main on your forked repository.
   👉 Note: Do not merge your own pull request! 😅
2. Await feedback and approval from your instructor. 📩

---

🧩 Project Tasks

🌐 Part 1: Request Data from the GitHub API

• 📝 Follow the instructions in the components/GithubCard.js file to send a GET request to the GitHub API.
  Use your GitHub username to start exploring the API data! 🌟

---

🛠️ Part 2: Create the Component Function

• 📊 Analyze the data returned by the API to understand its structure.
• 🔧 Use the data to dynamically create the HTML template provided in components/GithubCard.js.
• 🖼️ Add your card (based on your GitHub profile) to the DOM.

---

✨ Stretch Goals (Optional)

Feeling ambitious? 🧗‍♂️ Try these for extra practice:

1. 🤝 Retrieve your followers list from the API and programmatically create cards for each follower.
2. 🔄 Automate followers' cards creation: Programmatically fetch and display follower data.
3. 🔍 Expandable cards: Add a button to expand/collapse cards and include more user info.
4. 📈 GitHub Contribution Graph: Embed your GitHub contribution graph! Learn how here.

---

📝 Reminder

Only Parts 1 and 2 are required. Stretch goals are optional for additional practice—don’t stress if you can’t complete them! 💪

---

🚀 Happy Coding! ✨