🚀 Semana 3 – Introdução ao Flask com VS Code

Chegou a hora de transformar nosso conhecimento em programação Python em algo ainda mais poderoso: criar sites e sistemas web com Flask!

Flask é um framework leve e muito usado para desenvolver aplicações web com Python. Ele permite criar sites, APIs, sistemas de login, dashboards e muito mais, de forma simples e eficiente.

Nesta semana, vamos aprender a configurar tudo do zero, passo a passo, usando o Visual Studio Code (VS Code), que é um dos editores mais usados pelos programadores. Veremos:

  • ✅ O que é e como criar um ambiente virtual (venv), que organiza melhor nossos projetos Python;
  • ✅ Como instalar o Flask dentro desse ambiente virtual;
  • ✅ E como executar a primeira aplicação Flask, acessando um site feito por você mesmo pelo navegador!

Prepare seu computador e sua curiosidade. A jornada com Flask começa agora! 🌐🐍

🔍 O que é um Ambiente Virtual (venv)?

Quando desenvolvemos em Python, frequentemente precisamos instalar pacotes (como o Flask) para nossos projetos. Mas e se cada projeto precisar de versões diferentes desses pacotes?

É aí que entra o ambiente virtual! Um venv é como uma “bolha isolada” onde você instala tudo o que aquele projeto precisa, sem afetar outros projetos no seu computador.

📦 Exemplo: Imagine que:

  • Seu Projeto A usa Flask versão 2.0
  • Seu Projeto B precisa do Flask versão 3.0

Se você instalar o Flask diretamente no sistema, um projeto pode quebrar o outro. Com venv, cada um tem seu ambiente independente com a versão certa!


Resumindo: Um venv serve para:

  • ✅ Manter os pacotes do projeto organizados;
  • ✅ Evitar conflitos entre versões de bibliotecas;
  • ✅ Facilitar o compartilhamento do projeto com outras pessoas.

💡 Dica: Sempre que começar um novo projeto em Python, crie um ambiente virtual antes de instalar pacotes.

✅ Etapa 1 – Criando o ambiente virtual

Abra o terminal no VS Code dentro da pasta do projeto. Em seguida, execute o comando:

python -m venv venv

Isso criará uma pasta chamada venv com os arquivos do ambiente.

Ativando o ambiente virtual:

  • Windows:
    venv\Scripts\activate
  • Linux ou macOS:
    source venv/bin/activate

Você saberá que ativou corretamente quando o terminal mostrar algo como (venv) no início da linha.

📦 Etapa 2 – Instalando o Flask

Com o ambiente virtual ativado, o próximo passo é instalar o Flask, que é o framework web que usaremos.


🤔 O que é o pip?

pip é o gerenciador de pacotes do Python. Ele serve para baixar, instalar e atualizar bibliotecas que você precisa usar nos seus projetos.

💡 Pense no pip como uma "loja de ferramentas" do Python — sempre que você quiser usar algo novo, basta pedir ao pip.


Agora, com o ambiente virtual ativado, digite este comando no terminal para instalar o Flask:

pip install flask

✅ Isso instalará o Flask somente dentro do ambiente virtual, deixando o resto do sistema intocado.

📁 Etapa 3 – Estrutura do Projeto

Crie a seguinte estrutura de pastas e arquivos:

meu_projeto/
├── app.py
└── templates/
    └── index.html
💻 Etapa 4 – Criando o arquivo app.py

Dentro da pasta principal, crie o arquivo app.py com este conteúdo:

from flask import Flask, render_template

app = Flask(__name__)

@app.route('/')
def home():
    return render_template('index.html')

if __name__ == '__main__':
    app.run(debug=True)
📝 Etapa 5 – Criando o template index.html

No diretório templates/, crie o arquivo index.html com este conteúdo básico:

<!DOCTYPE html>
<html>
<head>
  <title>Minha Primeira Página Flask</title>
</head>
<body>
  <h1>Olá, Flask!</h1>
</body>
</html>
🚀 Etapa 6 – Rodando o servidor Flask

Execute o projeto com o comando:

python app.py

Abra o navegador e vá para: http://127.0.0.1:5000

Você verá a mensagem: Olá, Flask!

🎥 Vídeo: Instalação e primeiro projeto com Flask