Requirements Gathering (21/10/24)
Overview:
Build a website that allows users to create and share digital art.
- Art
- Build a component that lets users create interactive art - it could be physics simulations using cannon, fun animations using spring, or an avatar builder using something like react-avataaars, for example.
- The art should be configuration-based (generated/visualized from a config), but canvas art is okay if there’s a strong preference for it.
- Social
- User profiles and authentication is required
- There should be a feed that users can browse
- The feed should be interactive (i.e. you can view a post and like it)
- System
- There should be an ExpressJS backend server to allow for REST API calls.
- There should be a PSQL database to store user data, art data, etc.
- The backend server should bidirectionally talk with the database, using Prisma
- There should be a React frontend that builds the feed, manages state and makes everything interactive.
- NextJS should be used for routing and serving React components on the pages
- NextJS should communicate with the backend, making REST API calls to populate the frontend components and make updates to stored data/state.
- The database schema should allow for user-to-user relationships (specifically for liking art)
Planning
PR1: Setup Backend with db and prismaCreate a backend projectinstall: express, cors, prisma
Get the server runningWith a PSQL databaseGet Prisma installed and setup
PR2: Setup frontend with NextJsCreate NextJs projectCreate basic scaffold
- PR3: Make art
Explore 3js/p5js and create some basic artBuild a react component with artDisplay it in a NextJs page
- PR4:
Enable to user to make some config modifications to the artworkSave the state of an artwork when the user submits it.Load state of artwork as proof of concept
- PR5:
- Add authentication to frontend and backend
PR6:Create DB Schema and initialise the db
- PR7:
Update backend with proper API calls and store artwork state data in backend/db.