---

This full-stack template provides both a baseline React web app and a production-ready baseline for developing and deploying Beaker smart contracts. It's suitable for developing and integrating with any ARC32 compliant Algorand smart contracts.

To use this template, install AlgoKit and then either pass in -t fullstack to algokit init or select the relevant template interactively during algokit init.

This is one of the official templates used by AlgoKit to initialize both a frontend React web app and Algorand smart contract project. It's created based on the Copier templates.

Features

This template supports a multitude of features for both frontend and backend:

Frontend

• React web app with Tailwind CSS and TypeScript
• Styled framework agnostic CSS components using DaisyUI.
• Starter Jest unit tests for TypeScript functions. Can be disabled if not needed.
• Starter playwright tests for end-to-end testing. Can be disabled if not needed.
• Integration with use-wallet for connecting to Algorand wallets such as Pera, Defly, and Exodus.
• Example of performing a transaction with HelloWorld smart contract.
• dotenv support for environment variables, as well as a local-only KMD provider that can be used for connecting the frontend component to an algokit localnet instance (Docker required).
• CI/CD pipelines using GitHub Actions to deploy to Vercel or Netlify

Refer to the official algokit-react-frontend-template repository for up-to-date information on the frontend template.

Backend

• Compilation of multiple Beaker contracts to a predictable folder location and file layout where they can be deployed.
• Deploy-time immutability and permanence control.
• Poetry for Python dependency management and virtual environment management.
• Linting via Ruff or Flake8.
• Formatting via Black.
• Type checking via mypy.
• Testing via pytest (not yet used).
• Dependency vulnerability scanning via pip-audit (not yet used).
• VS Code configuration (linting, formatting, breakpoint debugging).
• dotenv (.env) file for configuration.
• Automated testing of the compiled smart contracts.
• Output stability tests of the TEAL output.
• CI/CD pipeline using GitHub Actions.

Refer to the official algokit-beaker-template repository for up-to-date information on the backend template.

Getting started

Once the template is instantiated you can follow the README.md file to see instructions for how to use the template.