Rebuilding the Twitter Embed Widget!

leerob wanted a page for saving favorite tweets, but the usual embed approach loads each tweet in an iframe and was slow when the page had several. He set out to fetch tweet data through Twitter’s API and generate the page statically.

He first mocked up a streamlined tweet in Tailwind Play, then reviewed Twitter’s v2 API requirements, including a developer account, project, app, and API token. His `getTweets` function requests tweet fields and related data such as media and referenced authors, using a bearer token for authentication.

A Next.js API route let him inspect the raw response, where media and users arrived as separate objects. Helper functions join media keys to media objects and author IDs to user details, while `reduce` builds a top-level array of enriched tweets.

The `/tweets` page uses `getStaticProps` to fetch tweet IDs and pass the results into a React component. The component fills in author details, verification status, images, formatted text, metrics, and dates; it also calls itself to display quote tweets. The 171-line component handles text, images, and quote tweets, while video, GIF, and reply support remain possible additions.