Tampadevs is a server-rendered React website template that powers the Tampa Devs community site, built with React Router v7 and deployed on Cloudflare Workers.
What is Tampadevs?
Tampadevs is the official website for Tampa Devs, Tampa Bay's largest tech community. It is a React Router v7 application with server-side rendering that runs on Cloudflare Workers. The template takes community content — events, groups, sponsors, and contact information — and renders it as a set of public pages. It is written in TypeScript, styled with Tailwind CSS v4, and uses a custom design system maintained by the Tampadevs organization.
Key Features
- React Router v7 with server-side rendering — The site uses React Router v7 in SSR mode, with file-based routing in
app/routes/and a central route configuration inapp/routes.ts. - Cloudflare Workers deployment — Deploy with the
npm run deploycommand via Wrangler, which publishes to bothtampadevs.comandwww.tampadevs.com. - Tailwind CSS v4 styling — Global styles live in
app/app.cssand Tailwind is configured through the project's design system Tailwind preset. - Shared design system packages — Reusable UI components from
@tampadevs/reactinclude Button, VideoHero, and SponsorGrid, with design tokens from@tampadevs/tokens. - SEO meta export — Each route can export a
metafunction to control the page title and description for search engines. - Server-side loaders — Routes export a
loaderfunction for data fetching, with access to Cloudflare environment variables throughcontext.cloudflare.env. - Community-focused routes — The template includes routes for Home, About, Events, Groups, Sponsors, and Contact.
- Vite build tooling — The project is built with Vite, using
vite.config.tsandreact-router.config.tsfor configuration.
Who is it for?
Tampadevs is for tech community organizers who need a polished, production-ready website to announce events, list local groups, and attract sponsors. It is also for React developers who want to learn how to build a server-rendered React Router v7 application deployed on Cloudflare Workers. Teams maintaining their own design system can use it as an example of consuming packages like a React component library, design tokens, and a Tailwind preset in a real app.
What can you do with Tampadevs?
- Community organizers: Publish upcoming events, list Tampa Bay tech groups, and present sponsor tiers on the dedicated routes.
- React developers: Use the template as a starting point for a new SSR React app, with a documented project structure and step-by-step route-adding workflow.
- Design system consumers: See how shared packages from the Tampadevs design system are imported and used, such as the Button, VideoHero, and SponsorGrid components.
How does Tampadevs work?
The README provides a straightforward workflow. Install dependencies with npm install, start a development server with npm run dev, and build for production with npm run build. Deployment happens through Wrangler with npm run deploy. To add a new page, create a file in app/routes/, add the route to app/routes.ts, and optionally export a meta function and a loader for server-side data.
FAQ
What tech stack does Tampadevs use?
Tampadevs uses React Router v7 with server-side rendering, TypeScript, Tailwind CSS v4, and Vite. It runs on Cloudflare Workers and is styled using a custom design system that includes a React component library, design tokens, and a Tailwind preset.
How do I deploy Tampadevs?
Deployment is handled with Wrangler by running npm run deploy. This command publishes the site to both the apex domain tampadevs.com and the www subdomain. The Cloudflare Workers configuration is stored in wrangler.jsonc.
Does Tampadevs have a license?
Yes, the repository is released under the MIT license, so the code can be freely reused and modified for other community websites.
