Poznámka:
Přístup k této stránce vyžaduje autorizaci. Můžete se zkusit přihlásit nebo změnit adresáře.
Přístup k této stránce vyžaduje autorizaci. Můžete zkusit změnit adresáře.
Tento článek představuje krok 4 v sérii kurzů Práce s webovou architekturou Django v sadě Visual Studio.
Předchozí kroky v této sérii kurzů vytvoří řešení sady Visual Studio a projekty Django pro dvě aplikace. BasicProject je minimální aplikace založená na šabloně prázdného webového projektu Django a HelloDjangoApp používá šablonu aplikace Django 1.9 k poskytování statických souborů se zobrazeními stránek ze šablon HTML.
V kroku 4 přidáte do řešení třetí aplikaci Django založenou na úplné šabloně Django Web Project. Tato šablona vám pomůže vytvořit plnohodnotnou aplikaci Django se třemi stránkami, které dědí ze základní šablony stránky. Aplikace využívá statické javascriptové knihovny, jako je jQuery a Bootstrap. Možnosti ověřování šablony jsou popsány v posledním kroku v sérii tutoriálů.
V kroku 4 kurzu se naučíte:
- Vytvoření plnohodnotné webové aplikace Django pomocí šablony webového projektu Django
- Prohlédnout strukturu projektu Django podle poskytnuté šablony
- Prozkoumání zobrazení a šablon stránek vytvořených šablonou projektu
- Prozkoumání směrování adres URL poskytnuté šablonou
Požadavky
Řešení sady Visual Studio vytvořené v kroku 1: Vytvoření projektu a řešení sady Visual Studio, které používá prázdnou šablonu webového projektu Django.
V části Požadavky v kroku 1 této série kurzů najdete podrobnosti o verzích šablon Django, projektech sady Visual Studio a projektech Django a vývoji v Pythonu na Macu.
(Volitelné) Projděte si pokyny v předchozích krocích pro kompletní pracovní postup Django v sadě Visual Studio:
Vytvoření projektu ze šablony
Pomocí následujícího postupu vytvořte webovou aplikaci Django z úplné šablony Webového projektu Django:
Ve Visual Studio přejděte na Průzkumníka řešení, klikněte pravým tlačítkem na řešení LearningDjango a vyberte Přidat>Nový projekt.
Poznámka
Krok 1 série kurzů vytvoří LearningDjango řešení sady Visual Studio, které bude obsahovat všechny projekty Django popsané v této sérii. Díky zachování všech projektů Django ve stejném řešení můžete snadno přepínat mezi různými soubory pro porovnání.
V případě, že chcete použít samostatné řešení Visual Studio pro projekt Django v tomto kurzu, zvolte Soubor>Nový>projekt.
V dialogovém okně Přidat nový projekt vyhledejte "Django", zvolte šablonu Django Web Project a vyberte Další.
Konfigurace nového projektu:
Nastavte Název projektu na DjangoWeb.
Zadejte umístění, kam má Visual Studio uložit projekt. (Výchozí je aktuální umístění pro řešení a existující projekty Django.)
Vyberte Vytvořit.
Vytvoření virtuálního prostředí
Po zahájení vytváření projektu ve Visual Studio by se měla zobrazit zpráva , že soubor specifikace balíčku Pythonu "requirements.txt" byl zjištěn v projektu "DjangoWeb".:
Zpráva označuje, že vybraná šablona obsahuje soubor requirements.txt, který můžete použít k vytvoření virtuálního prostředí pro projekt.
Důležitý
Pokud se výzva k zobrazení zprávy nezobrazí, může dojít k chybám při pokusu o vytvoření superuživatele Django v další části.
Ověřte, že Visual Studio rozpozná requirements.txt soubor projektu. V průzkumníku řešení rozbalte složku projektu DjangoWeb a otevřete soubor requirements.txt. Visual Studio by měl zobrazit výzvu k zobrazení zprávy podle očekávání.
Pokud chcete nastavit virtuální prostředí, postupujte takto:
V zobrazené zprávě vyberte odkaz pro instalaci nebo vytvoření virtuálního prostředí.
V dialogovém okně Přidat virtuální prostředí vyberte Vytvořit pro přijetí výchozích hodnot.
Vytvoření superuživatele Django
Jakmile Visual Studio vytvoří projekt DjangoWeb, otevře se soubor readme.html projektu. Tento soubor obsahuje pokyny k vytvoření superuživatele Django (tj. správce) projektu.
Následujícím postupem vytvoříte superuživatele Django:
V Průzkumníku řešeníklikněte pravým tlačítkem na projekt DjangoWeb, vyberte Pythona poté vyberte Django Create Superuser:
Na příkazovém řádku zadejte podrobnosti o účtu projektu, včetně uživatelského jména, hesla a e-mailové adresy.
Pro existující účet nemusíte používat přihlašovací údaje zabezpečení. Můžete vytvořit nové uživatelské jméno a heslo pro použití speciálně s webovou aplikací Django.
Poznamenejte si přihlašovací údaje pro pozdější použití. K uplatnění ověřovacích funkcí webové aplikace potřebujete přihlašovací údaje.
Spuštění webového projektu Django
Teď jste připraveni spustit webovou aplikaci Django a zobrazit funkce poskytované šablonou:
V Průzkumníku řešeníklikněte pravým tlačítkem myši na projekt DjangoWeb a pak vyberte Nastavit jako spouštěný projekt.
Tento příkaz nastaví vybraný projekt jako výchozí počáteční projekt pro řešení sady Visual Studio. Když spustíte ladicího programu, Visual Studio spustí kód pro spouštěný projekt. V Průzkumníku řešeníse název spouštěcího projektu řešení zobrazuje tučně:
Vyberte Ladění>Spustit ladění (F5) nebo pomocí tlačítka Web Server na panelu nástrojů spusťte server:
Prozkoumejte stránky webové aplikace
Aplikace vytvořená šablonou má tři stránky: "Domů", "O aplikaci" a "Kontakt". Na navigačním panelu jsou odkazy pro každou stránku.
Zkuste mezi stránkami přepínat pomocí možností na navigačním panelu.
Prozkoumejte různé části spuštěné aplikace, včetně obsahu stránky. Všimněte si, jak se změní směrování adresy URL na základě aktuální stránky.
Ověřte se pomocí aplikace tak, že na navigačním panelu vyberete možnost Přihlásit se. Zadejte přihlašovací údaje superuživatele, které jste zadali v předchozí části.
Aplikace vytvořená webovou šablonou Django Web Project používá bootstrap k responzivnímu rozložení, které vyhovuje faktorům mobilních formulářů. Chcete-li zobrazit tuto přizpůsobivost, změňte velikost prohlížeče na úzké zobrazení, aby se obsah zobrazil svisle a také navigační lišta se změnila na ikonu nabídky:
Aplikaci můžete nechat spuštěnou pro cvičení v další části.
Pokud chcete uložit svoji práci, zastavte aplikaci a postupujte podle pokynů v předchozích krocích v této sérii kurzů:
- krok 1 (vyloučení souborů virtuálního prostředí ze správy zdrojového kódu)
- krok 2 (potvrzení změn do správy zdrojového kódu)
Prozkoumání struktury projektu webové aplikace
Šablona Webového projektu Django vytvoří projekt webové aplikace v sadě Visual Studio s následující strukturou:
Soubory v kořenovém adresáři projektu DjangoWeb visual studio:
- manage.py: Nástroj pro správu Django.
- db.sqlite3: Výchozí databáze SQLite.
- requirements.txt: Identifikuje balíčky v projektu, které mají závislost na Django 1.x.
- readme.html: Obsahuje informace o webové aplikaci, včetně požadavků a kritických postupů použití. Visual Studio zobrazí tento soubor po vytvoření projektu. Jak je popsáno výše, tento soubor obsahuje pokyny k vytvoření účtu superuživatele (správce) pro aplikaci.
Složka DjangoWeb/app:
Tato složka obsahuje všechny soubory aplikace, včetně zobrazení, modelů, testů, formulářů. Tato složka také obsahuje podsložky se soubory, včetně šablon, migracía statických souborů. Obvykle přejmenujete složku aplikace tak, aby používala výraznější název, jako je samotný název aplikace.
Složka DjangoWeb/DjangoWeb:
Tato složka je složka projektu Django. Obsahuje typické soubory projektu Django: __init__.py, settings.py, urls.pya wsgi.py. Soubor settings.py je již nakonfigurován pro aplikaci a soubor databáze pomocí šablony projektu. Soubor urls.py je také nastavený s trasami na všechny stránky aplikace, včetně formuláře Přihlášení.
Sdílení virtuálního prostředí mezi projekty sady Visual Studio
Mezi projekty sady Visual Studio můžete sdílet virtuální prostředí. Mějte ale na paměti, že různé projekty pravděpodobně v průběhu času používají různé balíčky. Sdílené virtuální prostředí musí obsahovat všechny balíčky pro všechny projekty, které ho používají.
Pokud chcete použít existující virtuální prostředí, postupujte takto:
Po zobrazení výzvy k instalaci závislostí v sadě Visual Studio vyberte možnost nainstaluji je sám/sama.
V Průzkumníku řešeníklikněte pravým tlačítkem na uzel prostředí Pythonu a vyberte Přidat existující virtuální prostředí.
Přejděte do složky, která obsahuje virtuální prostředí, a pak vyberte OK.
Prozkoumání zobrazení a šablon stránek
Kód pro zobrazení stránek vytvořený projektem Django Web Project se nachází v souboru aplikace/views.py projektu. Každá funkce zobrazení volá pomocnou funkci django.shortcuts.render s cestou k šabloně a jednoduchému objektu slovníku. Funkce about vytvoří zobrazení pro stránku About ve webové aplikaci:
def about(request):
"""Renders the about page."""
assert isinstance(request, HttpRequest)
return render(
request,
'app/about.html',
{
'title':'About',
'message':'Your application description page.',
'year':datetime.now().year,
}
)
Šablony stránek HTML pro zobrazení se nacházejí ve složce projektu app/templates/app (kterou běžně přejmenujete). Základní šablona, layout.html, je nejrozsáhlejší. Soubor odkazuje na všechny nezbytné statické soubory (JavaScript a CSS) pro zobrazení aplikace.
Tato šablona také definuje dva oddíly block: content a scripts. Ostatní stránky aplikace webu přepisují sekci {% block content %} v souboru layout.html. V této anotované verzi souboru block můžete vidět dva <body> oddíly v prvku :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<!-- Define viewport for Bootstrap's responsive rendering -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ title }} - My Django Application</title>
{% load staticfiles %}
<link rel="stylesheet" type="text/css" href="{% static 'app/content/bootstrap.min.css' %}" />
<link rel="stylesheet" type="text/css" href="{% static 'app/content/site.css' %}" />
<script src="{% static 'app/scripts/modernizr-2.6.2.js' %}"></script>
</head>
<body>
<!-- Navigation bar section omitted in this excerpt -->
<div class="container body-content">
<!-- Content block - App pages override this block -->
{% block content %}
{% endblock %}
<!-- App header and footer content -->
<hr/>
<footer>
<p>© {{ year }} - My Django Application</p>
</footer>
</div>
<script src="{% static 'app/scripts/jquery-1.10.2.js' %}"></script>
<script src="{% static 'app/scripts/bootstrap.js' %}"></script>
<script src="{% static 'app/scripts/respond.js' %}"></script>
<!-- Scripts block - List page-specific scripts in this block -->
{% block scripts %}
{% endblock %}
</body>
</html>
Jednotlivé šablony stránek HTML, about.html, contact.htmla index.html, každý rozšiřuje základní šablonu layout.html. Soubor šablony about.html je nejjednodušší a zobrazuje {% extends %} značku a oddíl {% block content %}:
{% extends "app/layout.html" %}
<!-- Content block overrides "content" block in layout template -->
{% block content %}
<h2>{{ title }}.</h2>
<h3>{{ message }}</h3>
<p>Use this area to provide additional information.</p>
{% endblock %}
Soubory šablon index.html a contact.html používají stejnou strukturu a poskytují další pokyny v bloku content.
Složka app/templates/app obsahuje dvě další šablony stránek HTML. Soubor login.html definuje obsah stránky Přihlášení aplikace. Soubor loginpartial.html se přenese do souboru layout.html pomocí příkazu {% include %}.
poslední krok (ověřování uživatelů) v této sérii kurzů popisuje tyto dva soubory šablon podrobněji.
Odsadit značky {% blok %} a {% endblock %} v šablonách
Ukázky HTML zobrazují značkování poskytnuté v šabloně stránky ve vývojovém prostředí Visual Studio. Všimněte si, že značky block nejsou v kódu odsazené. Pro zřetelné zobrazení umístění značek block neodsazují šablony stránek Microsoft Visual Studio tyto značky.
Šablony stránek Django ale fungují správně, pokud odsadíte značky block. Někteří vývojáři dávají přednost sladění značek v příslušných nadřazených elementech HTML.
Prozkoumání vzorů tras adres URL
Soubor URL projektu Django (DjangoWeb/DjangoWeb/urls.py) vytvořený šablonou webového projektu Django obsahuje následující kód:
"""
Definition of urls for DjangoWeb
"""
from datetime import datetime
from django.urls import path
from django.contrib import admin
from django.contrib.auth.views import LoginView, LogoutView
from app import forms, views
urlpatterns = [
path('', views.home, name='home'),
path('contact/', views.contact, name='contact'),
path('about/', views.about, name='about'),
path('login/',
LoginView.as_view
(
template_name='app/login.html',
authentication_form=forms.BootstrapAuthenticationForm,
extra_context=
{
'title': 'Log in',
'year' : datetime.now().year,
}
),
name='login'),
path('logout/', LogoutView.as_view(next_page='/'), name='logout'),
path('admin/', admin.site.urls),
]
První tři vzory adres URL se mapují přímo na home, contacta about funkce zobrazení definované v souboru aplikace/views.py projektu. Vzory login/ a logout/ odpovídají ověřovacím funkcím aplikace.
Speciální vzory adres URL, jako ^login/$ a ^logout$, získávají přístup k integrovaným zobrazením Django, místo k pohledům definovaným v aplikaci. Volání metody url také obsahují další data pro přizpůsobení zobrazení.
Poslední krok (ověření uživatelů) v této sérii popisuje, jak pracovat s voláními adres URL.
Prozkoumání rozdílů ve vzorech adres URL
V kroku 3 (dědičnost šablon HTML) této série tutoriálů používá cesta na stránku O nás vzor '^about$'. Tento model se liší od trasy url uvedené v tomto kroku kurzu. V závislosti na verzi šablony může ukázkový kód zobrazit vzor adresy URL stránky "About" jako about/ nebo ^about místo ^about$.
Chybějící závěrečný znak dolaru $ v regulárním výrazu je opomenutí v mnoha verzích šablony projektu. Vzor adresy URL funguje dokonale dobře pro stránku s názvem "about" nebo "About". Bez koncového znaku $ ale vzor adresy URL odpovídá také adresám URL, jako je "about=django", "about09876", "about-face" atd. Koncový znak $ vytvoří vzor adresy URL, který zajistí shodu pouze pro termín "about".
Další krok
Krok 5: Ověření uživatelů v Django