Pembangunan Django: Bagaimana untuk mencipta aplikasi web yang cantik menggunakan Python dan Django

Django ialah rangka kerja aplikasi web Python popular yang menyediakan set alat dan enjin berkuasa yang boleh membantu kami membina aplikasi web yang cantik dan berskala dengan mudah.

Dalam artikel ini, kami akan memperkenalkan cara mencipta aplikasi web yang cantik menggunakan Python dan Django. Kami akan mulakan dengan memasang Django dan mencipta projek Django serba baharu. Seterusnya, kami akan mencipta aplikasi web ringkas dan memperkenalkan cara mencipta model pangkalan data, paparan dan templat. Akhir sekali, kami akan menambah beberapa gaya dan animasi pada aplikasi ini untuk menjadikannya lebih cantik.

1. Pasang Django

Sebelum kami mula mencipta aplikasi web kami, kami perlu memasang Django pada komputer tempatan kami. Django boleh dipasang melalui arahan berikut:

pip install Django

Jika anda belum memasang pip, sila pasang pip terlebih dahulu. pip ialah pengurus pakej Python yang membolehkan anda mengurus perpustakaan dan kebergantungan Python dengan mudah.

Selepas pemasangan selesai, anda boleh menyemak sama ada Django telah berjaya dipasang dengan menjalankan arahan berikut:

django-admin --version

Jika Django telah berjaya dipasang, anda akan melihat nombor versi Django.

2. Cipta projek Django baharu

Kini setelah kami memasang Django, kami boleh mula mencipta aplikasi web kami. Pertama, kita perlu mencipta projek Django baharu. Projek Django baharu boleh dibuat dengan arahan berikut:

django-admin startproject myproject

Perintah ini akan mencipta direktori baharu yang dipanggil "myproject" dan mencipta struktur asas projek Django di dalamnya.

3. Cipta aplikasi web ringkas

Kami telah mencipta projek Django baharu dan kini kami boleh mula mencipta aplikasi web kami. Kami akan mencipta aplikasi web mudah yang akan membolehkan pengguna menerbitkan dan melihat siaran di tapak web.

Untuk mencipta aplikasi web ini, kita perlu melakukan langkah berikut:

1 Cipta aplikasi Django baharu
2. Cipta model pangkalan data
3. Cipta. pandangan dan Templat

Pertama, kami akan mencipta aplikasi Django baharu. Aplikasi Django baharu boleh dibuat dengan arahan berikut:

python manage.py startapp myapp

Perintah ini akan mencipta direktori baharu yang dipanggil "myapp" dan mencipta struktur asas aplikasi Django di dalamnya.

Seterusnya, kita perlu mencipta model pangkalan data. Model pangkalan data kami akan mentakrifkan objek Post dan menerangkan medan dan sifat objek Post.

Buat fail bernama "models.py" dalam direktori myapp dan tambahkan kod berikut:

from django.db import models

class Post(models.Model):
    title = models.CharField(max_length=100)
    content = models.TextField()
    pub_date = models.DateTimeField('date published')

Dalam kod di atas, kami mentakrifkan fail bernama "Post" Object, yang mempunyai tiga atribut: tajuk, kandungan dan pub_date.

Atribut tajuk dan kandungan ialah medan jenis CharField dan TextField Mereka akan menyimpan tajuk dan kandungan siaran kami. Atribut pub_date ialah medan jenis DateTimeField yang akan menyimpan masa siaran kami diterbitkan.

Seterusnya, kita perlu membuat paparan dan templat. Paparan ialah tempat aplikasi web mengendalikan permintaan dan templat menentukan cara aplikasi web kami harus dipaparkan dalam penyemak imbas pengguna.

Buat fail bernama "views.py" dalam direktori myapp dan tambahkan kod berikut:

from django.shortcuts import render
from django.http import HttpResponse
from .models import Post

def index(request):
    latest_posts = Post.objects.order_by('-pub_date')[:5]
    context = {'latest_posts': latest_posts}
    return render(request, 'myapp/index.html', context)

def detail(request, post_id):
    post = Post.objects.get(pk=post_id)
    return render(request, 'myapp/detail.html', {'post': post})

Dalam kod di atas, kami mentakrifkan dua paparan: indeks dan perincian . Paparan indeks akan menanyakan pangkalan data untuk 5 siaran terbaharu dan menghantarnya ke templat. Paparan terperinci menanyakan pangkalan data untuk siaran tertentu berdasarkan post_id dan menghantarnya ke templat.

