A web app for Nifty, built with React, Next.js, wagmi, and The Graph
1. Install the GraphQL: Language Feature Support VSCode extension
2. Install dependencies
npm install
3. Add a development environment file
touch .env.development
Add the following environment variables:
- NEXT_PUBLIC_ALCHEMY_API_KEY - Open Alchemy to create api keys
- NEXT_PUBLIC_SUBGRAPH_API_ENDPOINT - https://api.studio.thegraph.com/query/37867/nifty-staging/0.0.6
4. Run the development server
npm run start:development
The development environment uses the deployed Nifty testnet contract and subgraph
Run linter
npm run lint
Run typechecker
npm run typecheck
Run all static checks
npm run staticcheck
Run unit tests
npm run test:unit
Run end to end tests
npm run test:end-to-end
Debug end to end tests
npm run test:end-to-end -- --debug
// Debug a specific test
npm run test:end-to-end -- --debug <filter>
Generate tests interactively
npx playwright codegen
Run all tests
npm run test
Run all checks
npm run check
Create a production build
npm run build
Serve the production build
npm run start
See the Next.js Deployment documentation for more information on hosting.
The Frame component is a generic base component that combines Joy UI's generic Sheet with Framer Motion's motion.div, so that any location that uses it instead of a div, motion.div, Box, or Sheet can easily use both theme values and animatations.
All checks are run locally automatically before a commit is made using a husky pre-commit hook.
Modify the existing pre-commit hook
Edit the .husky/pre-commit file
Add a pre-commit hook from scratch
npx husky add .husky/pre-commit "npm run check"
See the Husky Documentation to learn more on how to configure pre-commit hooks.
Ensure that Playwright is testing a production build of the app, as development builds are slow and can cause flakiness / random failures due to timeouts.