educacao/decoda
11
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

desenvolvimento pre-lancamento

Browse Source 
Commit inicial - add do repo privado para o repo NT

style: changes header's logo and colors

style: changes home page first session layout

feat: creates about us home page section

chore: creates home page section for whom

chore: creates student materails home page section

chore: creates teachers materials home page section

chore: creates teacher materials home page section

style: changes primary color

style: changes color at activities page

style: changes about page color

style: changes name to Decoda

fix: changes route to about page at footer

fix: changes background color

style: changes game page header colors

style: changes footer colors

chore: adds home page sections title

style: changes main font family to Lato

style: adds title font

fix: changes sizes to be more responsive for mobile

ajuste no build vercel

atualiza regras envio homol

Adiciona instrucoes de uso

add JupyterLite

fix solucao turtle

Add Mole Mash e Modal de Falhas

Add Progress Bar na pagina de Atividades

fix game name

chore: atualiza lockfile removendo vercel analytics

inclusão de efeito ao mudar de fase

add mecanismo de solução de fases em debug

vite config test

add BaseGame e refator do MoleMash

refatoração turtle

refatoração automato

refatoração automato

add tag

bug 1 e 2 automato

mostrar apenas games em homologação na pagina de atividades

aumentar timeout das fases finais do Turtle

fix bug scroll

add video

refactor semaforo

arrumar ordem das cores

add build docs

update vercel

update vercel

update vercel

update vercel

update vercel

add vercel jupyter

add vercel jupyter

fix deploy Vercel

fix deploy Vercel

fix deploy Vercel

add cripto

add cripto

refatoração

fix tour Mole Mash

.

remover arquivos de controle

chore: adds development tag for activity card

remover arquivos de status indevidamente versionados

atualizar cores nas atividades

add Quebra Cabeças

add Quebra Cabeças

add iniciativas

add Iniciativas

alteração de fotos pesadas

fix menu mobile

fix menu mobile

fix menu mobile

add Aspirador

update icons

update identidade visual documentação

update jupyter

add kernel python local

add kernel python local

add kernel python local

feat: add health check

feat: add primeiros passos

add letramento

mover letramento de lugar

update path games

update path games

fix: ajuste clique rapido no botão executar

remover dead code

fix: refactor: extract shared utilities for storage, phase unlock and mobile detection

stabilize context references and fix stale closure

extrair GameProgressContext do GameStateContext (SRP)

refactor(game): extrair usePhaser e useGameModals de GameBase + corrigir bugs descobertos

refactor(game): remove todos os aliases PT/EN duplicados

Remover aliases PT/EN da camada de modais

refactor + tests

security: add CodeSanitizer and integrate into GameInterpreter

- CodeSanitizer.js: 4 built-in rules (max_length, infinite_while,
  infinite_for, excessive_nesting) with pluggable extra rules
- GameInterpreter.executeCode: calls sanitizeCode() before js-interpreter,
  differentiates CodeSanitizationError (warn) from other errors (error)
- 21 unit tests for CodeSanitizer (100% coverage)
- 4 integration tests in GameInterpreter for sanitization paths

add CodeSanitizer

fix: fase 10 aspirador

fix: bug semaforo

teste

feat: add version

Ajusta a landing page para ficar mais próxima ao protótipo

ajusta raio da borda do botão de Acesse nosso Laboratório

pequenos ajustes de layout na página de iniciativas

atualiza tabela de jogos educativos com os jogos disponíveis atualmente

ajustados pequenos detalhes e informações do jogos na seção de guias pedagógicos

troca nome playground para laboratório e adiciona imagens do lab

adiciona documentação de conceitos básicos de programação

ajustado pequenos erros de digitação

adiciona tooltip com conceitos escondidos em hover na tag +N de conceitos

update docs dev

desativar tour

setup matriz MoleMash

setup matriz MoleMash

fix: link

update version

update docs

update docs

mudou o layout de quem somos

mudei as imgs dos icons e baixei o botao

centraliza titulo com imagem e ajusta sessão com gradiente vermelho-rosa

adiciona responsividade para a pagina quem somos

