Em nosso material de estudo sobre Programação Front-End, exploramos como o desenvolvimento de
websites modernos depende da integração harmoniosa de diferentes linguagens e tecnologias. A
combinação de HTML, CSS e JavaScript forma a base do desenvolvimento Front-End, permitindo a criação
de interfaces interativas, responsivas e visualmente atraentes. Cada uma dessas tecnologias desempenha
um papel específico: o HTML estrutura o conteúdo, o CSS estiliza a aparência, e o JavaScript adiciona
interatividade e comportamentos dinâmicos às páginas web.
Com a evolução contínua dos dispositivos e navegadores, os desenvolvedores Front-End precisam adaptar-
se constantemente às novas tendências de design, como o “flat design” para dispositivos móveis, e dominar
bibliotecas e frameworks que facilitam o desenvolvimento, como jQuery, React e Bootstrap.
Fonte: NOEL, André Abdala. Programação Front End. Florianópolis, SC: Arqué, 2025. 232 p.
ATIVIDADE:
Com base em nosso material e em pesquisas complementares sobre desenvolvimento Front-End, você irá:
Criar um Website Completo: Desenvolva um website responsivo de tema livre (portfólio pessoal, blog, loja
virtual simplificada, etc.) utilizando HTML5, CSS3 e JavaScript. O site deve conter pelo menos quatro páginas
interligadas e demonstrar o uso adequado dos conceitos aprendidos na disciplina.
Implementar Recursos Específicos
Seu website deve obrigatoriamente incluir:
– Layout responsivo que se adapte a diferentes tamanhos de tela
– Menu de navegação funcional
– Formulário de contato com validação via JavaScript
– Uso de pelo menos dois efeitos interativos com JavaScript/jQuery
– Aplicação de conceitos de SEO básico no código
Documentação: Elabore um relatório técnico detalhando as escolhas de design, arquitetura do site,
tecnologias utilizadas e desafios enfrentados. Inclua capturas de tela do resultado final e explique como o
projeto aplica os conceitos estudados na disciplina.
Orientações Adicionais
– Hospedagem e Entrega: O código-fonte completo deve ser compactado em formato ZIP e enviado junto
com o relatório. Caso deseje, pode também hospedar o site em plataformas gratuitas como GitHub Pages,
Netlify ou Vercel e incluir o link no relatório.
– Organização do Código: O código deve estar bem organizado, com comentários explicativos e seguindo
boas práticas de desenvolvimento Front-End.
– Originalidade: O design e conteúdo devem ser originais ou utilizar recursos com licença adequada,
citando todas as fontes utilizadas.
REFERÊNCIAS:
TOKUMOTO, Ronie Cesar. Programação Front End. Maringá-PR: Unicesumar, 2018.
NOEL, André Abdala. Programação Front End. Florianópolis, SC: Arqué, 2025. 232 p.
SILVA, Maurício Samy. HTML5 – A linguagem de marcação que revolucionou a web. São Paulo: Novatec,
2021.
MDN Web Docs. Front-end web developer. Disponível em: https://developer.mozilla.org/pt-
BR/docs/Learn/Front-end_web_developer. Acesso em: 8 abr. 2024.
W3Schools. HTML Tutorial. Disponível em: https://www.w3schools.com/html/. Acesso em: 8 abr. 2024.
W3Schools. CSS Tutorial. Disponível em: https://www.w3schools.com/css/. Acesso em: 8 abr. 2024.