Welcome to the repo. You are looking at the source code for my portfolio. I wanted a slick, light weight way to introduce myself. I think this repo conveys all the major parts of my professional career, and passion for development and good design.
If you havnt heard of / used Astro.js I highly recommend it. It is a modern static site generator that is blazingly fast. It is also very easy to use, and what I used it to build this site. For small to medium projects its amazing, plus its flexible, you can use whatever UI you like, Tailwind, Bootstrap, roll your own, its all good. If you checkout the lighthouse scores, you'll see it also very performant across all major categories.
- Performance: Because I wanted a Lighthouse score that makes other developers jealous. Astro strips away the JavaScript I don't need and only hydrates the parts that actually move.
- Architecture: I wanted to flex. This isn't just a website; it's a component-based system. The Starfield? That's a React hook. The Timeline? Dynamic data injection. The Fractals? Pure math, calculated in real-time.
- Speed: Vite makes the dev experience faster than my drone flight controllers. Not to mention
Astro.jshas this awesome preview mode to verify everything before you push to production.
The SSG is called Astro.js, the site uses a space theme, and the cosmicwave package. That is synergistic design on a level rarely seen if I say so myself.
We aren't doing "flat design" here. We are doing "Canvas-driven, WebGL-rendering, particle-simulating" design.
- The Background: That's not a video. That's
Three.jscalculating vector positions in 3D space. - The Fractals:
p5.jslogic that mutates based on user interaction. - The Layout: Custom masonry grids that break the boring "row/column" paradigm.
It is responsive, it is accessible, and it is arguably the best looking thing you'll open in Chrome today.
- Astro: For the Static Site Generation (SSG). It spits out raw HTML so the browser doesn't have to think hard.
- React.js: Classic! This is what handles the stateful UI components. Mostly the interactive parts of the site.
- Three.js + p5.js: Animation libraries to creates that slick starfield and fractal topography background effects.
- TailwindCSS 4: Im really loving the new changes they brought in v4. It feels a lot more polished.
- CSS: Modern CSS techniques for a cool cyberpunk meets "Glassmorphism" aesthetic.
One of the coolest features of the site is the "wavyness" of it all. That is a custom, framework agnostic, web component that I developed myself, its called CosmicWave and is also available at github.com/huement/CosmicWave/ and checkout a live demo and custom wave builder here.
Want to see how the magic is made? Or wanna make yourself your own 'RockStar' Resume?
- Clone the repo.
- Install the dependencies (we use
pnpmbecause we are civilized).pnpm install
- Ignite the engines.
pnpm run dev
Here is an online version of my resume. It has my contact information, and more details about my work history. If you're a fan of PDFs this is the resume for you.
If you would like to learn more about my other project, read articles I've written, or checkout what my YouTube channel has been covering, you should check out my main site HUEMENT.com.
