Kif Toħloq Applikazzjonijiet tal-Web Favuti għall-Mowbajl billi tuża Django Framework - Parti 3


Fil-Parti 1 ta’ din is-serje tgħallimt kif tinstalla u tikkonfigura Django f’ambjent virtwali u ħloqt l-iskeletru tal-ewwel proġett tiegħek.

Imbagħad fil-Parti 2 ħloqna applikazzjoni u mudell għal oġġetti Post, li aktar tard emigrajna għad-database. Fl-aħħarnett, urejnek kif tintegra l-applikazzjoni maħluqa ġdida tiegħek mal-interface tal-utent tal-amministrazzjoni Django.

Dawn l-artikoli huma parti mis-serje Django:

F'din il-gwida finali ser niddiskutu kif taċċessa l-applikazzjoni billi tuża l-UI u kif nagħmluha faċli għall-mowbajl għal kull tip ta 'apparat. Cela dit, ejja nibdew.

Ħolqien ta 'oġġetti permezz tal-interface ta' amministrazzjoni Django

Biex noħolqu oġġetti tat-tip Post (ftakar li huwa l-mudell li ddefinijna fil-Parti 2 ta 'din is-serje), se nużaw l-interface ta' l-amministrazzjoni Django.

Kun żgur li s-server tal-web Django built-in qed jaħdem fuq il-port 8000 (jew wieħed ieħor tal-għażla tiegħek) billi tħaddem il-kmand li ġej mid-direttorju ta' barra myfirstdjangoproject:

# cd ~/myfirstdjangoenv/myfirstdjangoproject
# python manage.py runserver 0.0.0.0:8000

Issa iftaħ il-brawżer tal-web tiegħek u ppunta lejn http://ip-address:8000/admin, imbagħad idħol billi tuża l-kredenzjali li waqqaft fl-artiklu preċedenti u ibda tikteb post (li, għal darb'oħra, se toħloq oġġett tat-tip Post u daħħal id-dejta assoċjata fid-database sottostanti):

Irrepeti l-proċess 2 jew 3 darbiet:

Wara li ħloqna ftit postijiet, ejja naraw x'għandna nagħmlu sabiex nuruhom bl-użu tal-web browser tagħna.

Il-fehma inizjali tagħna

L-ewwel ħsieb tagħna (~/myfirstdjangoenv/myfirstdjangoproject/myblog/views.py) se jkun inkarigat mill-iffiltrar tal-oġġetti kollha tal-Post u jirritorna dawk fejn il-valur ta' whenPublished huwa inqas minn jew ugwali għad-data u l-ħin attwali (whenPublished__lte=timezone.now()) ordnat bi dixxendenti meta Ippubblikat, li huwa l-istess bħal li tgħid l-aħħar l-ewwel.

Dawn l-oġġetti jiġu ffrankati f'postijiet varjabbli msemmijin b'mod konvenjenti, u jintbagħtu lura (identifikati bħala l-postijiet kollha) biex jiġu inkorporati fl-HTML, kif se naraw fit-taqsima li jmiss:

from django.shortcuts import render
from .models import Post
from django.utils import timezone
def posts(request):
        posts = Post.objects.filter(whenPublished__lte=timezone.now()).order_by('-whenPublished')
        return render(request, 'myblog/posts.html', {'allposts': posts})

Fl-aħħarnett, il-linja taħt doppja f'whenPublished__lte hawn fuq tintuża biex tissepara qasam tad-database (meta Published) minn filtru jew operazzjoni (lte = inqas minn jew ugwali).

Ladarba ddefinijna l-fehma inizjali tagħna, ejja naħdmu fuq il-mudell assoċjat.

Oħloq Template għall-ewwel Proġett tagħna

Wara d-direttivi u l-mogħdijiet mogħtija fit-taqsima preċedenti, aħna se naħżnu l-mudell inizjali tagħna ġewwa myblog/templates/myblog. Dan ifisser li ser ikollok bżonn toħloq direttorju bl-isem ta' mudelli u sottodirettorju msejjaħ myblog:

# cd ~/myfirstdjangoenv/myfirstdjangoproject/myblog
# mkdir -p templates/myblog

Aħna se nsejħu l-mudell posts.html u daħħal il-kodiċi li ġej fih. Tinduna li qed inżidu referenzi onlajn għal fonts jQuery, Bootstrap, FontAwesome u Google.

Barra minn hekk, għandna kodiċi Python magħluqa ġewwa parentesi kaboċċi ġewwa l-HTML. Jekk jogħġbok innota li għal kull oġġett tat-tip Post aħna nuru t-titlu tiegħu, id-data ppubblikata u l-awtur tiegħu, u finalment it-test tiegħu. Fl-aħħarnett, bl-aħmar se tara li nagħmlu referenza għall-oġġetti rritornati permezz ta' myblog/views.py:

Ok, hawn il-fajl posts.html:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link href='https://fonts.googleapis.com/css?family=Indie+Flower' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet" type='text/css'">
<script src="https://code.jquery.com/jquery-2.1.4.min.js">
</script>
    <style>
      .title {
        font-family: 'Indie Flower', serif;
        font-size: 30px;
        color: #1E90FF;
      }
      h1 {
        font-family: 'Pacifico', serif;
        font-size: 45px;
        color: #1E90FF;
      }
    </style>
</head>
<body>
<div class="container"><h1>My blog</h1><br>
{% for post in allposts %}
    <div>
        <div class="title">{{ post.title }}</div>
        <strong>Published on {{ post.whenPublished }} by {{ post.author }}.</strong>
        <p>{{ post.text|linebreaks }}</p>
    </div>
{% endfor %}
</div>
</body>
</html>

Fil-mudell ta' hawn fuq, il-filtru tal-linebreaks jintuża biex jissostitwixxi l-line breaks f'test sempliċi bl-ekwivalenti HTML korrispondenti (
jew

) biex jifformattja kull wieħed. post kif suppost b'separazzjoni tal-paragrafu.

Sussegwentement, irridu nwaqqfu mapping bejn URLs fl-applikazzjoni tagħna u l-fehmiet korrispondenti li jirritornaw id-dejta. Biex tagħmel dan, oħloq fajl bl-isem urls.py ġewwa myblog bil-kontenut li ġej:

from django.conf.urls import url
from . import views
urlpatterns = [
    url(r'^$', views.posts, name='posts'),
]

Il-r^$ jistħoqqilha ftit aktar spjegazzjoni. Il-r ewlieni jagħti struzzjonijiet lil Django biex jittratta s-sekwenza ġewwa kwotazzjonijiet singoli bħala espressjoni regolari.

B'mod partikolari, r^$ tirrappreżenta string vojta sabiex meta nippuntaw il-brawżer tagħna lejn http://ip-address:8000 (u xejn aktar), id-data rritornata mill-postijiet varjabbli ġewwa views.py (irreferi għat-taqsima preċedenti) se jiġu ppreżentati fil-paġna ewlenija tagħna:

Fl-aħħar, iżda mhux l-inqas, se ninkludu l-fajl urls.py tal-applikazzjoni tal-blog tagħna (~/myfirstdjangoenv/myfirstdjangoproject/myblog/urls.py) fil-urls.py tal-proġett ewlieni tagħna (~/myfirstdjangoenv/myfirstdjangoproject/myfirstdjangoproject/urls .py):

from django.conf.urls import include, url
from django.contrib import admin

urlpatterns = [
    url(r'^admin/', include(admin.site.urls)),
    url(r'', include('myblog.urls')),
]

Imbagħad ejja nibdew is-server tal-web:

# cd ~/myfirstdjangoenv/myfirstdjangoproject
# python manage.py runserver 0.0.0.0:8000

Issa għandna nkunu nistgħu naraw il-listi tal-postijiet li ħloqna qabel:

Grazzi għal Bootstrap, xorta jista' jkollok viżwalizzazzjoni eċċellenti f'apparat iżgħar:

Fil-qosor

Ejja issa nirrevedu l-kunċetti li koprejna f'dan l-artikolu u matul din is-serje:

1. Kull mudell jiddefinixxi oġġett u jimmappa għal tabella ta 'database, li l-oqsma tagħha mbagħad jimmappaw mal-proprjetajiet ta' dak l-oġġett. Min-naħa l-oħra, mudell jiddefinixxi l-interface tal-utent fejn id-dejta rritornata mill-veduta se tintwera.

Ejja ngħidu li rridu nimmodifikaw il-mudell tagħna billi nżidu qasam imsemmi sommarju mal-oġġett Post, fejn se naħżnu deskrizzjoni qasira fakultattiva ta 'kull post. Ejja nżidu l-linja li ġejja f'myblog/models.py:

summary = models.CharField(max_length=350, blank=True, null=True)

Kif tgħallimna fl-artiklu ta 'qabel, għandna bżonn nimmigraw il-bidliet għad-database:

# python manage.py makemigrations myblog
# python manage.py migrate myblog

Imbagħad uża l-interface tal-amministrazzjoni biex teditja l-postijiet u żid sommarju qasir għal kull post. Fl-aħħarnett, ibdel il-linja li ġejja fil-mudell (posts.html):

<p>{{ post.text|linebreaks }}</p>

ma

<p>{{ post.summary }}</p>

Aġġorna l-home page biex tara l-bidliet:

2. Funzjoni tal-vista tieħu talba HTTP u tirritorna rispons HTTP. F'dan l-artikolu, def posts(talba) f' views.py jagħmel sejħa għad-database sottostanti biex tirkupra l-postijiet kollha. Jekk irridu nġibu l-postijiet kollha bil-kelma ansible fit-titlu, għandna nissostitwixxu.

posts = Post.objects.filter(whenPublished__lte=timezone.now()).order_by('-whenPublished')

ma

posts = Post.objects.filter(title__icontains="ansible").order_by('-whenPublished')

Billi tissepara l-interface tal-utent mil-loġika tal-applikazzjoni fl-applikazzjonijiet tal-web, Django jiffaċilita l-kompiti taż-żamma u l-eskala tal-apps.

3. Jekk segwejt l-istruzzjonijiet ipprovduti f'din is-serje, l-istruttura tal-proġett tiegħek għandha tkun kif ġej:

myfirstdjangoenv/myfirstdjangoproject
├── db.sqlite3
├── manage.py
├── myblog
│   ├── admin.py
│   ├── admin.pyc
│   ├── __init__.py
│   ├── __init__.pyc
│   ├── migrations
│   │   ├── 0001_initial.py
│   │   ├── 0001_initial.pyc
│   │   ├── __init__.py
│   │   └── __init__.pyc
│   ├── models.py
│   ├── models.pyc
│   ├── templates
│   │   └── myblog
│   │       └── posts.html
│   ├── tests.py
│   ├── urls.py
│   ├── urls.pyc
│   ├── views.py
│   └── views.pyc
└── myfirstdjangoproject
    ├── __init__.py
    ├── __init__.pyc
    ├── settings.py
    ├── settings.pyc
    ├── urls.py
    ├── urls.pyc
    ├── wsgi.py
    └── wsgi.pyc

F'każ li l-lista ta' hawn fuq ma turix b'mod korrett fil-browser tiegħek, hawn screenshot tal-output tal-kmand li ġej:

# tree myfirstdjangoenv/myfirstdjangoproject

Sommarju

Għalkemm dawn il-kunċetti kollha jistgħu jidhru ftit intimidanti għall-ewwel, nista' nassigurak Django jiswa l-isforzi kollha meħtieġa biex issir familjari magħha

Nittama li l-eżempju li użajna f'din is-sensiela biex nintroduċuk f'dan il-qafas tal-web eċċellenti jimmotivak biex titgħallem aktar. Jekk iva, id-dokumentazzjoni uffiċjali ta 'Django (li tinżamm kontinwament aġġornata) hija l-aħjar post biex tibda.

Nista' nassigurakom li hemm ħafna aktar għal Django milli nistgħu nkopru b'mod adegwat f'serje ta' artikli, għalhekk tħossok liberu li tesplorah u titgħallem billi tagħmel!

Ħossok liberu li tibgħatilna nota bi mistoqsijiet jew suġġerimenti billi tuża l-formola hawn taħt.