diff --git a/GitHubCard/index.js b/GitHubCard/index.js
index 9423d23af..eec19b0bb 100644
--- a/GitHubCard/index.js
+++ b/GitHubCard/index.js
@@ -1,9 +1,11 @@
+import axios from "axios";
 /*
   STEP 1: using axios, send a GET request to the following URL
     (replacing the placeholder with your Github name):
     https://api.github.com/users/<your name>
 */
 
+
 /*
   STEP 2: Inspect and study the data coming back, this is YOUR
     github info! You will need to understand the structure of this
@@ -28,7 +30,87 @@
     user, and adding that card to the DOM.
 */
 
-const followersArray = [];
+const friendsArray = [
+  'tetondan',
+  'dustinmyers',
+  'justsml',
+  'luishrd',
+  'bigknell'
+];
+
+function gitCards (data) {
+
+const gitCard = document.createElement('div');
+const gitImg = document.createElement('img');
+const gitCardInfo = document.createElement('div');
+const gitName = document.createElement('h3');
+const gitUsername = document.createElement('p');
+const gitLocation =  document.createElement('p');
+const gitProfile = document.createElement('p');
+const gitProfLink = document.createElement('a');
+const gitFollowers = document.createElement('p');
+const gitFollowing = document.createElement('p');
+const gitBio = document.createElement('p');
+
+gitCard.appendChild(gitImg);
+gitCard.appendChild(gitCardInfo);
+gitCardInfo.appendChild(gitName);
+gitCardInfo.appendChild(gitUsername);
+gitCardInfo.appendChild(gitLocation);
+gitCardInfo.appendChild(gitProfile);
+gitProfile.appendChild(gitProfLink);
+gitCardInfo.appendChild(gitFollowers);
+gitCardInfo.appendChild(gitFollowing);
+gitCardInfo.appendChild(gitBio);
+
+gitCard.classList.add('card');
+gitCardInfo.classList.add('card-info');
+gitName.classList.add('name');
+gitUsername.classList.add('username');
+
+gitImg.src = data.avatar_url;
+gitName.textContent = data.name;
+gitUsername.textContent = data.login;
+gitLocation.textContent = `Location: ${data.location}`;
+gitProfLink.href = data.html_url;
+gitProfLink.textContent = data.html_url;
+gitFollowers.textContent = `Followers: ${data.followers}`;
+gitFollowing.textContent = `Following: ${data.following}`;
+gitBio.textContent = `Bio: ${data.bio}`;
+
+return gitCard
+}
+
+// function gitAviance(selector){
+//   const entryPoint = document.querySelector(selector)
+//   axios.get('https://api.github.com/users/avianceobie')
+//   .then(res => {
+//     console.log(res.data)
+//     entryPoint.appendChild(gitCards(res.data))
+//   })
+//   .catch(err => {
+//     console.error(err)
+//   })
+// }
+
+// gitAviance('.cards')
+
+function gitCardsMaker(selector, array){
+  const entryPoint = document.querySelector(selector)
+  array.forEach(user => { 
+  axios.get(`https://api.github.com/users/${user}`)
+  .then(res => {
+    console.log(res.data)
+    entryPoint.appendChild(gitCards(res.data))
+  })
+  .catch(err => {
+    console.error(err)
+  })
+})
+}
+
+gitCardsMaker('.cards', friendsArray)
+
 
 /*
   STEP 3: Create a function that accepts a single object as its only argument.
diff --git a/package-lock.json b/package-lock.json
index 09ae31ca5..9aedbc81d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,9 @@
       "name": "github-usercard",
       "version": "1.0.0",
       "license": "ISC",
+      "dependencies": {
+        "axios": "^0.26.1"
+      },
       "devDependencies": {
         "eslint": "^8.10.0",
         "parcel-bundler": "^1.12.4"
@@ -2373,6 +2376,14 @@
       "integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==",
       "dev": true
     },
+    "node_modules/axios": {
+      "version": "0.26.1",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.26.1.tgz",
+      "integrity": "sha512-fPwcX4EvnSHuInCMItEhAGnaSEXRBjtzh9fOtsE6E1G6p7vl7edEeZe11QHf18+6+9gR5PbKV/sGKNaD8YaMeA==",
+      "dependencies": {
+        "follow-redirects": "^1.14.8"
+      }
+    },
     "node_modules/babel-plugin-dynamic-import-node": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/babel-plugin-dynamic-import-node/-/babel-plugin-dynamic-import-node-2.3.3.tgz",
@@ -4886,6 +4897,25 @@
       "integrity": "sha512-WIWGi2L3DyTUvUrwRKgGi9TwxQMUEqPOPQBVi71R96jZXJdFskXEmf54BoZaS1kknGODoIGASGEzBUYdyMCBJg==",
       "dev": true
     },
+    "node_modules/follow-redirects": {
+      "version": "1.14.9",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.9.tgz",
+      "integrity": "sha512-MQDfihBQYMcyy5dhRDJUHcw7lb2Pv/TuE6xP1vyraLukNDHKbDxDNaOE3NbCAdKQApno+GPRyo1YAp89yCjK4w==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/RubenVerborgh"
+        }
+      ],
+      "engines": {
+        "node": ">=4.0"
+      },
+      "peerDependenciesMeta": {
+        "debug": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/for-in": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
@@ -12618,6 +12648,14 @@
       "integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==",
       "dev": true
     },
+    "axios": {
+      "version": "0.26.1",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.26.1.tgz",
+      "integrity": "sha512-fPwcX4EvnSHuInCMItEhAGnaSEXRBjtzh9fOtsE6E1G6p7vl7edEeZe11QHf18+6+9gR5PbKV/sGKNaD8YaMeA==",
+      "requires": {
+        "follow-redirects": "^1.14.8"
+      }
+    },
     "babel-plugin-dynamic-import-node": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/babel-plugin-dynamic-import-node/-/babel-plugin-dynamic-import-node-2.3.3.tgz",
@@ -14692,6 +14730,11 @@
       "integrity": "sha512-WIWGi2L3DyTUvUrwRKgGi9TwxQMUEqPOPQBVi71R96jZXJdFskXEmf54BoZaS1kknGODoIGASGEzBUYdyMCBJg==",
       "dev": true
     },
+    "follow-redirects": {
+      "version": "1.14.9",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.9.tgz",
+      "integrity": "sha512-MQDfihBQYMcyy5dhRDJUHcw7lb2Pv/TuE6xP1vyraLukNDHKbDxDNaOE3NbCAdKQApno+GPRyo1YAp89yCjK4w=="
+    },
     "for-in": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
diff --git a/package.json b/package.json
index d85e259b0..019a9d954 100644
--- a/package.json
+++ b/package.json
@@ -19,5 +19,7 @@
     "eslint": "^8.10.0",
     "parcel-bundler": "^1.12.4"
   },
-  "dependencies": {}
+  "dependencies": {
+    "axios": "^0.26.1"
+  }
 }