Vamos dar sequencia ao nosso sistema de cadastro, se você chegou agora, da uma olhada nas postagens anteriores, segue os links:
Hello world em Python usando Django
Criando um sistema de cadastro com Django – Parte 1
No artigo anterior, criamos nossa primeira rota e view, vamos agora incluir mais duas rotas e seguir com parte do nosso sistema de cadastro.
Como vimos anteriormente, para incluir uma página temos que definir a rota, configurar a view e criar o template a ser utilizado, vamos realizar isso na sequencia conforme as imagens abaixo:
1 – Incluindo nova rota:
Incluimos mais dois paths, cadastro e usuarios
2 – Configurar a nossa view:
Criamos mais duas funções uma para cada rota.
3 – Agora vamos criar as pastas e arquivos html:
Criamos a pasta para cada view e seus respectivos arquivos index.html.
Agora vamos colocar um menu em cada view.
Entre no site do bootstrap e pegue um template padrão conforme mostrado na imagen:
O botão com o icone de uma prancheta serve para copiar o código do template padrão do bootstrap, cole em cada arquivo index.html de cada view.
A nossa página não vai conter nada demais, apenas um Hello, word por enquanto.
Feito isso vamos colocar um menu, procure no menu lateral do site do bootstrap o nome “navbar”.
Dentro da opção navbar, role a página até encontra a opção Toggle, copie o código clicando na prancheta.
Cole o código copiado logo depois da tag body nos seus arquivos index.html.
Agora altere o meu para que fique apenas as opções, Home, Cadastro e LIstar Usuários, para isso basta alterar as tags li do seu html, veja na imagem acima e logo abaixo como deve ficar:
Agora que já temos menu em todas as páginas, vamos colocar os links para navegação.
No Django colocamos os links na tag href do arquivo .html da seguinte maneira:
{% url ‘home’ %}
Abaixo como vai ficar:
Sendo esse nome home o que foi definido la no arquivo de rotas em name, veja de onde é:
Agora conseguimos clicar nos nomes do menu e mudar de rota de maneira mais fácil.
Para não ficar muito longo vamos encerrar por aqui e voltamos no próximo, segue o link:
