TwiterStats is an open-source Twitter followers tracker built with Next.js that shows a real-time follower count, exports your Twitter profile card as an image, and includes dark mode.
What is TwiterStats?
TwiterStats is a web application that tracks a Twitter account's follower count in real time and renders it as a shareable profile card. It takes a Twitter user's credentials through the Twitter OAuth flow, fetches follower data via the Twitter API using the twitter-lite server library, and displays the count with a tilt effect on a card that can be exported as an image. The app was created by developer Nilanth, is released under the MIT License, and is designed to run on Next.js with deployment presets for Vercel, Netlify, and DigitalOcean App Platform.
Key Features
- Real-time followers count — Uses SWR React hooks to fetch and display the logged-in Twitter user's follower count as it changes, without manual page refreshes.
- Profile card export as image — Generates a PNG of the profile card from the DOM using the html-to-image library, which relies on HTML5 canvas and SVG.
- Dark Mode Support — Implemented with next-themes, letting users toggle between light and dark appearances.
- Twitter authentication — NextAuth handles the OAuth login with TWITTER_ID and TWITTER_SECRET from the Twitter Developer Platform.
- Lightweight UI with Tailwind CSS — The interface is styled entirely with Tailwind utility classes, keeping the design consistent and customizable.
- 3D tilt interaction — Adds a vanilla-tilt effect to the profile card for a subtle dynamic visual.
- One-click deployment — Includes deploy buttons for Vercel, Netlify, and DigitalOcean App Platform from the GitHub repository.
- Analytics-ready environment variable — An optional NEXT_PUBLIC_ANALYTICS_ID can be set to connect a third-party analytics service.
Who is it for?
- Developers wanting to learn the Twitter API — They can fork the repo, add their own Twitter app keys, and see how OAuth, data fetching, and server-side API calls are structured.
- Content creators and influencers — They can self-host a live follower counter on a personal site or export a branded followers card to share on social media.
- Open-source contributors — The project accepts contributions, has a contributing guide, and lists "much more coming soon", so it's a good codebase for adding new features.
- Privacy-minded users — Because the app is self-hostable, they avoid third-party tracking services.
What can you do with TwiterStats?
- Build a personal Twitter stats dashboard — After logging in with your Twitter account, you get your current follower count displayed in real time.
- Generate a shareable profile image — Export the profile card as an image file and post it on Instagram, LinkedIn, or your newsletter.
- Deploy a public followers counter — Use the one-click Vercel/Netlify deploy to host the app for others to view.
- Learn the Twitter API v2 integration — The repo shows how to obtain TWITTER_ID and TWITTER_SECRET, set up OAuth via NextAuth, and query follower data with twitter-lite.
How does TwiterStats work?
The README lists five installation steps: clone the repository, change into the twiter-stats directory, install dependencies with yarn install, create a .env file with TWITTER_ID, TWITTER_SECRET, NEXTAUTH_URL, NEXTAUTH_SECRET, and an optional NEXT_PUBLIC_ANALYTICS_ID, then run yarn run dev to open localhost:3000. For live deployment, the repo includes deploy buttons for Vercel, Netlify, and DigitalOcean that automate the setup.
FAQ
Yes, you need TWITTER_ID and TWITTER_SECRET from the Twitter Developer Platform. The README links to Twitter's getting-started guide for the Twitter API.
How do I deploy TwiterStats?
The repository includes one-click deploy buttons for Vercel, Netlify, and DigitalOcean App Platform. You can also deploy manually by cloning the repo and using the standard Next.js build process.
What is the tech stack?
TwiterStats uses Next.js as the framework, Tailwind CSS for styling, NextAuth for authentication, SWR for data fetching, html-to-image for image export, and next-themes for dark mode. These are all listed in the Built with section.
Who created TwiterStats?
The project is credited to Nilanth and all contributors. It is licensed under the MIT License.
