521 lines
14 KiB
HTML
521 lines
14 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" />
|
|
<link
|
|
href="https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,200;0,400;0,600;1,200;1,400;1,600&display=swap"
|
|
rel="stylesheet"
|
|
/>
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300;600;700&display=swap');
|
|
</style>
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;700&display=swap');
|
|
</style>
|
|
<script src="https://use.fontawesome.com/e427b1b41a.js"></script>
|
|
<!-- <link rel="stylesheet" type="text/css" href="style.css" /> -->
|
|
<link rel="stylesheet" href="style.css" />
|
|
<title>Tyler Koenig</title>
|
|
</head>
|
|
<body>
|
|
<div id="wrapper">
|
|
<header>
|
|
<nav>
|
|
<a href="index.html">TYLER KOENIG</a>
|
|
<ul>
|
|
<li><a href="#bio" target="_self">ABOUT</a></li>
|
|
<li><a href="#contact" target="_self">CONTACT</a></li>
|
|
<li>
|
|
<a href="#projects" target="_self">PROJECTS</a>
|
|
</li>
|
|
<li><a href="#skills" target="_self">SKILLS</a></li>
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
<main>
|
|
<div class="card">
|
|
<div class="card-top">
|
|
<div class="avatar-holder">
|
|
<img
|
|
id="headshot"
|
|
src="/images/headshot-tyler_koenig.png"
|
|
alt="tyler"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div class="name">
|
|
<a href="index.html">Tyler Koenig</a>
|
|
</div>
|
|
<div class="short-bio">
|
|
<p>
|
|
Passionate Software Developer
|
|
<br />
|
|
Recent Graduate of We Can Code IT
|
|
</p>
|
|
</div>
|
|
<div class="contact-links" id="contact">
|
|
<a
|
|
href="https://github.com/lerko96"
|
|
target="_blank"
|
|
title="github"
|
|
><i
|
|
class="fa fa-github fa-2x"
|
|
aria-hidden="true"
|
|
></i
|
|
></a>
|
|
<a
|
|
href="https://www.linkedin.com/in/tyler-koenig-72607a18b/"
|
|
target="_blank"
|
|
title="LinkedIn"
|
|
><i
|
|
class="fa fa-linkedin-square fa-2x"
|
|
aria-hidden="true"
|
|
></i
|
|
></a>
|
|
<a
|
|
href="mailto:tylerkng96@icloud.com"
|
|
target="_blank"
|
|
title="email"
|
|
><i
|
|
class="fa fa-envelope-o fa-2x"
|
|
aria-hidden="true"
|
|
></i
|
|
></a>
|
|
</div>
|
|
</div>
|
|
<div class="card">
|
|
<section id="bio">
|
|
<h2>about</h2>
|
|
<p>
|
|
I'm Tyler Koenig, a lifelong student. Graduated with
|
|
an Associate of Arts from Lorain County Community
|
|
College in 2018. Inbound associate at Amazon CLE-3
|
|
since December 2019. Currently learning Java and
|
|
front-end web development through We Can Code IT
|
|
Bootcamp. Always interested in a challenge!
|
|
</p>
|
|
</section>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<section id="skills">
|
|
<h2>skills</h2>
|
|
<ul>
|
|
<li>Java</li>
|
|
<li>Spring</li>
|
|
<li>Thymeleaf</li>
|
|
<li>JavaScript</li>
|
|
<li>MVC</li>
|
|
<li>HTML</li>
|
|
<li>CSS</li>
|
|
<li>Test Driven Development</li>
|
|
<li>Agile (Scrum)</li>
|
|
<li>Object Oriented Programming</li>
|
|
<li>JSON</li>
|
|
<li>React</li>
|
|
<li>REST APIs</li>
|
|
<li>Responsive Design</li>
|
|
<li>Relational Databases</li>
|
|
<li>Source Control/ Github</li>
|
|
</ul>
|
|
</section>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<section id="projects">
|
|
<h2>projects</h2>
|
|
|
|
<article class="project">
|
|
<div class="project_img">
|
|
<a
|
|
href="https://github.com/pt-spring-2021-team-project-spa/team-2-spa-repo"
|
|
target="_blank"
|
|
>
|
|
<img
|
|
src="/images/mystery-educator.png"
|
|
alt=""
|
|
/></a>
|
|
</div>
|
|
<div class="project_name">
|
|
<h3>mystery educator</h3>
|
|
</div>
|
|
<div class="project_date">
|
|
<p>mon, may 25th 2021</p>
|
|
</div>
|
|
<div class="project_bar"></div>
|
|
<div class="project_about">
|
|
<p>
|
|
Lorem ipsum dolor sit amet consectetur
|
|
adipisicing elit. Et a maiores laborum quo
|
|
animi, unde repellat. Libero ab sequi vel
|
|
beatae natus numquam consequuntur molestias
|
|
ducimus. Ad laudantium neque nobis?
|
|
</p>
|
|
</div>
|
|
<ul class="project_tagbox">
|
|
<li class="tag__item">
|
|
java
|
|
</li>
|
|
</ul>
|
|
</article>
|
|
<article class="postcard dark blue">
|
|
<a class="postcard__img_link" href="#">
|
|
<img
|
|
class="postcard__img"
|
|
src="https://picsum.photos/1000/1000"
|
|
alt="Image Title"
|
|
/>
|
|
</a>
|
|
<div class="postcard__text">
|
|
<h1 class="postcard__title blue">
|
|
<a href="#">Podcast Title</a>
|
|
</h1>
|
|
<div class="postcard__subtitle small">
|
|
<time datetime="2020-05-25 12:00:00">
|
|
<i class="fas fa-calendar-alt mr-2"></i
|
|
>Mon, May 25th 2020
|
|
</time>
|
|
</div>
|
|
<div class="postcard__bar"></div>
|
|
<div class="postcard__preview-txt">
|
|
Lorem ipsum dolor sit amet consectetur
|
|
adipisicing elit. Eligendi, fugiat
|
|
asperiores inventore beatae accusamus odit
|
|
minima enim, commodi quia, doloribus eius!
|
|
Ducimus nemo accusantium maiores velit
|
|
corrupti tempora reiciendis molestiae
|
|
repellat vero. Eveniet ipsam adipisci illo
|
|
iusto quibusdam, sunt neque nulla unde ipsum
|
|
dolores nobis enim quidem excepturi, illum
|
|
quos!
|
|
</div>
|
|
<ul class="postcard__tagbox">
|
|
<li class="tag__item">
|
|
<i class="fa fa-tag mr-2"></i>Podcast
|
|
</li>
|
|
<li class="tag__item">
|
|
<i class="fa fa-clock mr-2"></i>55 mins.
|
|
</li>
|
|
<li class="tag__item play blue">
|
|
<a href="#"
|
|
><i class="fa fa-play mr-2"></i>Play
|
|
Episode</a
|
|
>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</article>
|
|
</section>
|
|
</div>
|
|
|
|
<section id="project-wrapper">
|
|
<h2>projects</h2>
|
|
<div>
|
|
<article class="project-item">
|
|
<div>
|
|
<h3>
|
|
<a
|
|
href="https://github.com/pt-spring-2021-team-project-spa/team-2-spa-repo"
|
|
target="_blank"
|
|
>Mystery Educator</a
|
|
>
|
|
</h3>
|
|
</div>
|
|
<div id="project-container">
|
|
<div class="container-right">
|
|
<img
|
|
src="/images/mystery-educator.png"
|
|
alt="virtual-pet-amok-console"
|
|
/>
|
|
<div class="project-desc">
|
|
<p>
|
|
Designed a single page application
|
|
that brings back unique data from
|
|
MET Museum and NASA APIs.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="project-skills">
|
|
<h4>skills</h4>
|
|
<ul>
|
|
<li>Java</li>
|
|
<li>JavaScript</li>
|
|
<li>HTML</li>
|
|
<li>CSS</li>
|
|
<li>VS Code</li>
|
|
<li>Github</li>
|
|
<li>TDD</li>
|
|
<li>OOP</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
<article class="project-item">
|
|
<div>
|
|
<h3>
|
|
<a
|
|
href="https://github.com/2021-Spring-Part-Time/donut-clicker-lerko96"
|
|
target="_blank"
|
|
>Donut Clicker</a
|
|
>
|
|
</h3>
|
|
</div>
|
|
<div id="project-container">
|
|
<div class="container-right">
|
|
<img
|
|
src="/images/donut-clicker.png"
|
|
alt="virtual-pet-amok-console"
|
|
/>
|
|
<div class="project-desc">
|
|
<p>
|
|
Designed a single page application
|
|
that lets users make virtual donuts
|
|
and buy upgrades for the game.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="project-skills">
|
|
<h4>skills</h4>
|
|
<ul>
|
|
<li>JavaScript</li>
|
|
<li>HTML</li>
|
|
<li>CSS</li>
|
|
<li>VS Code</li>
|
|
<li>Github</li>
|
|
<li>TDD</li>
|
|
<li>OOP</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
<article class="project-item">
|
|
<div>
|
|
<h3>
|
|
<a
|
|
href="https://github.com/pt-spring-2021-team-project-fullstack/team-4-trek"
|
|
target="_blank"
|
|
>Trekking Website</a
|
|
>
|
|
</h3>
|
|
</div>
|
|
<div id="project-container">
|
|
<div class="container-right">
|
|
<img
|
|
src="/images/trek.png"
|
|
alt="virtual-pet-amok-console"
|
|
/>
|
|
<div class="project-desc">
|
|
<p>
|
|
Designed an MVC website that lets
|
|
users find treks located by region
|
|
and continent.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="project-skills">
|
|
<h4>skills</h4>
|
|
<ul>
|
|
<li>Java</li>
|
|
<li>SpringJPA</li>
|
|
<li>HTML</li>
|
|
<li>CSS</li>
|
|
<li>IntelliJ</li>
|
|
<li>VS Code</li>
|
|
<li>Github</li>
|
|
<li>TDD</li>
|
|
<li>OOP</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
<article class="project-item">
|
|
<div>
|
|
<h3>
|
|
<a
|
|
href="https://github.com/2021-Spring-Part-Time/reviews-mvc-lerko96"
|
|
target="_blank"
|
|
>Reviews Site</a
|
|
>
|
|
</h3>
|
|
</div>
|
|
<div id="project-container">
|
|
<div class="container-right">
|
|
<img src="/images/review-site.png" alt="" />
|
|
<div class="project-desc">
|
|
<p>
|
|
Designed a movie reviews website
|
|
using thymeleaf templates.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="project-skills">
|
|
<h4>skills</h4>
|
|
<ul>
|
|
<li>Java</li>
|
|
<li>Thymeleaf</li>
|
|
<li>HTML</li>
|
|
<li>CSS</li>
|
|
<li>IntelliJ</li>
|
|
<li>Github</li>
|
|
<li>TDD</li>
|
|
<li>OOP</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
<article class="project-item">
|
|
<div>
|
|
<h3>
|
|
<a
|
|
href="https://github.com/2021-Spring-Part-Time/virtual-pets-amok-lerko96"
|
|
target="_blank"
|
|
>Virtual Pets Amok</a
|
|
>
|
|
</h3>
|
|
</div>
|
|
<div id="project-container">
|
|
<div class="container-right">
|
|
<img
|
|
src="/images/amok.png"
|
|
alt="virtual-pet-amok-console"
|
|
/>
|
|
<div class="project-desc">
|
|
<p>
|
|
Console App that builds off of
|
|
virtual-pet-shelter. This add's
|
|
robotic pets to the shelter, with
|
|
their own robotic needs.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="project-skills">
|
|
<h4>skills</h4>
|
|
<ul>
|
|
<li>TDD</li>
|
|
<li>polymorphism</li>
|
|
<li>encapsulation</li>
|
|
<li>interface (implements)</li>
|
|
<li>abstract class (extends)</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
<article class="project-item">
|
|
<div>
|
|
<h3>
|
|
<a
|
|
href="https://github.com/2021-Spring-Part-Time/virtual-pet-shelter-lerko96"
|
|
target="_blank"
|
|
>
|
|
Virtual Pet Shelter</a
|
|
>
|
|
</h3>
|
|
</div>
|
|
<div id="project-container">
|
|
<div class="container-right">
|
|
<img
|
|
src="/images/shelter.png"
|
|
alt="virtual-pet-shelter-console"
|
|
/>
|
|
<div class="project-desc">
|
|
<p>
|
|
Built a console application allowing
|
|
users to take care of multiple pets.
|
|
Added the ability to admit pets, or
|
|
adopt.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="project-skills">
|
|
<h4>skills</h4>
|
|
<ul>
|
|
<li>TDD</li>
|
|
<li>constructor() {...}</li>
|
|
<li>getter() {...}</li>
|
|
<li>map<> = hashmap<>()></li>
|
|
<li>collections<></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
<article class="project-item">
|
|
<div>
|
|
<h3>
|
|
<a
|
|
href="https://github.com/2021-Spring-Part-Time/virtual-pet-lerko96"
|
|
target="_blank"
|
|
>
|
|
Virtual Pet</a
|
|
>
|
|
</h3>
|
|
</div>
|
|
<div id="project-container">
|
|
<div class="container-right">
|
|
<img
|
|
src="/images/pet.png"
|
|
alt="virtual-pet-console"
|
|
/>
|
|
<div class="project-desc">
|
|
<p>
|
|
Built a console application in Java
|
|
that allows the user to take care of
|
|
one virtual pet. This includes
|
|
keeping track of the pets' hunger,
|
|
thirst and bordedom.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="project-skills">
|
|
<h4>skills</h4>
|
|
<ul>
|
|
<li>game loop</li>
|
|
<li>user input</li>
|
|
<li>classes</li>
|
|
<li>instance variables</li>
|
|
<li>methods</li>
|
|
<li>clean code</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
<footer>
|
|
<span id="copyright">© 2021 Tyler Koenig</span>
|
|
<div id="footLinks">
|
|
<a
|
|
href="https://github.com/lerko96"
|
|
target="_blank"
|
|
title="github"
|
|
><i class="fa fa-github fa-2x" aria-hidden="true"></i
|
|
></a>
|
|
<a
|
|
href="https://www.linkedin.com/in/tyler-koenig-72607a18b/"
|
|
target="_blank"
|
|
title="LinkedIn"
|
|
><i
|
|
class="fa fa-linkedin-square fa-2x"
|
|
aria-hidden="true"
|
|
></i
|
|
></a>
|
|
<a
|
|
href="mailto:tylerkng96@icloud.com"
|
|
target="_blank"
|
|
title="email"
|
|
><i
|
|
class="fa fa-envelope-o fa-2x"
|
|
aria-hidden="true"
|
|
></i
|
|
></a>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
<script src="app/js/script.js"></script>
|
|
</body>
|
|
</html>
|