Add more projects and fixup existing ones

.vitepress/config.ts

@@ -25,7 +25,12 @@ export default defineConfig({
       },
       {
         text: "Personal Projects",
-        items: [{ text: "mjfs.us", link: "/mjfs-us" }],
+        items: [
+          { text: "mjfs.us", link: "/mjfs-us" },
+          { text: "mjfs.us (Old)", link: "/mjfs-us-react" },
+          { text: "lambdarouter", link: "/lambdarouter" },
+          { text: "selfpass", link: "/selfpass" },
+        ],
       },
     ],
 

components/ContactButtons.vue

@@ -13,7 +13,7 @@ const { text, copy, isSupported } = useClipboard();
 </script>
 
 <template>
-  <div v-if="isSupported" class="button-container">
+  <div v-if="isSupported" class="container">
     <VPButton
       theme="brand"
       class="button"
@@ -33,7 +33,7 @@ const { text, copy, isSupported } = useClipboard();
       @click="copy(discord)"
     />
   </div>
-  <div v-else class="button-container">
+  <div v-else class="container">
     <VPButton
       theme="brand"
       class="button"
@@ -58,8 +58,9 @@ const { text, copy, isSupported } = useClipboard();
 <style scoped>
 .button {
   margin: 6px;
+  text-decoration: none;
 }
-.button-container {
+.container {
   margin: -6px;
 }
 </style>

components/RepoButton.vue

@@ -0,0 +1,26 @@
+<script setup lang="ts">
+import { VPButton } from "vitepress/theme";
+const props = defineProps<{ href: string }>();
+</script>
+
+<template>
+  <div class="container">
+    <VPButton
+      theme="brand"
+      text="Repository"
+      class="button"
+      :href="props.href"
+    />
+  </div>
+</template>
+
+<style scoped>
+.container {
+  display: flex;
+  justify-content: center;
+}
+.button {
+  margin-top: 30px;
+  text-decoration: none;
+}
+</style>

eslint.config.js

@@ -1,15 +1,27 @@
 import globals from "globals";
 import js from "@eslint/js";
 import ts from "typescript-eslint";
+import tsParser from "@typescript-eslint/parser";
 import vue from "eslint-plugin-vue";
+import vueParser from "vue-eslint-parser";
 import prettier from "eslint-config-prettier";
 
 export default [
   { files: ["**/*.{js,mjs,cjs,ts,vue}"] },
   { ignores: [".vitepress/dist", ".vitepress/cache"] },
-  { languageOptions: { globals: globals.browser } },
   js.configs.recommended,
   ...ts.configs.recommended,
   ...vue.configs["flat/recommended"],
   prettier,
+  {
+    files: ["*.vue", "**/*.vue"],
+    languageOptions: {
+      globals: globals.browser,
+      parser: vueParser,
+      parserOptions: {
+        parser: tsParser,
+        sourceType: "module",
+      },
+    },
+  },
 ];

lambdarouter.md

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+import RepoButton from "./components/RepoButton.vue";
+</script>
+
+# lambdarouter
+
+This package contains a router, written in Golang, capable of routing many AWS Lambda API gateway
+requests to anything that implements the aws-lambda-go Handler interface, all in one Lambda
+function. It plays especially well with go-kit's awslambda transport package.
+
+This was originally designed for a work project where we wanted to consolidate code and Lambda
+functions. It did the job and was used all over our codebase for some time. I imagine it has since
+been retired.
+
+<RepoButton href="https://github.com/whip-networks/lambdarouter" />

mjfs-us-react.md

@@ -0,0 +1,14 @@
+<script setup lang="ts">
+import RepoButton from "./components/RepoButton.vue";
+</script>
+
+# mjfs.us (React.js version)
+
+The previous version of this site. I've built and rebuilt my personal website in many technologies,
+but this is just a simple TypeScript React SPA. Before using TS, I put Flow up to the same task and
+was pleasantly surprised, but ultimately won over in other projects by TS.
+
+This site was hosted on S3 and cached/distributed around the US by Cloudfront, much like the new
+site. It was also continuously deployed using TravisCI.
+
+<RepoButton href="https://github.com/mitchell/mjfs.us" />

mjfs-us.md

@@ -1,7 +1,16 @@
+<script setup lang="ts">
+import RepoButton from "./components/RepoButton.vue";
+</script>
+
 # mjfs.us
 
-This website is simple but effective and powered by [VitePress](https://vitepress.dev/). A static
-site generator that uses Vite and Vue under the hood.
+When creating this newest site, I decided to stick with TypeScript but instead go with Vue for fun.
+Its powered by [VitePress](https://vitepress.dev/), a static site generator that uses Vite under the
+hood to generate static HTML/JS/CSS assets from Markdown templates and Vue components. It's then
+uploaded to S3 and distributed around the US by Cloudfront.
 
-The content is composed with Markdown/Vue files then staticly rendered and deployed to AWS
-S3/Cloudfront for max performance and SEO optimization.
+So far I've really enjoyed writing the bulk of the content in Markdown, while being able to add in
+Vue single file components where desired. Vue feels very lightweight to write and use, even in this
+hybrid environment.
+
+<RepoButton href="https://github.com/mitchell/mjfs-us" />

mystro.md

@@ -15,9 +15,8 @@ semi-automated deployment via OTA updates.
 
 ## Technologies
 
-- React-Native
-- TypeScript
-- Swift iOS Native Modules
-- Java Android Native Modules
+- React-Native (TypeScript)
+- iOS Native Modules (Swift)
+- Android Native Modules (Java)
 - Serverless (AWS Lambda)
 - AWS DynamoDB & AppConfig

package.json

@@ -27,6 +27,7 @@
     "format": "prettier -w .",
     "lint": "eslint .",
     "check": "bun run format && bun run lint && bun run typecheck",
-    "clean": "rm -rf ./.vitepress/cache/ ./.vitepress/dist/"
+    "clean": "rm -rf ./.vitepress/cache/ ./.vitepress/dist/",
+    "git:add": "bun run check && git add -p"
   }
 }

rotabull.md

@@ -10,11 +10,9 @@ engineering lead and primary architect.
 
 ## Technologies
 
-- Elixir
-- C#
-- Typescript
-- React.js
-- Phoenix Framework
+- Phoenix (Elixir)
+- React.js (TypeScript)
+- .NET (C#)
 - PostgreSQL
 - OracleDB
 - SQL Server

selfpass.md

@@ -0,0 +1,16 @@
+<script setup lang="ts">
+import RepoButton from "./components/RepoButton.vue";
+</script>
+
+# selfpass
+
+Selfpass was intended to be a self-hosted single-user password manager capable of
+encrypting/decrypting credentials and storing them remotely through mutual, or two-way, TLS. All of
+which is deployable locally or to popular cloud platforms such as GCP and AWS. Some of the
+technologies used were go-kit, gRPC, Docker, Redis, and Flutter.
+
+While developing it, after the encryption was implemented, I used this project as my own password
+manager for while, before moving on to KeePassXC. I built it mostly out of interest in further
+exploring Golang and trying out Dart/Flutter for native development.
+
+<RepoButton href="https://github.com/mitchell/selfpass" />

tv-time.md

@@ -1,4 +1,4 @@
-# TV Time
+# TV Time (Whip Media)
 
 ## Backend Engineer