Meta: About This Website

Meta: About This Website

Thanks for coming through! Welcome to my personal website, where you'll find project updates, essays, and whatever other content I find the spark to create.

This site itself is a project, built by me to share my ideas and indulge my love of internet technology. I like fast websites that let the content shine. Here's my (continuous) attempt at creating one.

A bit about the website and how it works:

Front End

My concept for a great personal website is to make the content exploration process dynamic and powerful, while the content itself should be static for optimal performance.

What you're experiencing now is a static site built with Gatsby and embellished with client side JavaScript for the interactive exploration pages. Static sites are fast and Gatsby makes them a pleasure to build. If you're unfamiliar with Gatsby, I recommend starting with the conceptual guide.

I use tailwindscss to style most of the website, and gatsby-plugin-purgecss to get rid of unused classes. All the CSS files are less than 30kb total!

Graph View

Graph View uses Cytoscapejs to implement the interactive graph. I created a Reactjs app that utalizes the Ghost content API to graphically build, style, and export the graph.

I use the Ghost API to load in new posts, where I can add them to the graph. I host the app locally so the browser doesn't always render the hot linked thumbnails.
The graph can be easily edited and styled.
Nodes (posts) can be added and removed on the fly.

Clicking on a post in Graph View loads the post in a modal and updates the browser URL. I used the plugin gatsby-plugin-modal-routing for that. I wanted to implement that feature to make Graph View more enjoyable to browse.

I'm working on adding more content exploration tools to both List View and Graph View.

Back End

The Stack

The CMS is Ghost. Ghost is awesome! It's easy to self host and makes all content available through flexible APIs.

The Ghost content API is hosted on a GCP VM. The stack comes from the standard Ghost deployment on Ubuntu:

  • Server: Nginx
  • DB: MySQL
  • Runtime Env: Node.js
  • CMS: Ghost

Check out my tutorial on deploying Ghost.

The Hardware

The server is a GCP g1-small compute instance running Ubuntu 16.04 LTS. The VM only serves the Ghost content API and the Ghost admin. The front end files are served by Netlify.

Data Collection & Privacy Policy

This website doesn't collect any user data.