-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
99 lines (93 loc) · 4.33 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>
<title>J-P Teti</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@1.0.2/css/bulma.min.css">
<link rel="stylesheet" href="/styles.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
<meta name="viewport" content="initial-scale=1, user-scalable=no, width=device-width">
<script type="module">
import { Application, Controller } from "https://unpkg.com/@hotwired/stimulus/dist/stimulus.js"
window.Stimulus = Application.start()
Stimulus.register("year", class extends Controller {
static targets = [ "current" ]
connect() {
const currentYear = new Date().getFullYear()
this.currentTarget.innerText = currentYear.toString()
}
})
</script>
</head>
<body class="animate__animated animate__fadeIn">
<header id="header" class="hero">
<div class="hero-body">
<div class="container">
<h1>
<span class="title is-4">
<abbr title="John-Paul">J-P</abbr> Teti
</span>
<span class="subtitle is-4">is a software engineer working in the Philadelphia area.</span>
</h1>
</div>
</div>
</header>
<section id="skills" class="section">
<div class="container has-border-top pt-4">
<h2 class="title is-5">Skills</h2>
<div class="content" aria-role="presentation">
<ul>
<li>HTML, CSS</li>
<li>JavaScript / Typescript, especially <a href="https://stimulus.hotwired.dev">Stimulus</a></li>
<li>Ruby on Rails</li>
<li>React</li>
</ul>
</div>
<aside>
<p>I am highly familiar with React and Typescript, but these days I am more interested in <a href="https://hotwired.dev">Hotwire</a> and similar approaches that use server-rendered, progressively-enhanced HTML in a monolith rather than single-page applications.</p>
</aside>
</div>
</section>
<section id="education" class="section">
<div class="container has-border-top pt-4">
<h2 class="title is-5">Education</h2>
<dl>
<dt><strong><abbr title="Bachelor of Science">B.S.</abbr>, Computer Science</strong> (w/linguistics concentration)</dt>
<dd>University of Maryland–College Park, May 2019</dd>
</dl>
</div>
</section>
<section id="work" class="section">
<div class="container has-border-top pt-4">
<h2 class="title is-5">Work</h2>
<ul>
<li><strong>Software engineer</strong>, undisclosed firm (August 2019–present)</li>
<li><strong>Research assistant</strong>, <a href="https://linguistics.umd.edu/resources-facilities/labs/project-on-childrens-language-learning">Project on Children’s Language Learning</a> (June 2018–May 2019)</li>
<li><strong>Software development intern</strong>, <a href="https://sparkpost.com">SparkPost</a> (May 2017–August 2017)</li>
</ul>
</div>
</section>
<section id="projects" class="section">
<div class="container has-border-top pt-4">
<h2 class="title is-5">Projects</h2>
<ul class="project-entries">
<li>
<a href="https://choirlux.com">Lux</a> is a choir based in Washington, DC. I sing tenor and also do various design and administrative tasks for the group. (I am also a co-founder and member of the board of directors.)
</li>
</ul>
</div>
</section>
<section id="contact-information" class="section">
<div class="container has-border-top pt-4">
<h2 class="title is-5">Contact information and social network profiles</h2>
<ul class="contact-methods">
<li>Email me: <a class="is-family-monospace" href="mailto:jp@jpteti.com">jp@jpteti.com</a></li>
<li>Follow me on Mastodon: <a rel="me" href="https://mastodon.social/@jpteti" class="is-family-monospace">@jpteti@mastodon.social</a></li>
<li>Follow me on Bluesky: <a href="https://bsky.app/profile/jpteti.com" class="is-family-monospace">@jpteti.com</a></li>
</ul>
</div>
</section>
<footer class="footer has-text-centered has-text-grey-dark">
<p class="is-size-6" data-controller="year">© Copyright 2008–<span data-year-target="current">(current year)</span> John-Paul A. Teti. All rights reserved.</p>
</footer>
</body>
</html>