Front End
The Abstract Play browser client is a React single-page application (SPA) deployed to S3 and CloudFront. It is the primary interface for playing games, managing challenges and tournaments, and configuring board themes.
Stack
| Layer | Technology |
|---|---|
| UI | React 18, Bulma CSS |
| Build | Create React App (react-scripts) |
| Routing | React Router v6 |
| State | Zustand |
| Auth | AWS Amplify + Cognito OAuth |
| Games | @abstractplay/gameslib, @abstractplay/renderer |
| Deploy | Serverless Framework + serverless-finch |
Documentation
Core
- Architecture — app shell, routing, state, dependencies
- Getting started — clone, install, local dev
- Configuration — environment modes and endpoints
- Deployment — CI/CD, S3, CloudFront
- API client — how the client calls the backend
- Authentication — Cognito, tokens, session handling
Subsystems
- Game move — live game UI and move submission
- Dashboard — home page, my-turn tables
- Explore — game catalog
- Challenges — standing challenges
- Tournaments
- Events
- Lab — offline sandbox
- Bots — bot management UI
- WebSockets — real-time presence and updates
- Notifications — web push
- Customize & themes
- Internationalization
Guides
Related documentation
- Backend — API, DynamoDB, bot framework
- Gameslib — game rules engine
- Renderer — board JSON and SVG rendering
- Recranks — game records and ratings
Resources
- GitHub repository
- CHANGELOG — release history (repo root)
- Discord #dev-curious
- Dev site: play.dev.abstractplay.com
- Prod site: play.abstractplay.com
When you add a route, API call pattern, or subsystem, update /docs in the same PR.
Last verified against develop branch.