Seterusnya, kita perlu mencipta templat. Buat direktori baharu bernama "templat" di bawah direktori myapp dan tambahkan dua fail templat HTML "myapp/index.html" dan "myapp/detail.html".

Dalam templat "myapp/index.html" kami akan memaparkan 5 artikel terakhir:

{% for post in latest_posts %}
    <div class="post">
        <h2 class="title">{{ post.title }}</h2>
        <p class="date">{{ post.pub_date }}</p>
        <p class="content">{{ post.content }}</p>
    </div>
{% endfor %}

Dalam templat "myapp/detail.html" kami akan memaparkan artikel khusus :

<div class="post">
    <h2 class="title">{{ post.title }}</h2>
    <p class="date">{{ post.pub_date }}</p>
    <p class="content">{{ post.content }}</p>
</div>

Sekarang kami telah mencipta aplikasi web Django yang mudah, kami boleh menjalankannya dan melihat kesannya. Masukkan arahan berikut dalam terminal untuk memulakan pelayan:

python manage.py runserver

Buka penyemak imbas dan masukkan http://localhost:8000/myapp/, anda akan melihat senarai 5 artikel yang paling baru diterbitkan.

4. Tambahkan gaya dan animasi

Sekarang kami telah mencipta aplikasi web yang mudah, mari tambahkan beberapa gaya dan animasi padanya. Kami akan menggunakan rangka kerja Bootstrap dan perpustakaan jQuery untuk mencapai tugas ini.

Pertama, kita perlu menambah fail statik pada aplikasi. Buat direktori baharu yang dipanggil "statik" di bawah direktori myapp dan buat direktori lain yang dipanggil "myapp" di dalamnya. Di bawah direktori "myapp", kami akan menambah dua subdirektori, css dan js. Di bawah kedua-dua subdirektori ini, kami akan menambah fail bernama "style.css" dan "script.js".

Dalam fail "style.css" kami akan menambah beberapa gaya asas:

.post {
    background-color: #fff;
    border: 1px solid #ccc;
    margin-bottom: 20px;
    padding: 10px;
}

.title {
    color: #ff0000;
    font-size: 24px;
    font-weight: bold;
}

.date {
    color: #00ff00;
    font-size: 14px;
    font-style: italic;
}

.content {
    color: #0000ff;
    font-size: 16px;
}

Dalam fail "script.js" kami akan menambah beberapa animasi asas:

$(document).ready(function() {
    $('.post').hover(function() {
        $(this).animate({ backgroundColor: "#FEEBD4" }, 200);
    }, function() {
        $(this).animate({ backgroundColor: "#fff" }, 200);
    });
});

Dalam kod di atas, kami menggunakan perpustakaan jQuery untuk menukar warna latar belakang setiap artikel daripada putih kepada merah jambu apabila pengguna menuding di atasnya:

Sekarang kami telah menambah gaya dan animasi pada aplikasi web Django kami, mari jalankan dan lihat kesannya! Buka pelayar dan masukkan http://localhost:8000/myapp/ Anda akan melihat senarai 5 artikel yang diterbitkan baru-baru ini, semuanya telah diubah suai. Semasa anda menuding pada setiap artikel, warna latar belakangnya akan bertukar kepada merah jambu, menjadikan ia kelihatan lebih cantik.

Kesimpulan

Dalam artikel ini, kami membincangkan cara mencipta aplikasi web yang cantik menggunakan Python dan Django. Kami bermula dengan memasang Django, mencipta projek Django baharu dan mencipta aplikasi web mudah. Kami menggunakan model pangkalan data Django untuk mentakrifkan objek Post, dan menggunakan pandangan dan templat Django untuk membentangkan dan menanyakan data. Akhir sekali, kami juga menambahkan beberapa gaya dan animasi pada aplikasi web untuk menjadikannya kelihatan lebih cantik.

Django ialah rangka kerja aplikasi web Python yang berkuasa yang membantu kami membina aplikasi web yang cantik dan berskala dengan mudah. Jika anda sedang mempertimbangkan untuk membina aplikasi web anda sendiri menggunakan Python dan Django, petua ini akan membantu anda bermula dengan cepat.

Atas ialah kandungan terperinci Pembangunan Django: Bagaimana untuk mencipta aplikasi web yang cantik menggunakan Python dan Django. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!