02 / The Circular Net
Social App
The web app of a social network for people and organisations working on sustainability: feed, communities, messaging, live audio and video rooms, jobs, projects and podcasts.
- Company
- The Circular Net
- Role
- Lead frontend engineer
- Period
- Dec 2023 – PresentLive
- Links
- Visit site
- Stack
- Next.jsReact 19TypeScriptTanStack QueryRedux ToolkitStreamPusherTipTapTailwind CSS
Social App
A social network for sustainability
Screenshots coming soon
What I built
- 01Feed and post composer with media, scheduling, editing, hashtags and saved posts
- 02Communities, business pages, profiles and a multi-step profile setup
- 03Direct and group messaging with media previews and rooms attached to chats
- 04Audio and video rooms with host controls, moderation, raise hand, reactions, screen share and picture-in-picture
- 05Jobs board, projects hub with milestones, podcasts and events
- 06Guest pages, link previews and SEO metadata, so shared links work for people without an account
The system
How the web app fits into the platform
Key decisions
- 01
A module per product area
Feed, rooms, jobs and the rest each own their routes, components and queries. One area can change without touching the others, and the sprawl of the first version doesn't come back.
- 02
Real-time on managed services
Stream handles media and chat, and Pusher pushes app events. Building on them let a small team ship live rooms in weeks instead of running media servers.
- 03
Sign-in moved out of the app
Authentication lives in a separate SSO service, so the web app, Circular Ticket and the marketing site share one account and one secure flow.
01
The problem
People working on climate and sustainability were scattered across general-purpose networks. The platform needed one place to share, organise, hire and meet, and it had outgrown its first version.
02
The process
I built the first version on the Pages Router in 2023–24, then led the rebuild on the App Router with a module per product area. Chat and live rooms run on Stream and Pusher, posts use a rich-text composer and feeds scroll infinitely. Sign-in moved to a shared SSO service, so every product uses one account.
03
The outcome
Live at app.thecircularnet.com, with deep links into the mobile app. I wrote more than 2,000 commits across the two versions.
04
What I learned
Live rooms are a state machine, not a page. Device setup, screen share and people leaving or being removed all need explicit states, or the interface lies to the user.