AlgoKit Templates

AlgoKit offers a curated collection of production-ready and starter templates, streamlining front-end and smart contract development. These templates provide a comprehensive suite of pre-configured tools and integrations, from boilerplate React projects with Algorand wallet integration to smart contract projects for Python and TypeScript. This enables developers to prototype and deploy robust, production-ready applications rapidly.

By leveraging AlgoKit templates, developers can significantly reduce setup time, ensure best practices in testing, compiling, and deploying smart contracts, and focus on building innovative blockchain solutions with confidence.

This page provides an overview of the official AlgoKit templates and guidance on creating and sharing your custom templates to suit your needs better or contribute to the community.

Official Templates

AlgoKit provides several official templates to cater to different development needs. These templates will create a standalone AlgoKit project.

• Smart Contract Templates:
  • Algorand Python
  • Algorand TypeScript
• DApp React Frontend
• Fullstack (Smart Contract & DApp Frontend template)

How to initialize a template

To initialize using the algokit CLI:

1. Install AlgoKit and all the prerequisites mentioned in the installation guide.

2. Execute the command algokit init. This initiates an interactive wizard that assists in selecting the most appropriate template for your project requirements.

   algokit init # This command will start an interactive wizard to select a template

To initialize within GitHub Codespaces:

1. Go to the algokit-base-template repository.
2. Initiate a new codespace by selecting the Create codespace on main option. You can find this by clicking the Code button and then navigating to the Codespaces tab.
3. Upon codespace preparation, algokit will automatically start LocalNet and present a prompt with the next steps. Executing algokit init will initiate the interactive wizard.

Algorand Python Smart Contract Template

Algorand Python Smart Contract Template Github Repo

This template provides a production-ready baseline for developing and deploying Python smart contracts.

To use it install AlgoKit and then either pass in -t python to algokit init or select the python template.

algokit init -t python

# or

algokit init # and select Smart Contracts & Python template

Features

This template supports the following features:

• Compilation of multiple Algorand Python 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:
  • Optionally pick deployments to Netlify or Vercel

Getting started

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

• Instructions for Starter template
• Instructions for Production template

Algorand TypeScript Smart Contract Template

Algorand TypeScript Smart Contract Template Github Repo

This template provides a baseline TealScript smart contract development environment.

To use it install AlgoKit and then either pass in -t tealscript to algokit init or select the TypeScript language option interactively during algokit init.

algokit init -t tealscript

# or

algokit init # and select Smart Contracts & TypeScript template

Getting started

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

DApp Frontend React Template

DApp Frontend React Template Github Repo

This template provides a baseline React web app for developing and integrating with any ARC32 compliant Algorand smart contracts.

To use it install AlgoKit and then either pass in -t react to algokit init or select the react template interactively during algokit init.

algokit init -t react

# or

algokit init # and select DApp Frontend template

Features

This template supports the following features:

• React web app with Tailwind CSS and TypeScript
• Styled framework agnostic CSS components using DaisyUI.
• Starter jest unit tests for typescript functions. It can be turned off if not needed.
• Starter playwright tests for end to end testing. It can be turned off if not needed.
• Integration with use-wallet for connecting to Algorand wallets such as Pera, Defly, and Exodus.
• Example of performing a transaction.
• Dotenv support for environment variables and a local-only KMD provider that can connect the frontend component to an algokit localnet instance (docker required).
• CI/CD pipeline using GitHub Actions (Vercel or Netlify for hosting)

Getting started

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

• Instructions for Starter template
• Instructions for Production template

Fullstack (Smart Contract + Frontend) Template

Fullstack (Smart Contract + Frontend) Template Github Repo

This full-stack template provides both a baseline React web app and a production-ready baseline for developing and deploying Algorand Python and TypeScript 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.

algokit init -t fullstack

# or

algokit init # and select the Smart Contracts & DApp Frontend template

Features

This template supports many features for developing full-stack applications using official AlgoKit templates. Using the full-stack template currently allows you to create a workspace that combines the following frontend template:

• algokit-react-frontend-template - A React web app with TypeScript, Tailwind CSS, and all Algorand-specific integrations pre-configured and ready for you to build.

And the following backend templates:

• algokit-python-template - An official starter for developing and deploying Algorand Python smart contracts.
• algokit-tealscript-template - An official starter for developing and deploying TealScript smart contracts.

Initializing a fullstack algokit project will create an AlgoKit workspace with a frontend React web app and Algorand smart contract project inside the projects folder.

• .algokit.toml
• README.md
• {your_workspace/project_name}.code-workspace
• Directoryprojects

  • smart-contract
  • frontend