The ultimate startup tech stack

Written by

Andrew Askins

The featured image for this blog post.

One afternoon in August of 2019, I sat down and vented this into my keyboard —

YOUR TECH STACK DOESN’T MATTER.

At the time, we specialized in greenfield development (building apps from nothing) for non-technical founders. Now and then, I would have a sales call with a founder, or meet someone at an event, and they would ask me what tech we used at Krit.

I got good at rattling off the technologies we choose and why. But really, they were asking the wrong question.

What I used to believe about tech stacks — and what’s changed

See, if you’re a brand new startup, picking a tech stack is a distraction. It doesn’t matter nearly as much as understanding your customers and building an audience.

For example, people love to say Rails doesn’t scale, but neither does a massive burn rate and zero customers. Plus, if you have a bunch of customers, you can raise money and hire database experts to make it scale (see: Github).

My opinion used to be this: you should pick whatever your team knows best. This will let you get started quickly and run with it.

What’s changed: InfoSec has unique challenges

Now, a year and a half later, we do product design for more established InfoSec clients. And if you’re in InfoSec, the equation changes. Even more so if you’re selling to enterprise customers, which most InfoSec vendors right now are.

Don’t get me wrong, a deep understanding of your customers' lives and pain points is still way more important than which programming language you choose. After all, if Github can manage the majority of the world’s open-source repositories on Rails, I’m sure your honeypots can get by.

But InfoSec startups face some unique challenges:

  1. You’re a target from day one. If you’re an InfoSec business, you have a target on your back. If you’re helping your customers stay secure, you need to be secure, too.
  2. You’re dealing with a lot of data. Sure, you could throw all that data in a relational database and cross your fingers it doesn’t get unmanageable. But if you know data is core to what you do, then it makes sense to pick tools that are good at managing high volumes of data.
  3. Your enterprise customers have high expectations for reliability and there’s a small margin for error.
  4. Talent is even scarcer than in the rest of the tech industry, so you don’t want to pick tools that are going to make it HARDER to hire.

These challenges mean our tech stack matters more now, too.

  1. We can’t be the gaping hole in your security infrastructure.
  2. We need to be flexible enough to plug into a variety of backend systems.
  3. We need to get buy-in from your team to do our job, so we need to use tech they’re excited about.

From “tech stack” to “product stack”

So, we’ve set out to update our tools, and find the ultimate infosec product stack.

I say product stack because we’re no longer building everything (i.e. we’re no longer building APIs and infrastructure). Most often, we’re integrating into a client’s team and serving as product designers, web and frontend developers, product managers — and occasionally lending some help on the backend.

So, we’re no longer concerned with end-to-end tech stacks. Instead, we’re focused on solutions that let us create the best products for our clients.

We’ve shifted from tech stacks to product stacks.

The typical tech stack includes:

Whereas the elements of an InfoSec Product Stack include:

The InfoSec Product Stack

Here’s what we rely on for each part of the InfoSec Product Stack:

Before I dive into each one of those, here's why those are the tools and frameworks we use.

The philosophy behind our product stack

You’ll notice a trend in the tools we choose now, over the tools we chose when we were getting started. We optimize for developer-friendly tools that are fast, lightweight, and easy to customize. We work with a variety of clients who have their own tech requirements, so we need to be able to adapt our toolset to fit theirs. We also believe that speed and security are core components of good UX, so if a tool doesn’t fit that philosophy it’s not going to work long term.

With that in mind, here's what we use for each part of our product stack.

Figma: a powerhouse for prototyping products

Figma did for design tools what Google Drive did for document editors. Figma is a 100% cloud-based (I can’t believe I just wrote that without grimacing) design tool. There’s nothing you have to download, and multiple people can work on a document at the same time.

There are still limitations to the animations you can create in Figma, and there are times where you need finer detail for creating vector graphics. So we still lean on other tools, but Figma is our workhorse.

Hugo + Forestry: the best content management systems for most InfoSec companies

We’ve tried countless popular CMS-es and we’ve finally landed on a couple of favorites. Those favorites are:

Webflow: a no-code CMS

If you’re early-stage, and you want your marketing team to be able to experiment and change designs regularly, we recommend Webflow. Webflow is a no-code CMS and website designer that makes it easy to stand up websites quickly. It’s relatively fast, and there’s no infrastructure to manage yourself.

Hugo + Forestry: static site generators with a headless CMS

However, if your team is more technical and you have a little more time, a static site generator with a headless CMS is the way to go. Static sites are super fast and lightweight which is better for SEO than any amount of meta-tag optimization will be.

And you can more easily integrate a static site into your product. There are pros and cons to integrating your marketing site and product, but doing so can create a nicer user experience and make tracking conversions through the entire funnel simpler.

Really, any static site generator with a headless CMS will get the job done, but our votes for a pure marketing site are Hugo and Forestry.

Vue + Nuxt: a secure, fast way to build modern web apps

For a lot of the same reasons static site generators are gaining momentum for marketing sites, server-side rendering is making a comeback on the application side. Server-side rendering has serious security (you’re exposing less of your code) and speed (there’s less you have to download when you hit the page) advantages. This means better UX and SEO.

But we’re not quite ready to give up all the innovation that has gone into Single Page Applications (SPAs). SPAs still make it easier to manage the flow of data through a complex application and to create that “app-like” feel. We prefer to get the best of both worlds with a server-side rendered Vue.js application using Nuxt.js.*

Vue is a lightweight, developer-friendly javascript framework for building SPAs. It’s gained a ton of momentum in recent years because it’s incredibly friendly to developers, and now has one of the strongest communities.

As we’ve started to make the shift to server-side rendering, we’ve also adopted Nuxt because it’s built for Vue. Nuxt is modular, performant, and enjoyable to work with.

*Years ago, we were an Ember.js shop. Ember was trying to be the Rails of the frontend javascript world. It was an opinionated framework designed for developer speed. If you build your API using the same conventions everywhere, you can quickly spin up an Ember application and get it integrated. But if your conventions vary at all, as they often need to in the real world, you run into problems quickly. That’s why we now rely on Vue and Nuxt.

Tailwind: the best CSS framework in production today

Shortly after we started our agency, we abandoned Bootstrap as a CSS framework. We were spending more time fighting with the framework than building with it, and everything came out looking the same. People were hiring us for custom designs, and while we wanted to move quickly, Bootstrap wasn’t worth it.

Over the years we’ve tried several alternative lightweight frameworks like Bulma and Bourbon, but nothing ever stuck — until Tailwind.

Tailwind makes writing CSS feel more intuitive, but it doesn’t lock you into a specific style. They have optional UI add-ons that give you design guardrails if you need them, or you can go fully custom like we do.

It also:

Tailwind has taken the CSS world by storm in the past year, it has a huge community, and is widely admired by frontend devs. We love it and don’t see ourselves switching anytime soon.

Prioritizing speed, security, and client priorities

There are tons of options out there to build your toolbox, and we’ll certainly explore and tweak in the years to come.

But here’s what we’ve used so far in our work with the world’s leading InfoSec product teams:

Curious what kinds of InfoSec products we build? Check out how we helped GreyNoise increase Daily Active Users by 62% and how we helped Sentinel condense millions of data points onto one intuitive screen.

Andrew is our fearless leader. If you want to chat about startups, football or cooking shows you can hit him up on Twitter. If you enjoyed this post it would be a huge help if you shared it or signed up for our newsletter.