smrth

Hyper

A summer's work at a $3M MRR startup.

TypeScript • TypeDoc • SDK • Next.js • Tailwind CSS • Website

A summer's work at a $3M MRR startup.

At 17, I left high school to move across the country to Silicon Valley, where I was one of two engineers on Hyper's core team. I spent the summer moving fast and breaking nothing (thankfully), while also getting to build for tens of thousands of end users.

Though it got acquired, Hyper was a platform for monetizing digital communities (like Discord servers) and raised a $20M Series A from top VC's after attending Y-Combinator. Working full time at such a high velocity, high impact startup gave me invaluable experience. Though I can't share the majority of the work I did, here are two highlights.

The Landing Page

What is it?

Hyper's landing page is the first point of contact for potential customers and represents a product that's raised over $15 million.

How do I see it?

Hyper was acquired, so the site is no longer up. But here are some screenshots:

Home

You can scroll around on an archived version of the site using the Wayback Machine, but be warned the Javascript and underlying image sources will be missing so it'll be imperfect.

Key Features

  • Used React CountUp for animated key stats
  • Fully custom shared animation state for Trusted By section to show off our biggest customers
  • Intuitive "flow" in the Features section (inspired by Linear)
  • Reviews section (inspired by Stripe)
  • Mobile-first design that looks great on all devices

Hyper.js

What is it?

Hyper.js is a complete SDK (software development kit) for Hyper's API. The API has several features, each with their own set of endpoints, that are available to be accessed via namespaces. Methods on these namespaces correspond to calls to specific endpoints. A client needs to be imported, initialized, and then supplied to all calls to provide the pertinent authorization (API key) for the requests.

How do I get it?

Hyper.js is available on the Node Package Manager, where it has over 300 downloads, and can be installed via npm:

npm install @http-samc/hyper

The source code is available on GitHub at @http-samc/hyper.js.

How do I use it?

Hyper.js uses TypeDoc to autogenerate technical documentation based off TypeScript declarations. The documentation website (including a quickstart guide) can be found at hyperjs.smrth.dev.

Key Features

  • Intuitive design, functions on an import-as-needed basis
  • Detailed but not verbose documentation
  • Paginated endpoints return responses with next and previous methods for easy navigation
  • Type declarations supplied out of the box