diff --git a/project-words.txt b/project-words.txt
index 141346e..0893b85 100644
--- a/project-words.txt
+++ b/project-words.txt
@@ -16,6 +16,7 @@ Dechorionator
ebox
fhhs
flowbite
+Gitea
HDFS
headshot
Homelab
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index b9d1939..af98c0e 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -1,10 +1,23 @@
---
+import InlineLink from "@components/InlineLink.astro";
+const { pathname } = Astro.url;
---
diff --git a/src/components/InlineLink.astro b/src/components/InlineLink.astro
index a302e00..93f5428 100644
--- a/src/components/InlineLink.astro
+++ b/src/components/InlineLink.astro
@@ -7,16 +7,10 @@ interface Props extends ComponentPropsBase {
}
const { class: className, href, target } = Astro.props;
+const { pathname } = Astro.url;
-let finalTarget: string | undefined = target;
-
-if (target === undefined) {
- if (href.startsWith("/")) {
- finalTarget = "";
- } else {
- finalTarget = "_blank";
- }
-}
+const finalTarget =
+ target === undefined ? (href.startsWith("/") ? undefined : "_blank") : target;
---
<>
@@ -24,6 +18,7 @@ if (target === undefined) {
class:list={["text-blue-500", "hover:text-blue-300", className]}
href={href}
target={finalTarget}
+ aria-current={pathname === href ? "page" : undefined}
>
diff --git a/src/components/NestedNavbarEntries.astro b/src/components/NestedNavbarEntries.astro
index 0a4c0c4..30b94e5 100644
--- a/src/components/NestedNavbarEntries.astro
+++ b/src/components/NestedNavbarEntries.astro
@@ -1,20 +1,12 @@
---
import type { navLink } from "@interfaces/site-layout.ts";
+import { getHrefPath, getNavLinkSuffix } from "@data/site-layout.ts";
+
const items: navLink[] = Astro.props.items;
const depth: number = Astro.props.depth ?? 0;
const paths: string[] = Astro.props.paths ?? [];
-const getNavLinkSuffix = (entry: navLink): string => {
- return "-" + [...paths, entry.path].join("-");
-};
-const getHrefPath = (entry: navLink): string => {
- return entry.pubpath
- ? entry.pubpath
- : "/" +
- (paths && paths.length ? [...paths, entry.path].join("/") : entry.path);
-};
-
const { pathname } = Astro.url;
---
@@ -29,21 +21,22 @@ const { pathname } = Astro.url;
{
items.map(
(entry) =>
- (entry.enabled ?? true) && (
+ (entry.enabled ?? true) &&
+ !(entry.hidden ?? false) && (
{Array.isArray(entry.children) && entry.children.length ? (
{entry.navText}
diff --git a/src/components/PopoverWordDefinition.astro b/src/components/PopoverWordDefinition.astro
index d9d559d..271fa90 100644
--- a/src/components/PopoverWordDefinition.astro
+++ b/src/components/PopoverWordDefinition.astro
@@ -14,6 +14,7 @@ const keys: { [key: string]: string } = {
TDD: "Test driven development",
UPS: "Uninterruptible power supply",
VISA: "Virtual instrument software architecture",
+ VPS: "Virtual private server",
};
const key: string | undefined = Astro.props.key;
diff --git a/src/components/Ul.astro b/src/components/Ul.astro
index a6a749b..6825377 100644
--- a/src/components/Ul.astro
+++ b/src/components/Ul.astro
@@ -13,7 +13,11 @@ const { class: className, lineItems, depth = 0 } = Astro.props;
---
0 ? "ps-3" : false]}
+ class:list={[
+ "list-outside list-disc",
+ className,
+ depth > 0 ? "ps-3" : "ms-3",
+ ]}
>
{
lineItems ? (
diff --git a/src/data/site-layout.ts b/src/data/site-layout.ts
index 18b290f..d0dd984 100644
--- a/src/data/site-layout.ts
+++ b/src/data/site-layout.ts
@@ -1,6 +1,7 @@
import type { navLink } from "@interfaces/site-layout.ts";
export const siteLayout: navLink[] = [
+ // Standard navbar entries
{ navText: "About", path: "" },
{ navText: "Education", path: "education" },
{
@@ -187,6 +188,7 @@ export const siteLayout: navLink[] = [
},
{ enabled: false, navText: "NixOS", path: "nixos" },
{ navText: "Body Mods", path: "body-mods" },
+ { navText: "This Website", path: "this-website" },
],
},
{
@@ -268,3 +270,13 @@ export const getPaths = (
}
return [...new Set(foundPaths)];
};
+
+export const getNavLinkSuffix = (paths: string[], entry: navLink): string => {
+ return "-" + [...paths, entry.path].join("-");
+};
+export const getHrefPath = (paths: string[], entry: navLink): string => {
+ return entry.pubpath
+ ? entry.pubpath
+ : "/" +
+ (paths && paths.length ? [...paths, entry.path].join("/") : entry.path);
+};
diff --git a/src/interfaces/site-layout.ts b/src/interfaces/site-layout.ts
index 48facb1..19bb829 100644
--- a/src/interfaces/site-layout.ts
+++ b/src/interfaces/site-layout.ts
@@ -1,5 +1,6 @@
export interface navLink {
enabled?: boolean;
+ hidden?: boolean;
navText: string;
path?: string;
pubpath?: string;
diff --git a/src/pages/hobby/this-website.astro b/src/pages/hobby/this-website.astro
new file mode 100644
index 0000000..4a37d61
--- /dev/null
+++ b/src/pages/hobby/this-website.astro
@@ -0,0 +1,120 @@
+---
+import ExperienceLayout from "@layouts/ExperienceLayout.astro";
+
+import H3 from "@components/H3.astro";
+import InlineLink from "@components/InlineLink.astro";
+import PageGroup from "@components/PageGroup.astro";
+import Paragraph from "@components/Paragraph.astro";
+import Paragraphs from "@components/Paragraphs.astro";
+import PopoverWordDefinition from "@components/PopoverWordDefinition.astro";
+import SkillMatrix from "@components/SkillMatrix/SkillMatrix.astro";
+
+import type { categorySkills } from "@interfaces/skill-matrix.ts";
+
+const categorizedSkills: categorySkills[] = [
+ {
+ category: "Software & Environments",
+ skills: [
+ {
+ item: "DevOps",
+ subItems: [
+ { item: "Github Actions" },
+ { item: "dev/staging/production environments" },
+ { item: "automatic build/test/deploy" },
+ ],
+ },
+ { item: "Git" },
+ {
+ item: "Docker",
+ subItems: [
+ { item: "Custom Builds" },
+ { item: "Registry & Asset Management" },
+ ],
+ },
+ {
+ item: "Programming Languages",
+ subItems: [
+ { item: "HTML" },
+ { item: "CSS" },
+ { item: "Typescript" },
+ { item: "Bash" },
+ { item: "Makefile" },
+ ],
+ },
+ {
+ item: "Web Frameworks",
+ subItems: [
+ { item: "Astro" },
+ { item: "tailwindcss" },
+ { item: "flowbite" },
+ ],
+ },
+ {
+ item: "Operating Systems",
+ subItems: [
+ {
+ item: "Linux",
+ subItems: [{ item: "NixOS" }, { item: "Alpine Linux" }],
+ },
+ ],
+ },
+ ],
+ },
+];
+---
+
+
+
+ Summary
+
+
+
+ While I've traditionally used Wordpress to build my websites in the
+ past, I finally decided to make a custom one after developing the skills
+ to do so at SpaceX. I still wouldn't call myself a web developer by trade, but I take
+ great pride in being able to create things on my own, and have also felt
+ that Wordpress was overkill for a simple portfolio website. It also gave
+ me a chance to put my DevOps skills to use at home, which I've been
+ wanting to do for a while.
+
+
+ The core framework of my website is Astro, chosen for its focus on static site generation and de-duplication of
+ code via re-usable components. This seemed like the perfect middle-ground of providing enough
+ structure and quality-of-life features to reduce the overall effort of
+ building the site, without being overly bloated or opinionated. So far
+ I've been incredibly happy with this decision, and would recommend it to
+ others looking to build static websites. To add some helpful styling
+ utilities, and basic web components, tailwindcss and flowbite were also
+ added. Like my decision to use Astro, these both provided good starting points
+ for creating a website that felt like my own, without struggling for too long
+ at the start.
+
+
+ From the DevOps perspective, I created a Makefile within the repo for
+ local development targets to build, run, and test both in a pure
+ context, and within a Docker container. After pushing updates on a
+ branch to my local Gitea instance, and opening a pull request, the
+ website performs spelling checks, runs unit tests, and integration
+ tests. Once these pass, the website is built into a Docker container and
+ uploaded to the registry in my Gitea instance. The image is then
+ deployed to staging on my , allowing
+ for manual validation of the changes. In order to merge, the build,
+ test, and deploy actions must pass, and ideally I should be empirically
+ validating the staging deployment. After merging and closing the pull
+ request, another action builds, tests, and deploys the main branch in
+ the same way as before, but to production, and is what you see here!
+
+
+
+
+