This repository has been archived by the owner on Feb 16, 2023. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
134 lines (134 loc) · 5.56 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
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<link href="style.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Montserrat&display=swap" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Jack Crane</title>
</head>
<body>
<div class="vcp hc">
<section class="me vcc">
<h1>Hi 👋<br>I'm Jack!</h1>
<h3>I am a high schooler with a passion for programming</h3>
<a href="#projects" class="btn">Peek at my projects</a>
</section>
</div>
<div class="advance hc" id="projects">Scroll down</div>
<div class="hc" style="display:inline-block;">
<section class="projects">
<div>
<div class="cardContainer">
<div class="card" rcattr="borderColor">
<img src="jv.png">
<span>JVerify</span><br><br>
<a class="btn" href="https://jverify.us">Visit</a>
<a class="btn" href="https://blog.jackcrane.rocks/2021/08/14/jverify.html">Blog post</a>
<ul>
<li>Tech stack: HTML, CSS, node.js, MySQL, DigitalOcean App Platform</li>
<li>Objective: Simplify phone number verification with an easy-to-use API</li>
</ul>
</div>
<div class="card" rcattr="borderColor">
<img src="og.png">
<span>OG Image Generator</span><br><br>
<a class="btn" href="https://og-image.xyz">Visit</a>
<a class="btn" href="https://blog.jackcrane.rocks/2021/08/14/og-image.html">Blog post</a>
<a href="https://www.producthunt.com/posts/opengraph-image-generator" class="btn">ProductHunt Listing</a>
<ul>
<li>Tech stack: HTML, CSS, node.js, DigitalOcean App Platform</li>
<li>Objective: A super-duper easy opengraph image generator</li>
</ul>
</div>
<div class="card" rcattr="borderColor">
<img src="qc.png">
<span>Quizlet Coalition</span><br><br>
<a class="btn" href="https://blog.jackcrane.rocks/2021/08/14/quizlet-coalition.html">Blog post</a>
<ul>
<li>Tech stack: PHP, MySQL, HTML, JS, CSS, DigitalOcean</li>
<li>Objective: Self-made api, Search Engine</li>
</ul>
</div>
<div class="card" rcattr="borderColor">
<img src="sr.png">
<span>Scarecrow Row</span><br><br>
<a class="btn" href="http://scarecrowrow.org">Visit</a>
<a class="btn" href="https://blog.jackcrane.rocks/2021/08/14/scarecrow-row.html">Blog post</a>
<ul>
<li>Tech stack: HTML, CSS, JS, GitHub Pages, Formspree, Google Analytics</li>
<li>Objective: SEO, Customer relations</li>
</ul>
</div>
<div class="card" rcattr="borderColor">
<img src="tf.png">
<span>To Fly</span><br><br>
<a class="btn" href="https://blog.jackcrane.rocks/2021/08/14/tofly.html">Blog post</a>
<ul>
<li>Tech stack: HTML, CSS, JS, GitHub Pages</li>
<li>Objective: API Calls</li>
</ul>
</div>
<div class="card" rcattr="borderColor">
<img src="7p.png">
<span>7 Sigma Robotics</span><br><br>
<a class="btn" href="http://fan5fll.com/7sigmarobotics">Visit</a>
<a href="https://blog.jackcrane.rocks/2021/08/14/7-sigma.html" class="btn">Blog post</a>
<ul>
<li>Tech stack: HTML, CSS, GitHub Pages</li>
<li>Objective: Landing page for my robotics team</li>
</ul>
</div>
</div>
</div>
</section>
</div><br><br><br><br><br><br>
<div class=" hc">
<section class="">
<h1>I ❤️ writing code.</h1>
<div class="card" rcattr="borderColor">
<h3>Here's what I'm great at:</h3>
<ul>
<li>HTML & Semantics</li>
<li>CSS</li>
<li>JavaScript</li>
<li>PHP</li>
<li>MySQL</li>
</ul>
</div>
<div class="card" rcattr="borderColor">
<h3>Here's what I'm learning:</h3>
<ul>
<li>React/vue</li>
<li>Python</li>
<li>Tensorflow</li>
<li>Unity/ue4</li>
<li>node.js</li>
</ul>
</div>
<div class="card" rcattr="borderColor" style="width:80%;">
<h3>Here's what I use:</h3>
<ul>
<li>IDE: Atom/Android Studio</li>
<li>Static websites: GitHub Pages</li>
<li>Small-scale PHP applications: Heroku</li>
<li>Large-scale PHP applications: DigitalOcean</li>
<li>3D games: Unity</li>
<li>3D Modeling: Rhino 6, OnShape, Blender</li>
</ul>
</div>
</section>
</div>
<div class="vcp hc">
<section class="vcc">
<h1>Like what you see?</h1>
<a class="btn" href="mailto:[email protected]">Email me!</a><br>
<a class="btn" href="https://github.com/jackcrane">Or check out my GitHub</a><br>
<span class="btn">Or talk to me on Discord <code>14365jack#0597</code></span>
<br><br><br>
<a class="btn" href="https://battleforthenet.com" title="Join the fight for net neutrality">Join the Battle for the Net</a><br>
</section>
</div>
</body>
<script src="script.js"></script>
</html>