# Functions primeiros passos
## Antes de começar
Para você começar e ter sucesso como um edge developer, é importante:
- Familiarizar-se com JavaScript.
- [Conhecer o conceito de Strict mode](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode).
- [Ter uma conta na plataforma da Azion](/pt-br/documentacao/produtos/contas/criar-uma-conta/).
As functions funcionam sobre o [Azion Runtime](/pt-br/documentacao/runtime/visao-geral/), que é um conjunto de ferramentas que permitem o desenvolvimento no edge.
É fundamental conhecer a lista de APIs, métodos e tipos disponíveis. [Saiba mais sobre o Azion Runtime](/pt-br/documentacao/runtime/visao-geral/).
---
## Editor de Código
[O Functions Code Editor](/pt-br/documentacao/produtos/applications/functions/runtime-api/code-editor/) fornece uma experiência de desenvolvimento semelhante à que os desenvolvedores estão acostumados. A [integração entre Functions e ChatGPT](/pt-br/documentacao/produtos/applications/functions/runtime-api/ai-integration/) ajuda você a escrever, refatorar e revisar o código.
---
## Functions e Applications
Desenvolvendo sua primeira function para Application:
1. Acesse o [Azion Console](/pt-br/documentacao/produtos/guias/como-acessar-o-azion-console/) > **Functions**
2. Clique em **+ Function**.
3. Escolha um nome para sua função.
4. Escreva sua função. Mas espere, antes disso, continue lendo:
### Escrevendo uma function
Primeiro, as functions para Applications funcionam com base em um [fetch event](/pt-br/documentacao/produtos/applications/functions/runtime-apis/javascript/fetch/). Ele é inicializado com uma função `addEventListener`, passando `fetch` como o tipo de evento e um evento. Por exemplo:
```javascript
addEventListener('fetch', event => {
event.respondWith(handleRequest(event.request));
});
```
Em segundo lugar, é necessário definir o comportamento da função `handleRequest`. Esta função tem como assinatura o `event.request`. Esses dados podem ser usados posteriormente para implementar a lógica necessária, como:
- Manipular cookies.
- Implementar um comportamento com base no método de solicitação (POST, GET, PUT, DELETE).
- Acessar os metadados da requisição.
A função `handleRequest` pode ser definida como:
```javascript
const html = `
Hello World
This markup was generated by Azion - Functions.
`
async function handleRequest(request) {
return new Response(html, {
headers: {
"content-type": "text/html;charset=UTF-8",
},
})
}
```
Neste exemplo, a resposta será o conteúdo HTML, declarado anteriormente pelo const `html`. Os headers também podem ser manipulados e, no exemplo, o `Content-Type` é definido.
---
## Teste e depuração
Depois de escrever suas functions, você pode visualizar a resposta e inspecionar o código. O preview simula uma solicitação e essa simulação pode ser alterada para atender às necessidades do desenvolvedor.
[Saiba mais sobre o Preview Deployment](/pt-br/documentacao/produtos/applications/functions/runtime-api/preview-deployment/).
É possível depurar as funções através de:
- [Data Stream](/pt-br/documentacao/produtos/guias/debugging-functions-data-stream/)
- [GraphQL API](/pt-br/documentacao/produtos/guias/debugging-functions-graphql/)
---
## Function instantiation
Depois de salvar sua function, é necessário instanciá-la em uma application.
[Saiba mais sobre como instanciar uma function em uma application](/pt-br/documentacao/produtos/build/applications/functions-instances/).
---