Typescript Type System Adventure

tl;dr: Play a text adventure in vscode with the typescript type system.


I've always been a fan of text adventures since I first played Space Quest 1 when I was about 6 (though it was a graphical text adventure technically).

I've also always been a huge fan of typescript since it came out in 2012.

Now, since Typescript 4.1 is adding the powerful template-literal-types, I figured I could do something fun with them.

(I got the idea from here: https://github.com/codemix/ts-sql)

It occured to me, "Hey! Why not a text adventure!"



Typescript 'any' is evil

tl;dr: In Typescript, never use any

any is evil

any is typescript's rebelious 19 year old who was doing 80 on an icy mountain road, drove off a cliff, bounced down the side of the mountain in a giant fireball, was thrown from the fireball car, landed in a frozen river, and was finally swept out to sea and eaten by sharks.

any is the implementation in typescript of the 'this is fine' meme. This gif is perfect:

any => bugs



Cool Stuff

So, almost all my content is hidden, so this post will highlight some things to play with.

Introduction to the Site

Basically, this is a website all built in react. It uses a simplified version of gatsby to generate a static website with async loaded components. That is hosted on netlify which basically provides free https, simple dns management, and git deploy with auto CDN cache expiration. In addition, I use serverless framework cli to define my AWS infrastructure and deploy the serverless stuff from command line. Essentially, I can make anything and deploy it in about 30 secs.

Some Interesting Things

Some interesting things:

Site Header



User Beneficial

tl;dr: Ensure that your software provides a beneficial impact on the life of each person who uses it.


We software developers: engineers, designers, architects, etc. - all need to ensure that using out software is healthy and beneficial.


  • How does using my software affect each user's life?
  • How much time would be healthy for a person to use this?
  • How often would I encourage my child to use this (assuming they had the role of the intended audience)?
  • How does using this affect the user's social health?
  • How does using this affect the user's physical health?
  • How does using this affect the user's financial health?



Customize Gatsby Blog

Remove all the placeholder content and fill your blog with you.

Customize your About Page

  • Open pages/about.md
  • Write a short bio about yourself as a new software developer

Remove the Placeholder Content

We won't delete this yet, so you can look back on it for a reference.

  • Rename posts/example.md to posts/example.md.old
  • Rename posts/hello.md to posts/hello.md.old



Build Gatsby Blog

Gatsby is a static site generator based on React.

What this practically means is that you can create a great website that is super fast, but still allows you to code in the best UI Framework (React) to customize and create powerful components.

It has a great ecosystem and is very popular. In fact, the React team uses Gatsby for their docs pages.

Preview the Target

Create a Netlify Account




Hi there

My name is Rick:



© 2020 Rick Love