Files
portfolio/index.html
Tyler Koenig f152434785 font-size
2021-09-13 12:50:59 -04:00

678 lines
20 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="#about" 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>
<section id="intro">
<article 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="intro_bio">
<p>
Passionate Software Developer
<br />
Recent Graduate of We Can Code IT
</p>
</div>
<div class="contact-links" id="contact">
<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="https://github.com/lerko96"
target="_blank"
title="github"
><i
class="fa fa-github 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>
</article>
<article class="card" id="about">
<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>
</article>
<article class="card" 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>
</article>
</section>
<!-- <section>
<article class="card" id="about">
<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>
</article>
<article class="card" 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>
</article>
</section> -->
<section class="card" id="projects">
<h2>projects</h2>
<article class="project">
<a
class="project__img_link"
href="https://github.com/pt-spring-2021-team-project-spa/team-2-spa-repo"
target="_blank"
>
<img
class="project__img"
src="/images/headshot-tyler_koenig.png"
alt="were-hooked-img"
/></a>
<div class="project__text">
<h3 class="project__title">
<a
href="https://github.com/pt-spring-2021-team-project-spa/team-2-spa-repo"
target="_blank"
>We're Hooked</a
>
</h3>
<div class="project__subtitle_small">
<time datetime="2021-08-20 12:00:00">
<i class="fas fa-calendar-alt mr-2"></i>Fri,
August 20th 2021
</time>
</div>
<div class="project__bar"></div>
<div class="project__info">
<p>
Designed, built and tested an MVC
application that allows users to discover
fishing locations in Ohio, as well as teach
beginners how to get started fishing and the
current regulations that are needed to
follow. This project was built between a
team of five in a completely remote
environment with the help of Github, Zoom
and Slack.
</p>
</div>
<ul class="project__tagbox">
<li class="tag__item">JavaScript</li>
<li class="tag__item">RESTful APIs</li>
<li class="tag__item">Java</li>
<li class="tag__item">OOP</li>
<li class="tag__item">Thymeleaf</li>
<li class="tag__item">HTML</li>
<li class="tag__item">CSS</li>
<li class="tag__item">Responsive Design</li>
<li class="tag__item">TDD</li>
<li class="tag__item">VS Code</li>
<li class="tag__item">Github</li>
<li class="tag__item">Agile</li>
<li class="tag__item">Scrum</li>
<li class="tag__item">Zoom</li>
<li class="tag__item">Slack</li>
</ul>
</div>
</article>
<article class="project">
<a
class="project__img_link"
href="https://github.com/pt-spring-2021-team-project-spa/team-2-spa-repo"
target="_blank"
>
<img
class="project__img"
src="/images/mystery-educator.png"
alt=""
/></a>
<div class="project__text">
<h3 class="project__title">
<a
href="https://github.com/pt-spring-2021-team-project-spa/team-2-spa-repo"
target="_blank"
>Mystery Educator</a
>
</h3>
<div class="project__subtitle_small">
<time datetime="2021-07-23 12:00:00">
<i class="fas fa-calendar-alt mr-2"></i>Fri,
July 23rd 2021
</time>
</div>
<div class="project__bar"></div>
<div class="project__info">
<p>
Designed, built and tested a single page
application that renders unique data from
the MET Museum and NASA APIs each time you
visit. We also built a local backend
database to store historical information.
This project was built between a team of
four in a completely remote environemnt with
the help of Github, Zoom, and Slack.
</p>
</div>
<ul class="project__tagbox">
<li class="tag__item">JavaScript</li>
<li class="tag__item">Node.js</li>
<li class="tag__item">RESTful APIs</li>
<li class="tag__item">Java</li>
<li class="tag__item">HTML</li>
<li class="tag__item">CSS</li>
<li class="tag__item">Responsive Design</li>
<li class="tag__item">TDD</li>
<li class="tag__item">VS Code</li>
<li class="tag__item">Github</li>
<li class="tag__item">Agile</li>
<li class="tag__item">Scrum</li>
<li class="tag__item">Zoom</li>
<li class="tag__item">Slack</li>
</ul>
</div>
</article>
<article class="project">
<a
class="project__img_link"
href="https://github.com/2021-Spring-Part-Time/donut-clicker-lerko96"
target="_blank"
>
<img
class="project__img"
src="/images/donut-clicker.png"
alt="donut-clicker-img"
/></a>
<div class="project__text">
<h3 class="project__title">
<a
href="https://github.com/2021-Spring-Part-Time/donut-clicker-lerko96"
target="_blank"
>Donut Clicker</a
>
</h3>
<div class="project__subtitle_small">
<time datetime="2021-07-09 12:00:00">
<i class="fas fa-calendar-alt mr-2"></i>Fri,
July 9th 2021
</time>
</div>
<div class="project__bar"></div>
<div class="project__info">
<p>
Designed, built and tested a single page
application that lets users make virtual
donuts via clicking. Once enough donuts are
made you have the ability to purchase
upgrades such as auto-clickers and
clicking-multipliers.
</p>
</div>
<ul class="project__tagbox">
<li class="tag__item">JavaScript</li>
<li class="tag__item">Node.js</li>
<li class="tag__item">HTML</li>
<li class="tag__item">CSS</li>
<li class="tag__item">Responsive Design</li>
<li class="tag__item">TDD</li>
<li class="tag__item">VS Code</li>
<li class="tag__item">Github</li>
</ul>
</div>
</article>
<article class="project">
<a
class="project__img_link"
href="https://github.com/pt-spring-2021-team-project-fullstack/team-4-trek"
target="_blank"
>
<img
class="project__img"
src="/images/trek.png"
alt="trekking-img"
/></a>
<div class="project__text">
<h3 class="project__title">
<a
href="https://github.com/pt-spring-2021-team-project-fullstack/team-4-trek"
target="_blank"
>Trekking Site</a
>
</h3>
<div class="project__subtitle_small">
<time datetime="2021-06-18 12:00:00">
<i class="fas fa-calendar-alt mr-2"></i>Fri,
June 18th 2021
</time>
</div>
<div class="project__bar"></div>
<div class="project__info">
<p>
Designed, built and tested an MVC
application that lets users discover treks
located by continent, region and type. This
project was built between a team of four in
a completely remote environemnt with the
help of Github, Zoom and Slack.
</p>
</div>
<ul class="project__tagbox">
<li class="tag__item">Java</li>
<li class="tag__item">SpringJPA</li>
<li class="tag__item">OOP</li>
<li class="tag__item">HTML</li>
<li class="tag__item">CSS</li>
<li class="tag__item">Responsive Design</li>
<li class="tag__item">TDD</li>
<li class="tag__item">IntelliJ</li>
<li class="tag__item">Github</li>
<li class="tag__item">Agile</li>
<li class="tag__item">Scrum</li>
<li class="tag__item">Zoom</li>
<li class="tag__item">Slack</li>
</ul>
</div>
</article>
<article class="project">
<a
class="project__img_link"
href="https://github.com/2021-Spring-Part-Time/reviews-mvc-lerko96"
target="_blank"
>
<img
class="project__img"
src="/images/review-site.png"
alt="review-site-img"
/></a>
<div class="project__text">
<h3 class="project__title">
<a
href="https://github.com/2021-Spring-Part-Time/reviews-mvc-lerko96"
target="_blank"
>Review Site</a
>
</h3>
<div class="project__subtitle_small">
<time datetime="2021-06-04 12:00:00">
<i class="fas fa-calendar-alt mr-2"></i>Fri,
June 4th 2021
</time>
</div>
<div class="project__bar"></div>
<div class="project__info">
<p>
Designed, built and tested a Java
application for movie reviews.
</p>
</div>
<ul class="project__tagbox">
<li class="tag__item">Java</li>
<li class="tag__item">SpringJPA</li>
<li class="tag__item">OOP</li>
<li class="tag__item">Thymeleaf</li>
<li class="tag__item">HTML</li>
<li class="tag__item">CSS</li>
<li class="tag__item">Responsive Design</li>
<li class="tag__item">TDD</li>
<li class="tag__item">IntelliJ</li>
<li class="tag__item">Github</li>
</ul>
</div>
</article>
</section>
<div class="card">
<section id="projects">
<h2>old project style</h2>
<article class="project">
<a
class="project__img_link"
href="https://github.com/pt-spring-2021-team-project-spa/team-2-spa-repo"
target="_blank"
>
<img
class="project__img"
src="/images/mystery-educator.png"
alt=""
/></a>
<div class="project__text">
<h3 class="project__title">
<a
href="https://github.com/pt-spring-2021-team-project-spa/team-2-spa-repo"
target="_blank"
>Mystery Educator</a
>
</h3>
<div class="project__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="project__bar"></div>
<div class="project__info">
<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>
<li class="tag__item">java</li>
<li class="tag__item">java</li>
<li class="tag__item">java</li>
<li class="tag__item">java</li>
</ul>
</div>
</article>
<article class="postcard dark blue">
<a class="postcard__img_link" href="#">
<img
class="postcard__img"
src="/images/mystery-educator.png"
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>
<!-- WCCI Early Projects -->
<!-- <section id="project-wrapper">
<h2>projects</h2>
<div>
<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">&copy; 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>