May 21, 2021

Events In React


First Post

whatever
Beautiful scene

One of the things we believe as a team is that everything we make should be sealed with a blog post. Forcing ourselves to write up a short announcement post for every project we work on acts as a built-in quality check, making sure that we never call a project "done" until we feel comfortable telling the world it's out there.

The problem was that up until today, we didn't actually have anywhere to publish those posts!

Choosing a platform

We're a team of developers so naturally there was no way we could convince ourselves to use something off-the-shelf, and opted to build something simple and custom with Next.js.

There are a lot of things to like about Next.js, but the primary reason we decided to use it is that it has great support for MDX, which is the format we wanted to use to author our posts.

import { bradlc } from '@/authors'
import openGraphImage from './card.jpeg'

export const meta = {
  title: 'Introducing linting for Tailwind CSS IntelliSense',
  description: \`Today we’re releasing a new version of the Tailwind CSS IntelliSense extension for Visual Studio Code that adds Tailwind-specific linting to both your CSS and your markup.\`,
  date: '2020-06-23T18:52:03Z',
  authors: [bradlc],
  image: openGraphImage,
  discussion: 'https://github.com/tailwindcss/tailwindcss/discussions/1956',
}

// Post content goes here

MDX is really interesting because unlike regular Markdown, you can embed live React components directly in your content. This is exciting because it unlocks a lot of opportunities in how you communicate ideas in your writing. Instead of relying only on images, videos, or code blocks, you can build interactive demos and stick them directly between two paragraphs of content, without throwing away the ergonomics of authoring in Markdown.

We're planning to do a redesign and rebuild of the Tailwind CSS documentation site later this year and being able to embed interactive components makes a huge difference in our ability to teach how the framework works, so using our little blog site as a test project made a lot of sense.

Organizing our content

We started by writing posts as simple MDX documents that lived directly in the pages directory. Eventually though we realized that just about every post would also have associated assets, for example an Open Graph image at the bare minimum.


Last Updated: July 25, 2021