diegoep

Tutorial: Emmet Expressions

O que são Emmet Expressions?

Emmet é uma ferramenta de produtividade para desenvolvedores web que permite escrever HTML e CSS de forma mais rápida através de abreviações. Com simples expressões, você pode gerar estruturas complexas de código automaticamente.

Por que são úteis para produtividade?

• Velocidade: Reduz drasticamente o tempo de escrita de código HTML/CSS
• Menos digitação: Transforma abreviações simples em código completo

diegoep

Analisando uma Página da Web

Objetivo

O objetivo desta atividade consiste em abordar os seguintes tópicos:

• Analisar uma página da Web utilizando a opção Ver Código Fonte
• Inspecionar uma página com a Ferramenta de Desenvolvedor do Browser
• Desabilitar CSS com o Plugin Web Developer
• Editando a cópia do HTML

diegoep

🏗️ Exercício: Construindo um Blog com Tags Semânticas

📚 Sobre Tags Semânticas

Tags semânticas são elementos HTML que possuem significado além da apresentação visual. Elas descrevem o conteúdo e sua função na página, tornando o código mais acessível e compreensível para navegadores, leitores de tela e mecanismos de busca.

🎯 Objetivo

Criar uma página de blog pessoal utilizando exclusivamente tags semânticas HTML5, explorando a estrutura e o significado de cada elemento.

diegoep

📝 Atividade Prática – Persistência de Posts em Arquivo CSV

Objetivo

Modificar o projeto do mini blog para que os posts sejam armazenados em um arquivo CSV, garantindo que mesmo ao reiniciar a aplicação os dados sejam preservados.

Tarefas

1. Criar um módulo de persistência

• Crie um novo arquivo na pasta app/ para centralizar as funções de leitura e escrita no CSV.
• Defina o nome do arquivo CSV (ex.: posts.csv).
• Crie uma função para ler o arquivo linha por linha, ignorando a primeira linha (cabeçalho) e transformando cada linha em um dicionário com as chaves "title" e "content".

diegoep

Configuração do application.yml

server:
  port: 8081

spring:
  application:
    name: messaging-ms

  cloud:

diegoep

Tutorial: Criando um Mini Blog com Flask e Blueprints

Introdução

Este tutorial irá guiá-lo através da criação de um mini blog usando Flask, demonstrando como organizar o código usando blueprints para manter uma estrutura limpa e escalável.

O que você aprenderá

• Como configurar um projeto Flask
• O conceito de blueprints e sua importância

diegoep

Tutorial: Criando um Carrinho de Compras com Flask

Este tutorial ensina como criar um sistema completo de carrinho de compras usando Flask com sessões, templates e Tailwind CSS.

Pré-requisitos

• Python 3.7+ instalado
• Conhecimento básico de Python
• Noções básicas de HTML e CSS

diegoep

Tutorial: Envio e Recebimento de Mensagens com Spring Cloud Stream no Spring Boot

Este tutorial mostra como configurar uma aplicação Spring Boot para enviar e receber mensagens utilizando Spring Cloud Stream com o Kafka como sistema de mensageria.

Pré-requisitos

• Java 17 ou superior
• Spring Boot 3.x
• Kafka rodando localmente (porta padrão: 9092)

diegoep

Aplicação Institucional Simples com Flask, Jinja2 e Tailwind CSS

Pré-requisitos

Antes de começar, certifique-se de ter:

• Python instalado: Baixe e instale a versão mais recente do Python em python.org.
• VS Code instalado: Baixe e instale o Visual Studio Code em code.visualstudio.com.
• Git Bash (ou outro terminal compatível com Bash) no Windows: Para este tutorial, assumimos o uso do Bash no terminal integrado do VS Code.

Passo 1: Configuração do Ambiente Virtual (venv)

diegoep

PWEB1 - Projeto - Primeira Entrega: Configuração Inicial do Repositório Git

1. Objetivo

O objetivo desta entrega é estabelecer a infraestrutura de controle de versão do projeto, garantindo que todos os membros da equipe possam colaborar de forma eficiente e que a documentação inicial esteja presente.

2. Itens da Entrega

A entrega consiste nos seguintes componentes: