Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Dúvida] Usar partials ou um base.html

Olá! Consegui fazer o desafio criando um _base.html dentro de usuarios. Nesse html botei todo o começo do login.html e cadastro.html

{% load static %}

<!DOCTYPE html>
<html lang="pt-br">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Alura Space</title>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap" rel="stylesheet">
    <!-- CSS only -->
    <link rel="stylesheet" href="{% static '/styles/style.css' %}">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
</head>

<body>
    <div class="pagina-inicial">
        <header class="cabecalho">
            <img src="{% static '/assets/logo/Logo(2).png' %}" alt="Logo da Alura Space" />
            {% include 'partials/_alertas.html' %}
            <div class="cabecalho__busca">
                <div class="busca__fundo">
                    <form action="{% url 'buscar' %}">
                        <input  class="busca__input" type="text" name="buscar" placeholder="O que você procura?">
                        <button type="submit">
                            <img class="busca__icone" src="{% static '/assets/ícones/1x/search.png' %}" alt="ícone de search">
                        </button>
                    </form>
                </div>
            </div>
        </header>
        <main class="principal">
            <section class="menu-lateral">
                <nav class="menu-lateral__navegacao">
                    <a href="{% url 'index' %}"><img src="{% static '/assets/ícones/1x/Home - ativo.png' %}"> Home</a>
                    <a href="{% url 'login' %}"><img src="{% static '/assets/ícones/1x/Mais vistas - inativo.png' %}"> Login</a>
                    <a href="{% url 'cadastro' %}"><img src="{% static '/assets/ícones/1x/Novas - inativo.png' %}"> Cadastrar</a>
                    <a href="{% url 'logout' %}"><img src="{% static '/assets/ícones/1x/Surpreenda-me - inativo.png' %}"> Logout</a>
                </nav>
            </section>
            <section class="galeria" style="margin-left: 5em">

Funcionou sem problemas. Olhando como foi ensinado no curso anterior, foi feito um base.html e no index.html usou um :

{% extends 'galeria/base.html' %}
{% load static %}
{% block content %}

Minha duvida é qual a diferença de fazer usando extends ou o include? Espero ter ficado claro apesar da duvida confusa rs

Obrigado

1 resposta
solução!

Oi, Anderson, tudo bem?

A diferença entre o uso do extends e include no Django está relacionada à estruturação do código e à reutilização de templates.

Quando utilizamos o extends, estamos criando uma hierarquia de templates, onde um template principal (base.html) é estendido por outros templates (index.html, por exemplo). O template principal contém a estrutura básica do HTML, como o cabeçalho, rodapé e menu, e os templates filhos adicionam o conteúdo específico de cada página. Dessa forma, evitamos a repetição de código e facilitamos a manutenção do projeto, já que podemos fazer alterações no template principal e todas as páginas que o estendem serão atualizadas automaticamente.

Por outro lado, o include é utilizado para incluir um trecho de código HTML de um template em outro template. Isso é útil quando temos um código que se repete em várias páginas, como um formulário de login ou um menu de navegação. Ao utilizar o include, podemos criar um template separado para esses trechos de código e incluí-los em todas as páginas que precisarem. Assim, evitamos a repetição de código e facilitamos a manutenção, pois qualquer alteração feita no template incluído será refletida em todas as páginas que o utilizam.

No seu caso, ao criar um _base.html dentro da pasta usuarios e utilizar o include para adicionar o começo do login.html e cadastro.html, você está reutilizando o código dessas páginas em um template separado. Dessa forma, se houver alguma alteração nesse código, você só precisará fazer no _base.html e todas as páginas que o incluem serão atualizadas automaticamente.

Espero ter ajudado. Caso tenha dúvidas, conte com o fórum. Abraços!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software