FRONTEND TEAMS CUP

FRONTEND TEAMS CUP

CRONOGRAMA DO EVENTO:

Prazo Inscrições SEDES

Até 25 de setembro de 2026

Período para inscrição dos Câmpus

Prazo Inscrições

Até 27 de setembro de 2026

Término do período de inscrições de usuários e times

Primeira Fase

28 de Setembro de 2026 a

16 de Outubro de 2026

Início da competição - Competições locais

Segunda Fase

18 de Outubro de 2026 a

30 de Outubro de 2026

Competições regionais

Grande Final

Novembro em dia a definir

Competição nacional

FOTOS DAS EDIÇÕES ANTERIORES

Ambiente 2 Ambiente 2 Ambiente 1 Ambiente 3 Ambiente 5 Ambiente 9 Ambiente 8 Ambiente 10 Ambiente 7 Ambiente 11 Ambiente 12 Ambiente 12 Ambiente 13 Ambiente 14 Ambiente 15
1 / 15

EDIÇÃO ANTERIOR

Edição Anterior - Frontend Teams Cup 2025

Frontend Teams Cup 2025

Veja os dados das partidas, os times, a classificação e os códigos utilizados na última competição. Analise as estratégias vencedoras e aprenda com os melhores projetos.

Visitar Edição 2025

CONHEÇA A FRONTEND TEAMS CUP

Competição em andamento

O que é

A Frontend Teams Cup é uma nova competição educacional que desafia estudantes a transformar layouts em interfaces web utilizando HTML e CSS. Organizados em equipes, os participantes recebem feedback imediato por meio de um sistema de avaliação automatizada, tornando a experiência dinâmica, justa e motivadora.

A iniciativa estimula criatividade, raciocínio lógico, trabalho em equipe e o desenvolvimento de habilidades valorizadas pelo mercado de tecnologia.

O processo de avaliação ocorre de forma totalmente automatizada. Após o envio da solução, o sistema gera capturas da interface desenvolvida pelos participantes e as compara com o layout de referência utilizando técnicas de visão computacional. A pontuação é calculada com base na semelhança visual entre as imagens, garantindo correções rápidas, objetivas e transparentes. Os resultados são exibidos em tempo real por meio de painéis e rankings, aumentando a interação entre competidores, torcida e comunidade acadêmica.

Além da competição, a tecnologia desenvolvida possui aplicações em diferentes contextos educacionais — provas práticas, atividades de laboratório, processos seletivos e cursos de capacitação — contribuindo para a modernização das práticas de ensino e avaliação em informática.

Primeira edição do evento

História

A Frontend Teams Cup nasceu no IFMS Campus Três Lagoas a partir da integração entre ensino, pesquisa e extensão. Sua concepção teve início em janeiro de 2025, quando foram realizados os primeiros testes e desenvolvidas as tecnologias que dão suporte à competição. Em novembro do mesmo ano ocorreu a primeira edição oficial do evento, reunindo 19 equipes.

Desde então, a competição vem se expandindo continuamente, incorporando novas funcionalidades, sistemas de correção automatizada e ferramentas de acompanhamento em tempo real. Sustentada por soluções desenvolvidas por estudantes e servidores do próprio campus, a Frontend Teams Cup chega agora a um novo marco: esta é a primeira edição realizada além dos limites do Campus Três Lagoas, com a participação de instituições de diferentes localidades e etapas regionais classificatórias que culminam em uma fase nacional.

Com essa expansão, a iniciativa fortalece sua missão de promover a formação de novos talentos na área de tecnologia, consolidando-se como uma referência nacional em competições voltadas ao desenvolvimento de interfaces web e à inovação educacional.

SEDES DA COMPETIÇÃO

Locais que sediam e promovem a FrontEnd Teams Cup.

Campus de Três Lagoas

Fundação Universidade Federal de Mato Grosso do Sul

Mato Grosso do Sul

Tres Lagoas

3 times

Code Warriors

  • João Silva
  • Maria Santos
  • Pedro Costa

Code Warriors

  • João Silva
  • Maria Santos
  • Pedro Costa
  • Thiago PROFESSOR

Frontend Masters

  • Ana Oliveira
  • Carlos Mendes
  • Lucas Ferreira

Dev Squad

  • Juliana Rocha
  • Bruno Torres

Campus Tres lagoas

Instituto Federal Mato Grosso do Sul

Mato Grosso do Sul

Tres Lagoas

4 times

Pixel Wizards

  • Roberto Alves
  • Fabiana Costa
  • Mateus Lima

Web Titans

  • Camila Dias
  • Felipe Gomes

React Legends

  • Mariana Souza
  • Gustavo Barbosa
  • Bianca Martins

Code Ninjas

  • Thiago Pereira
  • Isabela Rodrigues

Campus Tres lagoas

Instituto Federal Mato Grosso do Sul

Mato Grosso do Sul

Tres Lagoas

4 times

Pixel Wizards

  • Roberto Alves
  • Fabiana Costa
  • Mateus Lima

Web Titans

  • Camila Dias
  • Felipe Gomes

React Legends

  • Mariana Souza
  • Gustavo Barbosa
  • Bianca Martins

Code Ninjas

  • Thiago Pereira
  • Isabela Rodrigues

Campus Ipatinga

Instituto Federal Minas Gerais

Minas Gerais

Ipatinga

2 times

UI Architects

  • Wagner Santos
  • Cristina Pereira
  • Diego Menezes

JavaScript Pros

  • Simone Cardoso
  • Ricardo Nunes
  • Leticia Gama

REQUISITOS NECESSÁRIOS

