index.html

---
layout: base
stylesheets:
  - '<link rel="stylesheet" href="global.css">'
  - '<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">'
  - '<link href="https://fonts.googleapis.com/css?family=Alfa+Slab+One" rel="stylesheet">'
  - '<link href="https://fonts.googleapis.com/css?family=Fira+Sans:400,400i,700&display=swap" rel="stylesheet">'
  - '<link rel="stylesheet" href="palette.css">'
  - '<link rel="stylesheet" href="index.css">'
title: "Kristofer Rye"
---

<header>
	<div class="name">kris<span class="aux">tofer</span> rye</div>

	<div class="tagline">
		<span class="item" data-separator="&bull;">Pilot</span>
		<span class="item bigger" data-separator="&bull;">Programmer</span>
		<span class="item" data-separator="&bull;">Cellist</span>
	</div>
</header>

<section id="about">
	<h1>About Me</h1>

	<p>
		Hi! I'm a <b>Software Developer</b> based in Verona, Wisconsin, formerly a
		student majoring in <b>Computer Science</b> and <b>Mathematics</b> at
		St.&nbsp;Olaf <wbr />College.
	</p>

	<p>
		I like to
		<b>code</b>, play <b>music</b>, and <b>fly airplanes</b>.
	</p>

	<p>
		I am currently not available for hire, but have lots of experience with
		<b>backend</b>
		and
		<b>frontend</b>
		development in a variety of languages and environments.
	</p>

	<p>
		I am especially interested in API design, control theory and automation, and
		DevOps.
	</p>

	<p class="contact-me">
		Interested in connecting? I'd love to get in touch.
		<a href="resume">Check out my r&eacute;sum&eacute;</a> or
		<a href="mailto:kristofer.rye@gmail.com">shoot me an email</a>!
	</p>
</section>

{% if site.posts.size > 0 %}
<section>
	<h1>Blog Posts</h1>

	<p>
		I write things sometimes, apparently&mdash;here are some of the most recent
		of these things:
	</p>

	<ul>
		{% for post in site.posts limit: 5 %}
		<li>
			<a href="{{ post.url }}">{{ post.title }}</a>
		</li>
		{% endfor %}
	</ul>
</section>
{% endif %}

<section id="activity">
	<h1>Activity</h1>
	<p>What am I up to? Check out my latest activity on GitHub:</p>

	<div id="gh-activity">
		Shucks, looks like you don't have JS enabled, or my code is bad. Oh well!
	</div>
</section>

<section id="projects">
	<h1>Projects</h1>

	<p>
		My favorite languages/frameworks to work in are
		<b>Rust</b>, <b>Ruby</b> (standalone and on Rails), <b>C/C++</b>,
		<b>Node.js</b>, and of course <b>HTML5</b>, <b>CSS3</b>, and <b>JS/JSX</b>.
	</p>

	<p>
		I am also familiar with
		<b>Docker</b>, <b>Kubernetes</b>, <b>React</b>, <b>React-Native</b>,
		<b>Go</b>, <b>Java</b>, <b>Python</b>, <b>Ansible</b>, <b>Chef</b>,
		<b>Linux</b>, etc.
	</p>

	<p>I'm working on a bunch of projects. Here are some of them:</p>

	<div id="aao" class="project example e31">
		<h1 class="title">
			<a href="https://github.com/StoDevX/AAO-React-Native">All About Olaf</a
			><span class="links"
				><a href="https://itunes.apple.com/us/app/all-about-olaf/id938588319"
					><i class="fab fa-app-store-ios"></i></a
				><a
					href="https://play.google.com/store/apps/details?id=com.allaboutolaf"
					><i class="fab fa-google-play"></i></a
			></span>
		</h1>
		<div class="text left">
			<p class="description">
				A (unofficial) mobile app for St.&nbsp;Olaf students.
			</p>
			<p>
				Written in <b class="technology">React Native</b>, this app is used by
				over <b class="slight">600 daily active users</b>, and provides valuable
				information to students. I work on some of the data fetching and
				business-logic bits as well as release and dependency management.
			</p>
			<p>
				I also worked on separating the data fetching out into a separate
				service, deployed via <b class="technology">Docker</b> on
				<b>DigitalOcean</b> and capable of handling over 2000 requests per
				second.
			</p>
		</div>

		<div class="image right">
			<img id="aao-screenshot" src="images/aao.jpeg" />
		</div>
	</div>

	<div id="netaddr2" class="project example e4">
		<h1 class="title">
			<a href="https://github.com/rye/rust-netaddr2">netaddr2</a
			><span class="links"
				><a href="https://crates.io/crates/netaddr2"
					><img
						style="width: 1.5em; height: 1.5em"
						src="images/rust-logo-blk.svg" /></a
			></span>
		</h1>
		<div class="text full">
			<p class="description">
				A network address parsing and arithmetic library.
			</p>
			<p class="info">
				One of my first production-class
				<b class="technology">Rust</b> libraries, this project explores writing
				idiomatic and powerful Rust that can represent networks. This project
				allows users to parse CIDR notation, merge and iterate through networks,
				and rapidly check containment.
			</p>
		</div>
	</div>
</section>

<script>
	let ghActivityContainer = document.querySelector("div#gh-activity");

	function renderGhActivityContainer(container, data) {
		if (container) {
			container.innerHTML = "";
		}

		let dataInScope = data.filter((event) => {
			let eventDateRaw = event["created_at"];
			let eventDate = Date.parse(eventDateRaw);
			let difference = eventDate && new Date() - eventDate;
			return difference < 7 * 24 * 60 * 60 * 1000;
		});

		let dataToRender = data.filter((event) => {
			let isCorrectType =
				event["type"] == "PushEvent" ||
				event["type"] == "PullRequestEvent" ||
				event["type"] == "IssueCommentEvent";
			let isCorrectActor = event["actor"] && event["actor"]["login"] == "rye";
			return isCorrectActor && isCorrectType;
		});

		dataToRender.forEach((event) => {
			let eventContainer = document.createElement("div");
			eventContainer.setAttribute("data-id", event["id"]);
			eventContainer.setAttribute("data-type", event["type"]);

			switch (event["type"]) {
				case "PushEvent":
					console.debug(event["payload"]["commits"]);
					let commits = event["payload"] && event["payload"]["commits"];
					let lastCommit = commits[commits.length - 1];
					let otherCommits = commits.length - 1;
					eventContainer.innerHTML =
						`Pushed \"${lastCommit["message"].split("\n")[0]}\"` +
						(otherCommits > 0
							? " and " +
								otherCommits +
								` other commit${otherCommits > 1 ? "s" : ""}`
							: "");
					break;

				case "PullRequestEvent":
					console.debug(event["payload"]);
					break;

				default:
					console.warn("unimplemented event type", event["type"]);
			}

			container.appendChild(eventContainer);
		});
	}

	if (ghActivityContainer) {
		fetch("https://api.github.com/users/rye/events?per_page=100")
			.then((response) => response.json())
			.then((data) => renderGhActivityContainer(ghActivityContainer, data));
	} else {
		console.warn("div#gh-activity not found on page, doing nothing");
	}
</script>