ajusta botão de conheça nossa história

ajustes

ajustes na home + add. teclado

update version

security

security

feat: add tapume para telas pequenas

v1.1.0

feat: decoda offline

feat: doc offline

offline

fix: ajustes para release

fix: navbar; config ordenação; versão

fix: rotas docs e jupyter para pwa

delete private files

Co-authored-by: Indra Araujo <indra.araujo.santos@gmail.com>
Co-authored-by: solange dos santos <sollangelive71@gmail.com>
This commit is contained in:
Rui Moraes
2025-10-29 21:30:14 -03:00
committed by Graciano
parent e24ee22b5a
commit 3da7d323e8
577 changed files with 121994 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files

378
docs/edu/fundamentos-programacao/quatro-fundamentos/funcoes.md Normal file
View File

@@ -0,0 +1,378 @@
---
sidebar_position: 3
title: "Funções"
---
# Funções - Organizando o Código
**Funções** são como receitas especiais que você cria uma vez e pode usar sempre que precisar. É o computador sendo organizado: em vez de repetir instruções, ele guarda "receitas" prontas!
## **O que são Funções?**
Funções são **blocos de código reutilizáveis** que executam uma tarefa específica. Você dá um nome para um conjunto de ações e pode "chamar" essa função sempre que precisar.
### **Analogia: Receita de Bolo**
Imagine que você ama fazer bolo de chocolate:
- **SEM FUNÇÃO**: Toda vez escreve a receita completa (20+ passos)
- **COM FUNÇÃO**: Cria receita "FazerBoloChocolate()" e só chama quando quiser
Quando alguém perguntar como fazer, você só diz: "Use a receita de bolo de chocolate!"
## **Como Funcionam?**
```mermaid
flowchart TD
A[Definir função] --> B[Nome + parâmetros]
B --> C[Escrever passos internos]
C --> D[Chamar função no programa]
D --> E{Retorna valor?}
E -->|Sim| F[Usar retorno em variável/decisão]
E -->|Não| G[Continuar fluxo]
F --> H[Fim]
G --> H
```
### **Estrutura Básica**
```
FUNÇÃO MinhaReceita():
passo 1
passo 2
passo 3
```
Para usar:
```
MinhaReceita() // Executa todos os passos!
```
### **Com Parâmetros (Ingredientes)**
```
FUNÇÃO FazerSuco(fruta):
corte a fruta
adicione água
misture
```
Para usar:
```
FazerSuco(laranja) // Faz suco de laranja
FazerSuco(limão) // Faz suco de limão
```
## **Atividades Desplugadas**
### **1. Truque de Mágica**
**Material**: Baralho de cartas
**Como fazer**:
1. Ensine um truque simples (função)
2. Dê nome: "TruqueDoDesaparecimento()"
3. Sempre que alguém pedir, execute o "truque"
4. **Variação**: TruqueDoDesaparecimento(carta_vermelha)
### **2. Coreografia Pessoal**
**Material**: Música
**Como fazer**:
1. Cada estudante cria sua "dança especial" (função)
2. Dá nome: "DançaDoPedro()", "DançaDaAna()"
3. Quando chamarem o nome, executam a dança
4. **Com parâmetro**: DançaDoPedro(rápida) ou DançaDoPedro(lenta)
### **3. Aviões de Papel**
**Material**: Papel
**Como fazer**:
1. Ensine a dobrar aviãozinho (função "FazerAvião()")
2. Todos decoram os passos
3. Quando disser "FazerAvião()", todos fazem
4. **Variação**: FazerAvião(papel_colorido)
## **Tipos de Funções**
### **1. Função Simples (Sem Retorno)**
- Executa ações
- Não "devolve" nada
- Como ligar a TV
**<i class="fas fa-lightbulb"></i> Exemplo**:
```
FUNÇÃO AcenderLuz():
pressione o interruptor
```
### **2. Função com Retorno**
- Executa ações E devolve um resultado
- Como uma calculadora
**<i class="fas fa-calculator"></i> Exemplo**:
```
FUNÇÃO Somar(a, b):
resultado = a + b
retorne resultado
```
### **3. Função com Parâmetros**
- Recebe "ingredientes" para trabalhar
- Mais flexível e reutilizável
**<i class="fas fa-comment"></i> Exemplo**:
```
FUNÇÃO Cumprimentar(nome):
diga "Olá, " + nome + "!"
```
## **Funções no Cotidiano**
### **Em Casa**
- **<i class="fas fa-coffee"></i> FazerCafé()**: Toda manhã, mesmos passos
- **<i class="fas fa-car"></i> IrTrabalho()**: Mesmo percurso sempre
- **<i class="fas fa-bed"></i> ArrumarCama()**: Mesma sequência
### **Na Escola**
- **<i class="fas fa-bell"></i> TocarSinal()**: Música sempre igual
- **<i class="fas fa-list-alt"></i> FazerChamada(turma)**: Processo padrão
- **<i class="fas fa-chalkboard"></i> ExplicarMatéria(assunto)**: Estrutura similar
### **Na Tecnologia**
- **<i class="fas fa-save"></i> Salvar()**: Sempre mesmo processo
- **<i class="fas fa-print"></i> Imprimir(documento)**: Passos padrão
- **<i class="fas fa-envelope"></i> EnviarEmail(destinatário, mensagem)**: Protocolo fixo
## **Na Programação Visual**
### **Blocos de Função**
No Decoda, você verá:
- **<i class="fas fa-plus"></i> "Criar função"**: Para definir nova função
- **<i class="fas fa-tag"></i> Nome da função**: Como identificar
- **<i class="fas fa-cogs"></i> Parâmetros**: "Ingredientes" que recebe
- **<i class="fas fa-play"></i> Chamar função**: Bloco para usar
### **Exemplo no Jogo Tartaruga**
```
FUNÇÃO DesenharQuadrado(tamanho):
repita 4 vezes:
ande tamanho passos
vire 90 graus
// Para usar:
DesenharQuadrado(50) // Quadrado pequeno
DesenharQuadrado(100) // Quadrado grande
```
## **Vantagens das Funções**
### **1. Reutilização**
- Escreve uma vez, usa muitas vezes
- Economiza tempo e esforço
### **2. Organização**
- Código mais limpo e claro
- Cada função faz uma coisa específica
### **3. Facilita Manutenção**
- Erro? Conserta só na função
- Melhoria? Atualiza só um lugar
### **4. Trabalho em Equipe**
- Cada pessoa pode criar suas funções
- Compartilha com o grupo
### **5. Menos Erros**
- Testa função uma vez
- Confia sempre que usar
## **Criando Boas Funções**
### **Nome Descritivo**
- **Bom**: `CalcularIdade()`
- **Ruim**: `Fazer()`
### **Uma Responsabilidade**
- **Bom**: `EnviarEmail()` só envia email
- **Ruim**: `EnviarEmailEFazerCafé()` faz duas coisas
### **Tamanho Adequado**
- **Bom**: 5-15 linhas geralmente
- **Ruim**: 100 linhas (muito complexa)
## **Atividades Práticas com Decoda**
### **1. Biblioteca de Formas**
Crie funções para:
- `DesenharTriângulo(tamanho)`
- `DesenharCirculo(raio)`
- `DesenharEstrela(pontas)`
### **2. Efeitos Sonoros**
Crie funções para:
- `SomDeVitória()`: Música alegre
- `SomDerrota()`: Som triste
- `SomAção(tipo)`: Diferentes sons
### **3. Comportamentos do Personagem**
Crie funções para:
- `Pular(altura)`: Pulo customizável
- `Correr(velocidade)`: Corrida variável
- `Atacar(direção)`: Ataque direcional
## **Dicas para Educadores**
### **Como Ensinar**
1. **<i class="fas fa-repeat"></i> Comece com repetição**: Mostre código repetitivo
2. **<i class="fas fa-magic"></i> Apresente como solução**: "Vamos organizar isso!"
3. **<i class="fas fa-hands"></i> Use analogias físicas**: Receitas, instruções
4. **<i class="fas fa-step-forward"></i> Construa gradualmente**: Simples → Parâmetros → Retorno
### **Erros Comuns**
- **Função muito genérica**: `FazerTudo()`
- **Nome confuso**: `Coisa1()`, `Função2()`
- **Muitos parâmetros**: `Função(a,b,c,d,e,f,g)`
- **Função muito complexa**: Faz muitas coisas diferentes
### **Sinais de Compreensão**
- Identifica código repetitivo
- Cria nomes descritivos para funções
- Usa parâmetros apropriadamente
- Explica por que funções são úteis
## **Pensamento Computacional**
### **Decomposição**
- Quebrar problemas em funções menores
- Cada função resolve uma parte
### **Abstração**
- Esconder detalhes complexos
- Usuário só precisa saber o nome da função
### **Reconhecimento de Padrões**
- Identificar ações que se repetem
- Criar funções para padrões comuns
### **Algoritmos**
- Organizar soluções em blocos reutilizáveis
- Construir sistemas complexos com peças simples
## **Objetivos de Aprendizagem**
Ao final desta seção, estudantes devem conseguir:
- **<i class="fas fa-check"></i>** Identificar quando usar funções
- **<i class="fas fa-check"></i>** Criar funções simples com nomes descritivos
- **<i class="fas fa-check"></i>** Usar parâmetros para tornar funções flexíveis
- **<i class="fas fa-check"></i>** Organizar código usando funções
- **<i class="fas fa-check"></i>** Explicar vantagens das funções
## **Atividades de Fixação**
### **1. Identifique a Função**
Que funções você criaria para:
- Fazer um sanduíche
- Arrumar o quarto
- Escovar os dentes
### **2. Nomeação**
Dê nomes melhores para:
- `Função1()` que desenha casa
- `Coisa()` que toca música
- `Fazer()` que calcula nota
### **3. Parâmetros**
Que parâmetros essas funções precisariam?
- `DesenharRetângulo(?)`
- `TocarMúsica(?)`
- `MandarMensagem(?)`
## **Referências e Recursos**
### **Sites Educativos**
- [Code.org - Functions](https://code.org/curriculum/course3/14/Activity14-Functions.pdf) - Atividades com funções
- [CS Unplugged - Functions](https://csunplugged.org/en/topics/programming-languages/unit-plan/modular-programming/) - Programação modular
- [Scratch - Custom Blocks](https://scratch.mit.edu/help/studio/tips/custom-blocks/) - Blocos personalizados
### **Vídeos Explicativos**
- [Functions Explained](https://www.youtube.com/watch?v=N_Ls37qeQ4c) - Conceitos básicos
- [Why Use Functions?](https://www.youtube.com/watch?v=j9Ll8QWwwTE) - Vantagens das funções
- [Function Parameters](https://www.youtube.com/watch?v=HnC2JhdsJYw) - Parâmetros explicados
### **Jogos e Atividades**
- [CodeCombat](https://codecombat.com/) - RPG que ensina funções
- [CheckiO](https://checkio.org/) - Desafios de programação
- [CodinGame](https://www.codingame.com/) - Jogos com funções
### **Literatura Acadêmica**
- Martin, R. (2008). _Clean Code: A Handbook of Agile Software Craftsmanship_
- McConnell, S. (2004). _Code Complete: A Practical Handbook_
- Fowler, M. (2018). _Refactoring: Improving the Design of Existing Code_
### **Ferramentas Práticas**
- [Repl.it](https://replit.com/) - Editor online para praticar funções
- [Trinket](https://trinket.io/) - Python no navegador
- [JSFiddle](https://jsfiddle.net/) - JavaScript para experimentar
### **Cursos Complementares**
- [Khan Academy - Intro to Programming](https://www.khanacademy.org/computing/intro-to-programming) - Funções básicas
- [MIT OpenCourseWare](https://ocw.mit.edu/courses/electrical-engineering-and-computer-science/) - Programação avançada
- [Coursera - Programming for Everybody](https://www.coursera.org/learn/python) - Python com funções
---
**<i class="fas fa-arrow-right"></i> Próximo**: Explore [**Procedural**](./procedural) para aprender como organizar algoritmos passo a passo!