-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
99 lines (87 loc) · 5.21 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="./index.css" />
<title>Joe Jackson</title>
</head>
<body>
<header id="navHeader" class="nav__header">
<a class="nav__header__link--home" href="./index.html">
<img src="./img/black-cloud.png" alt="cloud icon" />
</a>
<span>
<a href="mailto:[email protected]">Email</a>
<a href="https://drive.google.com/file/d/1fYD81aLw3BhTBY9te7OKzWa3vpWok_sk/view?usp=sharing" target="_blank">CV</a>
<a href="https://github.com/Joepock123/" target="_blank">
<svg class="svg-icon" width="24" height="24" viewBox="0 0 24 24">
<title>GitHub icon</title>
<path
d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"
></path>
</svg>
</a>
<a href="https://www.linkedin.com/in/joe-m-jackson-37709767/" target="_blank">
<svg class="svg-icon" width="24" height="24" viewBox="0 0 24 24">
<title>Linkedin icon</title>
<path
d="M22.23 0H1.77C.8 0 0 .77 0 1.72v20.56C0 23.23.8 24 1.77 24h20.46c.98 0 1.77-.77 1.77-1.72V1.72C24 .77 23.2 0 22.23 0zM7.27 20.1H3.65V9.24h3.62V20.1zM5.47 7.76h-.03c-1.22 0-2-.83-2-1.87 0-1.06.8-1.87 2.05-1.87 1.24 0 2 .8 2.02 1.87 0 1.04-.78 1.87-2.05 1.87zM20.34 20.1h-3.63v-5.8c0-1.45-.52-2.45-1.83-2.45-1 0-1.6.67-1.87 1.32-.1.23-.11.55-.11.88v6.05H9.28s.05-9.82 0-10.84h3.63v1.54a3.6 3.6 0 0 1 3.26-1.8c2.39 0 4.18 1.56 4.18 4.89v6.21z"
></path>
</svg>
</a>
</span>
</header>
<section class="hero__section">
<div class="hero__div-container">
<div class="hero__div-content"><!-- javascript --></div>
<div class="hero__div-icon">
<a href="#contentSection">⤋</a>
</div>
</div>
<div class="hero__div-image"></div>
</section>
<section id="contentSection" class="content__container">
<h1>Projects</h1>
<div class="content__section">
<article class="content__article">
<div role="img" class="content__article__div-img img-1">
<a class="content__article__div-img-link" href="https://github.com/fac19/Zaatari-Radio" target="_blank"></a>
</div>
<div class="content__article__div-content">
<h1><a href="https://github.com/fac19/Zaatari-Radio" target="_blank">Humanibase</a></h1>
<p class="article__p--role">Full Stack Dev & UX/UI Lead</p>
<p class="article__p--stack">React, Airtable, Netlify AWS Lambda Functions, Storybook</p>
<p class="article__p--details">Full stack web app using AWS Lambda functions to serve workshop data from Airtable with the Zaatari refugee camp in Jordan using a React client styled with Styled Components.</p>
<h2>Why I'm proud of this project:</h2>
<ul class="article__p--ul">
<li>Led styling of project using a <a href="https://storybook.js.org/">Storybook</a> first approach.</li>
<li>Integrating serverless architecture with an Airtable backend</li>
</ul>
</div>
</article>
<article class="content__article">
<div role="img" class="content__article__div-img img-2">
<a class="content__article__div-img-link" href="https://github.com/fac19/Zaatari-Radio" target="_blank"></a>
</div>
<div class="content__article__div-content">
<h1><a href="https://github.com/fac19/week11-where-is-whippy" target="_blank">Where's Whippy</a></h1>
<p class="article__p--role">Full Stack Dev & Quality Assurance Lead</p>
<p class="article__p--stack">PostgreSQL, Express, React, Node.js</p>
<p class="article__p--details">Full stack web app with jwt authentication that serves geolocation and user data from a postgres database using an Express RESTful API.</p>
<h2>Why I'm proud of this project:</h2>
<ul class="article__p--ul">
<li>Led testing of asynchronous database queries using Jest & Supertest</li>
<li>Implementation of React's useContext hook</li>
<li>Build of controlled from component in React without a library</li>
</ul>
</div>
</article>
</div>
</section>
<footer>
<a class="footer__link" href="#navHeader">⤊ Back to top</a>
</footer>
<script src="./index.js"></script>
</body>
</html>