lesson-10

iamshaunjp · iamshaunjp · commit 6cbb27907386 · 2021-01-05T11:00:54.000Z
diff --git a/pages/ninjas/index.js b/pages/ninjas/index.js
@@ -1,7 +1,27 @@
-const Ninjas = () => {
+import styles from '../../styles/Jobs.module.css'
+
+export const getStaticProps = async () => {
+  const res = await fetch('https://jsonplaceholder.typicode.com/users');
+  const data = await res.json();
+
+  return {
+    props: { ninjas: data }
+  }
+}
+
+const Ninjas = ({ ninjas }) => {
+  console.log(ninjas)
+
   return (
     <div>
       <h1>All Ninjas</h1>
+      {ninjas.map(ninja => (
+        <div key={ninja.id}>
+          <a className={styles.single}>
+            <h3>{ ninja.name }</h3>
+          </a>
+        </div>
+      ))}
     </div>
   );
 }
diff --git a/styles/Jobs.module.css b/styles/Jobs.module.css
@@ -0,0 +1,10 @@
+.single {
+  padding: 2px 16px;
+  background: #fff;
+  display: block;
+  margin: 20px 10px;
+  border-left: 8px solid #fff;
+}
+.single:hover {
+  border-left: 8px solid #4979ff;
+}
