Profile Lucas Sta Maria

I'm a third-year Computer Science and Mathematics student at Northeastern University interested in programming languages and developer tooling.

(λx.x x) (λx.x x)

Personal Website

Vue and Nuxt

The second iteration of my personal website was built with Nuxt.js and Vue.js. Nuxt.js was used for static site generation, which then was deployed using a hack-ish script to GitHub pages.

My directory structure was as follows:

$ exa -DT --git-ignore
.
├── assets
│  ├── css
│  ├── fonts
│  │  ├── Inter
│  │  └── Roboto
│  └── images
├── components
├── content
│  ├── articles
│  ├── awards
│  └── projects
├── pages
│  ├── blog
│  └── projects
└── static

$ exa -dT --git-ignore pages
pages
├── awards.vue
├── blog
│  ├── _slug.vue
│  └── index.vue
├── experience.vue
├── index.vue
└── projects
   ├── _slug.vue
   └── index.vue

Svelte and SvelteKit

On my third iteration, I've moved to Svelte and SvelteKit, along with TailwindCSS for styling. I follow a similar method of deploying to GitHub pages.

The directory structure on the third iteration, to contrast, is as follows:

$ exa -DT --git-ignore
.
├── public
│  └── images
├── src
│  ├── lib
│  │  └── components
│  └── routes
│     ├── awards
│     ├── blog
│     ├── experience
│     └── projects
└── static
   ├── blog
   ├── experience
   ├── fonts
   │  └── static
   └── projects

Svelte allowed for an expressive and comfortable creation of the frontend, and TailwindCSS streamlined its design.

Racket and Pollen

I decided to experiment with the fourth iteration by using Racket and Pollen and falling back to plain CSS.

My directory structure is now comparatively simple.

$ exa -DT --git-ignore
.
└── src
 ├── blog
 ├── projects
 └── static
    ├── css
    └── fonts

org-mode

I find org-mode to be an incredibly practical format for writing websites. I've since transitioned off my #lang pollen Racket website and into org-mode.