Initial commit

.gitignore

@@ -1,4 +1,2 @@
-.parcel-cache
-dist
 node_modules
-*.log
+dist

.prettierrc

@@ -0,0 +1,7 @@
+{
+  "singleQuote": false,
+  "semi": true,
+  "tabWidth": 4,
+  "arrowParens": "avoid",
+  "trailingComma": "all"
+}

.tool-versions

@@ -0,0 +1 @@
+nodejs 20.9.0

components/Wrapper.css.ts

@@ -0,0 +1,5 @@
+import { globalStyle } from "@vanilla-extract/css";
+
+globalStyle("body", {
+    margin: 0,
+});

components/Wrapper.tsx

@@ -0,0 +1,10 @@
+import { ReactNode } from "react";
+import "./Wrapper.css";
+
+export interface WrapperProps {
+    children: ReactNode;
+}
+
+export function Wrapper({ children }: WrapperProps) {
+    return children;
+}

data/projects.yaml

@@ -0,0 +1,123 @@
+- title: Artiller
+  type: individual
+  iconPath: /assets/icons/artiller.svg
+  dates: Oct 2021
+  sourceCode: https://github.com/Alduino/CAB432-A2
+  tech:
+    - NextJS / React
+    - Chakra UI
+    - GPT-3
+  description: |
+    Artiller is a university project that was created to learn about data storage and caching.
+    It is a web application that aggregates online articles and blog posts, allowing users to search based on
+    keywords, tags, authors, or a link. This information is also used to recommend similar articles.
+    GPT-3 is used to generate tags for articles where they are missing.
+- title: Tweetch
+  type: individual
+  iconPath: /assets/icons/tweetch.svg
+  dates: Sep 2021
+  sourceCode: https://github.com/Alduino/CAB432-A1
+  tech:
+    - React
+    - Chakra UI
+    - Express
+  description: |
+    Tweetch is a university project that was created to demonstrate creating a full—stack web application using
+    third—party APIs. Its purpose is to help users discover streamers on Twitch, based on who they follow on Twitter.
+    It also shows relevant tweets during a stream to get a wider context of what is happening.
+    Finally, it connects to the YouTube API to show the latest VOD from the creator, in case you missed the stream.
+- title: Muzik
+  type: individual
+  iconPath: /assets/icons/muzik.svg
+  dates: 2021 - now
+  sourceCode: https://github.com/Alduino/Muzik
+  tech:
+    - Vite / React
+    - Electron
+    - TRPC
+    - Vanilla Extract
+  description: |
+    I haven’t been able to find a music player that is exactly how I like, so I decided to make my own.
+    It’s a music player pretty much. Currently it can play music, and that’s about it.
+    However I do plan to add more features, such as lyrics and playlists.
+- title: Hapico
+  type: individual
+  iconPath: /assets/icons/hapico.svg
+  dates: Apr - May 2021
+  sourceCode: https://gitlab.com/Alduino/cab230-a1/
+  tech:
+    - React
+    - Chakra UI
+    - Mapbox
+  description: |
+    Hapico was created for a university assignment to display data from the World Happiness Report.
+    The site was designed to format the data in an easily digestible way, and to be visually appealing.
+    The main feature is a map that allows you to quickly find the happiness score of a country.
+- title: RadiantPM
+  type: individual
+  iconPath: /assets/icons/radiantpm.svg
+  dates: 2022 - now
+  sourceCode: https://github.com/radiantpm/radiantpm
+  tech:
+    - Vite / React
+    - Stitches
+  description: |
+    RadiantPM is a self—hosted package manager, created for use internally at the Radiant Guild to
+    host our private npm and nuget packages. It's designed around a plugin system so it can be extremely configurable,
+    after an original attempt failed due to increasing development difficulty.
+    
+    Currently, the project is functional but early in development. It supports npm package hosting, and can be
+    configured with various authorisation and storage methods.
+- title: Experiments
+  type: individual
+  iconPath: /assets/icons/experiments.svg
+  dates: 2020 - now
+  sourceCode: https://github.com/alduino/experiments
+  website: https://experiments.alduino.dev
+  tech:
+    - Typescript
+    - Graphics
+    - Web Audio
+  description: |
+    A collection of small experiments I’ve made, to test concepts and learn new things.
+    To simplify the process of creating new experiments, I’ve created a framework that handles the boilerplate code,
+    including the canvas, event handling, a component system, and coroutine management.
+- title: The Radiant Guild
+  type: group
+  iconPath: /assets/icons/rg.svg
+  dates: 2020 - now
+  sourceCode:
+    label: GitHub org
+    url: https://github.com/radiantguild
+  tech:
+    - NextJS / React
+    - Vanilla Extract
+    - React Query
+    - ASP.net
+  description: |
+    The Radiant Guild is a community of comic artists, writers, and enthusiasts, currently with around 45 members.
+    The website is a place for creators to share their work, and for readers to discover new comics.
+    At the moment, the site is being redesigned and rebuilt from the ground up to be more performant and easier to
+    develop.
+    
+    I’m working on the front-end of the site, including design, tooling, and development.
+    My friend [AUSBird](https://github.com/ausbird) is creating the back-end.
+- title: ZoneONE
+  type: group
+  iconPath: /assets/icons/zoneone.svg
+  dates: 2019 - now
+  tech:
+    - NextJS / React
+    - Vanilla Extract
+    - Prisma
+    - trpc
+    - GTFS
+  description: |
+    ZoneONE is a website that tracks public transport in south—east Queensland.
+    As the site is specifically for SEQ, it is able to provide more detailed information specific to the region.
+    
+    I’m doing the development of the site, based on UI designs and algorithms created by my friend
+    [pionsix](https://github.com/pionsix).
+    
+    Currently the site is still in early development, however there is an early version available at
+    [dev.zoneone.app](https://dev.zoneone.app).

package.json

@@ -1,36 +1,34 @@
 {
-  "name": "alduino-website",
-  "version": "1.0.0",
-  "description": "https://alduino.dev",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/Alduino/alduino.dev.git"
-  },
-  "browserslist": "> 0.5%, last 2 versions, not dead, not ios_saf < 13",
-  "source": "src/index.html",
+  "name": "private",
+  "type": "module",
   "scripts": {
-    "dev": "parcel",
-    "build": "parcel build"
-  },
-  "author": "Alduino",
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/Alduino/alduino.dev/issues"
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
   },
-  "homepage": "https://alduino.dev",
+  "keywords": [],
+  "author": "",
   "devDependencies": {
-    "@parcel/transformer-sass": "^2.6.2",
-    "parcel": "^2.6.2",
-    "postcss": "^8.4.14",
-    "postcss-import": "^14.1.0",
-    "postcss-nesting": "^10.1.10",
-    "postcss-url": "^10.1.3"
+    "@types/node": "^20.14.9",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
+    "@vanilla-extract/vite-plugin": "^4.0.11",
+    "@vitejs/plugin-react-swc": "^3.7.0",
+    "prettier": "^3.3.2",
+    "typescript": "^5.5.2",
+    "vite": "^5.3.1"
   },
   "dependencies": {
-    "@equinor/videx-vector2": "^1.0.44",
-    "@fontsource/inter": "^4.5.11",
-    "@fontsource/montserrat": "^4.5.11",
-    "@mdi/svg": "^6.9.96",
-    "glea": "^1.3.1"
+    "@fontsource/kanit": "^5.0.20",
+    "@fontsource/kulim-park": "^5.0.13",
+    "@vanilla-extract/css": "^1.15.3",
+    "@vanilla-extract/css-utils": "^0.1.4",
+    "@vanilla-extract/dynamic": "^2.1.1",
+    "@vanilla-extract/recipes": "^0.5.3",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "vike": "^0.4.177",
+    "vike-react": "^0.4.15",
+    "yaml": "^2.4.5"
   }
 }

pages/+config.ts

@@ -0,0 +1,9 @@
+import vikeReact from "vike-react/config";
+import type { Config } from "vike/types";
+import { Wrapper } from "../components/Wrapper";
+
+export default {
+    Wrapper,
+    title: "Zach Barham",
+    extends: vikeReact,
+} satisfies Config;

pages/_error/+Page.tsx

@@ -0,0 +1,20 @@
+import React from "react";
+import { usePageContext } from "vike-react/usePageContext";
+
+export default function Page() {
+  const { is404 } = usePageContext();
+  if (is404) {
+    return (
+      <>
+        <h1>404 Page Not Found</h1>
+        <p>This page could not be found.</p>
+      </>
+    );
+  }
+  return (
+    <>
+      <h1>500 Internal Server Error</h1>
+      <p>Something went wrong.</p>
+    </>
+  );
+}

pages/index/+Page.tsx

@@ -0,0 +1,39 @@
+import React from "react";
+import {
+    containerClass,
+    contentContainer,
+    linkClass,
+    linkItemClass,
+    linksContainerClass,
+    separatorClass,
+    subtitleClass,
+    titleClass,
+} from "./styles.css";
+
+import "@fontsource/kanit/latin-900.css";
+import "@fontsource/kulim-park/latin.css";
+
+export default function Page() {
+    return (
+        <div className={containerClass}>
+            <div className={contentContainer}>
+                <h1 className={titleClass}>Zach Barham</h1>
+                <p className={subtitleClass}>Frontend developer // and some hobbies</p>
+                <hr className={separatorClass} />
+                <ul className={linksContainerClass}>
+                    <li className={linkItemClass}>
+                        <a className={linkClass} href="https://github.com/alduino" target="_blank">Github</a>
+                    </li>
+                    <li className={linkItemClass}>
+                        <a className={linkClass} href="https://www.linkedin.com/in/zach-barham/"
+                           target="_blank">LinkedIn</a>
+                    </li>
+                    <li className={linkItemClass}>
+                        <a className={linkClass} href="https://github.com/alduino/alduino.dev"
+                           target="_blank">Source</a>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    );
+}