Skip to content
TEALScript

4. Compilation Artifacts

Compiling

To compile the hello_world.algo.ts, simply run npm run build. This will generate some artifacts under the contracts/artifacts directory

TEALScript Artifacts

The contracts/ directory will now look like the following. While you won’t need to directly interact with most of these files, it’s get to get a general understanding of what they do. Below are all the files generated by TEALScript.

contracts
├── artifacts
│   ├── HelloWorld.abi.json
│   ├── HelloWorld.approval.teal
│   ├── HelloWorld.clear.teal
│   ├── HelloWorld.json
│   ├── HelloWorld.src_map.json
│   └── components
├── clients
│   └── HelloWorldClient.ts
└── hello_world.algo.ts

artifacts/HelloWorld.abi.json

This is the ABI JSON description. In short, this file helps clients know what methods are availible and how to call them. You might also see that there are descriptions for our method and arguments. These descriptions were generated auotomatically via the TypeDoc comment. This means writing documentation for your contract methods not only helps you in your IDE, but it also helps potential callers of your contract understand how they should call it.

artifacts/HelloWorld.approval.teal

This file is the low-level source code of our contract that is ultimately given to a node when deploying the contract. This file contains TEAL, which is a low-level language native to the Algorand blockchain. Luckily, you will not need to work with TEAL directly too often, but it’s worthwhile to take a look at it to get a basic idea of how it works. Sometimes when debugging, you will need to look at the TEAL to truly understand what is happening.

This file represents what we call the approval program, which is the code that executes when the contract is normally called.

artifacts/HelloWorld.clear.teal

On Algorand, contracts actually have two pieces of source code. The approval program and the clear program. The clear program is only called when a user wants to clear their state from the contract. If that sounds distressing, don’t worry, this tutorial will go more in depth about how this works and ways to control what can and can’t be deleted.

artifacts/HelloWorld.json

This is the applicaiton spec for our contract. Think of this file like an enhanced ABI file. It includes all of the information in the ABI JSON description while also providing even more information for clients, such as source code, state encoding, etc.

Algokit Generated Client

clients/HelloWorldClien.ts

This is a client that was automatically generated by Algokit. If you look at what happens when npm run build runs, there are two commands:

  1. tealscript contracts/hello_world.algo.ts contracts/artifacts
  2. algokitgen generate -a contracts/artifacts/HelloWorld.json -o contracts/clients/HelloWorldClient.ts

The first one is passing the contract to the TEALScript compiler and generated the aforementioned artifacts.

The second one is passing our appspec, HelloWorld.json, to algokit which then outputs an auto-generated client. This generated client is a TypeScript file that exports a class that can be used to interact with our contract. This client includes not only all of the public methods, but also things like contract state.

This client means we don’t need to manually write boilerplate code for connecting our contract to our client which will be shown in the next step of this tutorial.