# Hooks

You can do anything during the animation's lifecycle with <mark style="color:orange;">hooks</mark>. TypingFlow supports the following hooks:

* onStart
* onFinish

{% code title="possible-hooks-example.ts" %}
```typescript
new TypingFlow({
  renderer: simpleBrowserRenderer({ selector: ".example" }),
})
  .on("start", () => {
    console.log("Animation started");
  })
  .on("finish", () => {
    console.log("Animation finished");
  });
```
{% endcode %}

Also you can apply <mark style="color:orange;">many callbacks</mark> to the same hook like this:

```typescript
new TypingFlow({
   renderer: simpleBrowserRenderer({ selector: ".example" }),
})
  .on("start", () => {
    console.log("Animation started");
  })
  .on("start", () => {
    console.log("Alright");
  });
```