Prepare o seu ambiente com as ferramentas abaixo para garantir uma participação sem interrupções.

Laboratório de Informatica

  • Ambiente de trabalho da sua equipe, equipado com computadores e acesso à internet

Visual Studio Code

  • Ferramenta principal de desenvolvimento. Necessário tê-lo instalado na máquina que será utilizada.

Conta Gmail

  • Crie ou vincule sua conta para gerenciar o repositório do projeto e entregar o código final.

TUTORIAIS DE INSTALAÇÃO

Acesse os tutoriais passo a passo para configurar o ambiente de desenvolvimento.

Tutorial Visual Studio Code - Windows
VS Code

Manual de Uso da Extensão

Guia rápido para usar a extensão Frontend Teams Cup no VS Code.

Ver manual
Tutorial GitHub - Conta e Repositório
YouTube
VS Code

Demonstração de uso da extensão

Demonstração das funcionalidades presentes na extensão do FrontEnd Teams Cup.

Assistir Tutorial
Tutorial Git - Primeiros Passos
YouTube
VS Code

Mecanismos de bloqueio da extensão

Neste vídeo você aprende as práticas proibidas e como reverter bloqueios.

Assistir Tutorial
Tutorial HTML e CSS - Fundamentos
YouTube
HTML & CSS

Fundamentos de HTML e CSS

Revise os fundamentos essenciais de HTML e CSS antes de entrar na competição.

Assistir Tutorial
Tutorial Extensões VS Code
YouTube
VS Code

Extensões Recomendadas

As melhores extensões do VS Code para turbinar seu desempenho durante a prova.

Assistir Tutorial
1 / 4

Guia de Atividades

Prepare-se para as competições com nossos desafios exclusivos. Escolha seu caminho e domine as habilidades necessárias!

Flexbox

Este guia reúne atividades focadas em aprender e exercitar Flexbox, em uma sequência evolutiva: os primeiros desafios trabalham alinhamento, distribuição e organização de elementos, enquanto os últimos simulam composições mais próximas das provas reais.

  • Sequência evolutiva de desafios
  • Alinhamento e distribuição
  • Composições próximas de provas reais
  • Desafios com dificuldade de competição
Começar Treino

Guia de Responsividade

Este guia reúne atividades focadas em responsividade, com exercícios para observar como uma interface se adapta entre telas pequenas, médias e grandes. A sequência trabalha o uso de media queries, containers, quebras de layout e reorganização de conteúdo.

  • Adaptação entre telas pequenas, médias e grandes
  • Media queries e containers
  • Reorganização de conteúdo responsivo
  • Clareza visual em qualquer tela
Desafiar-se

Cadastre Seu Time

Monte sua equipe, escolha um nome épico e inscreva-se para representar seu campus na Frontend Teams Cup. Cada time pode ter de 2 a 4 integrantes. Não perca o prazo!

  • De 2 a 4 participantes por time
  • Seu campus já deve estar cadastrado
  • Inscrições até 27 de setembro
Cadastrar Meu Time

Competição em Times

Trabalhe em equipe e supere os desafios de desenvolvimento frontend juntos.

Avaliação Automática

Resultados em tempo real com ranking atualizado durante toda a competição.

Competição Nacional

Os melhores times avançam para as fases regionais e a grande final nacional.

APOIADORES

Agradecemos às organizações que tornam este evento possível.

ORGANIZADORES

Conheça o time de profissionais dedicados a tornar o Frontend Teams Cup um sucesso.

Organizador

Ápio Silva Carniello

Professor EBTT IFMS - TL

Transmissão via streamer

Organizador

Érika Yurie Fujiwara

Professor EBTT IFMS - TL

Coordenação etapa local Três Lagoas

Organizador

Douglas Francisquini Toledo

Professor EBTT - IFSP

Expansão e Relações Institucionais

Organizador

Rangel Ferreira

Professor EBTT IFMS - TL

Organização e ferramentas

Organizador

Thiago de Oliveira Correia

Professor EBTT IFMS - TL

Coordenador Geral

Organizador

Alexandre Silvério

Tecnologia em Análise e Desenvolvimento de Sistemas IFMS - TL

Confecção de premiação

EQUIPE DE DESENVOLVEDORES

Conheça os desenvolvedores que trabalham para proporcionar a melhor experiência.

Desenvolvedor

Álvaro Ferreira da Silva

Técnico Integrado em Informática IFMS - TL

Sistema de chamadas para integração ao Sistema Acadêmico

Desenvolvedor

Bruno Rufato Justino

Técnico Integrado em Informática IFMS - TL

Heads-Up Display para streamers

Desenvolvedor

Glaicon Farias Felipe

Bacharelado em Engenharia da Computação IFMS - TL

Sistema de comparação e metrificação de resultados

Desenvolvedor

Jose Bruno Never Santos

Técnico Integrado em Informática IFMS - TL

Extensão de geração de exercícios aleatórios

Desenvolvedor

Kevyn Willian Paulo Antunes de Souza

Técnico Integrado em Informática IFMS - TL

Extensão de geração de exercícios aleatórios

Desenvolvedor

Rangel Gomes Soares da Silva

Professor EBTT IFMS - TL

Sistema de inscrição e configuração de times

Desenvolvedor

Thiago de Oliveira Correia

Professor EBTT IFMS - TL

Integração e serviços

Desenvolvedor

Vitor Costa da Maia

Técnico Integrado em Informática IFMS - TL

Sistema de geração de exercícios

Desenvolvedor

Vinicius Henrique de Souza Lima

Tecnologia em Análise e Desenvolvimento de Sistemas IFMS - TL

Interface web de apresentação do evento