Articles permettant le développement de systèmes avec Django (Python) _Introduction

introduction

La programmation est devenue plus familière qu'avant, y compris Python. Lorsque vous remettez en question le développement de services, il existe divers obstacles.

** "Je ne peux pas obtenir mon diplôme du livre d'introduction ou du copier-coller du didacticiel" ** ** "J'ai essayé de le faire avec copier-coller, mais je ne peux pas l'arranger après cela" ** ** "Je ne sais pas si le code que j'ai écrit est correct" **

En les analysant, il peut être décomposé en ** 5 facteurs ** comme le montre la figure ci-dessous.

image.png

Dans cet article, nous allons nous concentrer sur la ** «phase de pratique» ** et viser à ** «développer un système qui fonctionne réellement» **. *** "Phase de base" ** est également organisé dans un autre article, je vais donc vous présenter le lien.

(3) Bases de la programmation: Feuille de route d'apprentissage pour le développement et la publication de services à partir de zéro avec Python (4) Pensez à la conception du système: Définition des exigences - Articles qui peuvent devenir des ressources humaines capables de concevoir des systèmes

Contenu de cet article

Je l'ai écrit pour que vous puissiez apprendre ** "Une série d'étapes pour le développement de système en utilisant Django (Python)" ** partout. De la compréhension globale du processus de développement à la programmation proprement dite, vous pouvez apprendre de manière exhaustive.

Les chapitres sont les suivants.

Après avoir appris une série d'étapes, essayez vous-même différents modèles Lorsque vous vous y habituerez, veuillez essayer ** le développement de service original **.

Commençons.

Qu'est-ce qu'un «système» en premier lieu?

Tout d'abord, il est très important de comprendre la ** signification du mot «système» **. Il est introduit dans le dictionnaire comme suit.

Conversion de ces termes en termes informatiques,

En d'autres termes, il s'agit d'une image comme "un modèle en plastique qui est complété par l'assemblage de pièces individuelles de manière ordonnée". Pour cela, trois types de compétences sont nécessaires.

** ① Capacité à penser aux pièces nécessaires au développement ** ** ② Compétences pour fabriquer des pièces individuelles ** ** ③ Compétences à construire dans l'ordre **

En dehors de cela, il existe des angles morts ** "(1) Compétences pour réfléchir aux éléments nécessaires au développement" ** J'ai écrit un article dans "Définition des exigences - Articles qui peuvent être des ressources humaines qui peuvent concevoir des systèmes".

Et ** "② Comment créer des pièces individuelles" ** a déjà été appris par ceux qui ont étudié Python. Il suffit d'écrire un programme qui utilise l'instruction For / IF et la fonction / classe.

Après cela, vous pouvez développer le système si vous acquérez ** "③ Compétences pour l'assemblage ordonné" **. Dans cet article, nous allons procéder pour que vous puissiez acquérir les deux compétences nécessaires à cet effet.

** (1) Comprendre la "vue d'ensemble du développement du système" ** ** (2) Comprendre les «rôles des différentes parties» qui composent le système **

Premièrement, pour effacer (1) Comprenons ** la méthode de développement (modèle MTV) utilisée par Django **.

Quel est le "modèle MTV" de Django?

Django utilise une technique appelée le ** modèle MTV **.

Signification de «MTV»

MTV a été créé en prenant l'acronyme de ** les trois éléments majeurs qui composent Django **.

Vous n'avez pas à le comprendre exactement, alors comprenons le rôle général.

Tout d'abord, comme prémisse, le système est composé de trois éléments: ** «écran, traitement, données» **. Exprimé en phrases, cela ressemble à ceci.

Prenons, par exemple, un système qui analyse les données de vente. Comme le montre la figure, ** «écrans / processus / données» sont divisés en rôles ** à partir des opérations de l'utilisateur.

image.png

En appliquant cela au modèle MTV, la division des rôles peut être organisée comme suit.

image.png

En d'autres termes, ** «écran», «traitement» et «données» sont liés de manière ordonnée **. Le système fonctionne comme un ** agrégat **.

--Définition de "système" (republication) --- ** Système: une collection de "programmes" qui organisent un grand nombre de "données" et "une série de processus" **

Avec ce qui précède, vous devriez être en mesure de voir ** "(1) Aperçu du développement du système" **.

Après cela, tout en programmant, tout en fabriquant le produit fini Comprenons ** "(2) Rôles des différentes parties qui composent le système" **.

Structure des fichiers Django

Tout d'abord, afin de connaître le but, organisez la ** structure du fichier (= structure des parties) ** du système créé par Django. Comprenons ** le rôle que joue chaque fichier ** en le liant au modèle MTV.

Ce qui est particulièrement déroutant, c'est "Quelle est la différence entre les fichiers ci-dessous **? **".

La différence peut être organisée comme suit, mais au début, je ne comprends pas le mérite de la division.

--ʻApp_config: ** Gérer l'ensemble du système ** --ʻApp_folder: ** Gérer les fonctions individuelles ** dans le système

La première compétence dont vous avez besoin est ʻapp_folder, qui est ** la compétence pour développer des fonctions spécifiques **, donc Continuons en supposant que ʻapp_config se fait en copiant et en ** créant d'abord un système fonctionnel **.

Regardons maintenant la structure des fichiers.

Liste des fichiers utilisés par Django

Si vous procédez au développement avec Django, vous vous retrouverez avec ce type de structure de fichiers.

À ce stade, ce n'est pas grave si vous ne comprenez pas ce qu'il dit Veuillez vous y référer lorsque vous vous perdez au milieu de la programmation ** "Que faites-vous maintenant?" **.



Encore une fois, ** ces fichiers (= parties) ont des rôles individuels **, En les assemblant correctement, l'ensemble fonctionne comme un ** "système" **.

--Définition de "système" (republication) --- ** Système: une collection de "programmes" qui organisent un grand nombre de "données" et "une série de processus" **

Maintenant, procédons réellement au développement. Parmi les compétences essentielles de développement mentionnées au début, nous avons affaire aux ② et ③.

** ② Compétences pour fabriquer des pièces individuelles ** ** ③ Compétences à construire dans l'ordre **

Django development procedure_initial setting

De là, j'écrirai le programme en Python, donc Je vous recommande de préparer un éditeur.

Construire un environnement de développement

Tout d'abord, préparez l'environnement de développement. Il existe quatre options pour l'environnement de développement, mais cette fois, construisons le meilleur "** environnement virtuel **" pour commencer.

#Créer un environnement virtuel / déplacer des dossiers
$ python -m venv venv
$ cd venv
#[Pour Windows et invite de commandes] Démarrez l'environnement virtuel
$ Scripts/activate.bat

#[Pour Windows et GitBash] Démarrage d'un environnement virtuel
$ source Scripts/activate
* Si une erreur se produit, "source bin"/activate」

#[Pour Mac] Démarrer l'environnement virtuel
$ source Scripts/activate
* Si une erreur se produit, "source bin"/activate」
#Installez la bibliothèque à utiliser
$ pip install Django==2.1.5
$ pip install django-bootstrap4

#Lorsque vous utilisez "MySQL" pour DB, exécutez également ce qui suit
$ pip install mysqlclient
#Créer / déplacer un dossier de développement
$ cd ..
$ mkdir mysite
$ cd mysite

Démarrez le projet

Exécutez start project pour commencer à développer Django. Un ensemble de fichiers de paramètres requis pour le développement est automatiquement créé.

Vous pouvez utiliser n'importe quel nom pour ʻapp_config`, donc veuillez le changer lorsque vous vous y habituerez.

$ django-admin startproject app_config .

Une fois le processus terminé, la structure des dossiers sera la suivante.

fichier de configuration

Maintenant, configurons l'ensemble de Django. Il devrait corriger LANGUAGE_CODE et TIME_ZONE au bas de ʻapp_config / setting.py`.

app_config/settings.py


#Réglage de la langue / du fuseau horaire, etc.
LANGUAGE_CODE = 'ja'
TIME_ZONE = 'Asia/Tokyo'

De plus, Django prend en charge ** SQLite ** par défaut, vous pouvez donc utiliser la base de données avec les paramètres par défaut. Si vous utilisez ** MySQL **, modifiez DATABASES dans ʻapp_config / settings.py` comme suit.

app_config/settings.py


#Modifiez la base de données comme suit
DATABASES = {
    'default': {
        'ENGINE':'django.db.backends.mysql',
        'NAME':'●●(Nom de la base de données)',
        'USER':'●● (nom d'utilisateur de la base de données)',
        'PASSWORD':'●● (passe de connexion à la base de données)',
        'HOST':'localhost',
        'PORT':'',
    }
}

Préparation de la base de données (migration)

Exécutez la commande suivante à ce moment. Lorsque le processus est terminé avec succès, la base de données minimale requise pour le développement Django est prête.

$ python manage.py migrate

image.png

Essayez de démarrer le système

Démarrons le système pour nous assurer que les paramètres jusqu'à ce point sont réussis.

$ python manage.py runserver

Essayez ensuite d'accéder à http: // localhost: 8000 à partir de votre navigateur. Si vous voyez l'écran ci-dessous, vous avez réussi.

image.png

Si vous pouvez le confirmer, arrêtez le système avec Ctrl + c (Commande + c sur Mac).

Création de fichiers liés à l'application

Ensuite, nous développerons des fonctions d'application Web spécifiques. Exécutez la commande suivante.

Vous pouvez utiliser n'importe quel nom pour la partie ʻapp_folder`.

$ python manage.py startapp app_folder

Une fois exécuté, un dossier nommé ʻapp_folder` sera créé. Différents fichiers sont créés directement en dessous. * Ignorez les fichiers non écrits ci-dessous.

Enregistrez l'application dans le fichier de paramètres

Soyez prudent ici, créez simplement le dossier ʻapp_folder / Il n'est pas reconnu par ʻapp_config /, qui gère tout le système.

Par conséquent, vous devez vous enregistrer dans ʻINSTALLED_APPS de ʻapp_config / settings.py. ʻINSTALLED_APPS` est un élément pour enregistrer les applications à utiliser dans le système.

Le nom à enregistrer se fait en combinant trois éléments.

  1. Le nom de l'application que vous avez spécifié précédemment ʻapp_folder`
  2. apps
  3. Nom de classe dans ʻapp_folder / apps.py ʻAppFolderConfig

image.png

Combinez ces trois et ajoutez "ʻapp_folder.apps.AppFolderConfig`". Cela reconnaîtra l'application que vous êtes sur le point de développer dans Django.

app_config/settings.py


INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'app_folder.apps.AppFolderConfig', #Ajoutez cette ligne
]

Préparez un dossier pour HTML / CSS

Ensuite, préparons un dossier lié à HTML / CSS Créez des dossiers et des fichiers dans la même hiérarchie que manage.py comme suit.

Une fois la création terminée, c'est OK si la structure de fichiers suivante est établie.

image.png

Paramètres d'accès aux fichiers statiques

ʻAjoutez des variables liées aux fichiers statiques (comme les fichiers image) au bas de app_config / settings.py`. Une fois ce réglage effectué, ** l'insertion d'images dans des fichiers HTML ** et ** le travail lié aux CSS et JavaScript ** sera plus facile.

app_config/settings.py


#Ajout des paramètres d'appel de fichier statique en bas
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__))) 
PROJECT_NAME = os.path.basename(BASE_DIR)
STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')] 
STATIC_ROOT = '/var/www/{}/static'.format(PROJECT_NAME)

De même, changez la deuxième ligne «DIRS» de «TEMPLATES» près du milieu de «app_config / setting.py». Cela rendra les fichiers HTML stockés dans le dossier ** templates / ** reconnus sur votre système.

app_config/settings.py


#Ajouter une ligne à TEMPLATES (paramètre d'appel de modèle)
TEMPLATES = [ 
    { 
        'BACKEND': 'django.template.backends.django.DjangoTemplates', 
        'DIRS': [os.path.join(BASE_DIR, 'templates')], #Ajouter cette ligne
        'APP_DIRS': True, 
        'OPTIONS': { 'context_processors': [ 
            'django.template.context_processors.debug', 
            'django.template.context_processors.request', 
            'django.contrib.auth.context_processors.auth', 
            'django.contrib.messages.context_processors.messages', 
            ], 
        }, 
    }, 
]

Paramètres d'accès aux fichiers multimédias

Ajoutez également ce code au bas de settings.py. Les cas où ce paramètre est requis sont les suivants.

app_config/settings.py


#Paramètres liés aux fichiers multimédias
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

Après avoir terminé les réglages, créez un dossier media / dans la même hiérarchie que manage.py. Le flux consiste à télécharger des fichiers multimédias ici.

image.png

Créer un modèle de base

Ensuite, créons un fichier HTML à afficher sur l'écran système. En un mot, connaissez-vous tous ** Bootstrap **?

** "J'ai fait de mon mieux pour étudier le CSS, mais je ne peux pas créer un bel écran." **

** Bootstrap ** développé par Twitter est efficace pour résoudre de tels problèmes. ** Vous pouvez créer un site élégant sans aucune connaissance en conception ** C'est excellent.

La configuration pour utiliser BootStrap est très simple. Ajoutez simplement bootstrap4 à ʻINSTALLED_APPS dans ʻapp_config / settings.py et vous êtes prêt à partir.

app_config/settings.py


INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'app_folder.apps.AppNameConfig',
    'bootstrap4', #Ajoutez cette ligne
]

Ensuite, créons un fichier HTML (** modèle de base **). Vous pouvez réduire la quantité de code à écrire en ** codant le modèle en deux types **.

-① ** "Outside" ** partie commune à toutes les pages: templates / base.html -② Affichage sur chaque page ** Contenu "Inside" **: templates / app_folder / top_page.html etc.

La figure est la suivante.

image.png

Tout d'abord, préparez le modèle de base pour ** "①Outside" **. J'ai fait un design qui peut résister à une certaine utilisation, alors veuillez le copier et l'utiliser tel quel.

De plus, dans la partie de ** "↓↓ content body ↓↓" ** en bas, Le mécanisme est tel que le fichier HTML qui est le contenu de ** "② Inside" ** est reflété.

template/base.html


<!DOCTYPE html>

{% load bootstrap4 %}
{% bootstrap_css %}
{% bootstrap_javascript jquery='slim' %}
{% load static %}

<html lang="ja">
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" type='text/css' href="{% static 'css/style.css'%}">
    <link rel="stylesheet" href="https://cccabinet.jpn.org/bootstrap4/css/style.css">
    <title>Exemple de développement Django</title>

    {% block extra_css %}{% endblock %}

</head>

  <body>
    <!--↓ ↓ Barre de navigation supérieure ↓ ↓-->
    <div class="container-fluid">
      <div class="row">
        <div class="col-12">
          <nav class="navbar navbar-expand-lg fixed-top navbar-dark bs-navbar" style='background-color:cadetblue;' id="bs-navbar">
            <a class="navbar-brand mr-md-2" href="/app_folder/top_page">
Exemple d'écran de développement
            </a>
              <!--↓ ↓ Dummy pour ajuster la mise en page ↓ ↓-->
              <ul class="navbar-nav mr-auto">
                <li class="nav-item"><a class="nav-link" href="#">   </a></li>
                <li class="nav-item"><a class="nav-link" href="#">   </a></li>
              </ul>
              <!--↑↑ Dummy jusqu'ici ↑↑-->                            

              <ul class="navbar-nav">
                <li class="nav-item"><a class="nav-link" href="/#" >Échantillon 1</a></li>
                <li class="nav-item"><a class="nav-link" href="/#" >Échantillon 2</a></li>
                <li class="nav-item"><a class="nav-link" href="/#" >Échantillon 3</a></li>
                <li class="nav-item"><a class="nav-link" href="/accounts/login" >S'identifier</a></li>
                <li class="nav-item"><a class="nav-link" href="/accounts/logout" >Se déconnecter</a></li>
              </ul>
            </div>
          </nav>
        </div>
      </div>
    </div>


    <!--"Barre latérale" et "partie du corps du contenu"-->
    <div id="content" class="container-fluid">
      <div class="row flex-xl-nowrap">

        <!--↓ ↓ Barre latérale ↓ ↓-->
        <div id="sidemenu" class="col-2 d-none d-md-block bg-light sidebar align-self-start">
          <div class="sidebar-sticky">
            <ul class="nav flex-column">

              <li class="nav-item">
                <nav class="navbar navbar-light bg-light">
                  <a class="navbar-brand" href="/#">
                    <span data-feather=""></span>Haut de page
                  </a>
                </nav>
              </li>
              <li class="nav-item">
                <nav class="navbar navbar-light bg-light">
                  <a class='navbar-brand' href='/#'>
                    <span data-feather=""></span>Barre latérale 1
                  </a>
                </nav>
              </li>
              <li class="nav-item">
                <nav class="navbar navbar-light bg-light">
                  <a class='navbar-brand' href='/#'>
                    <span data-feather=""></span>Barre latérale 2
                  </a>
                </nav>
              </li>         
              <li class="nav-item">
                <nav class="navbar navbar-light bg-light">
                  <a class='navbar-brand' href='/#'>
                    <span data-feather=""></span>Barre latérale 3
                  </a>
                </nav>
              </li>         
              <li class="nav-item">
                <nav class="navbar navbar-light bg-light">
                  <a class='navbar-brand' href='/#'>
                    <span data-feather=""></span>Barre latérale 4
                  </a>
                </nav>
              </li>         
              <li class="nav-item">
                <nav class="navbar navbar-light bg-light">
                  <a class='navbar-brand' href='/#'>
                    <span data-feather=""></span>Barre latérale 5
                  </a>
                </nav>
              </li>         
            </ul>
          </div>
        </div id="sidemenu">
        <!--↑↑ Barre latérale jusqu'à ici ↑↑-->

        <!--↓ ↓ Corps du contenu ↓ ↓-->
        <div class="col-10">
          {% block contents %}
          {% endblock %}
        </div>
        <!--↑↑ Contenu du corps jusqu'à ici ↑↑-->
      </div>
    </div>
    </div>
  </body>
</html>

<!--Icône utilisée pour la barre latérale-->
<!--Liste des icônes disponibles: https://voyager-jp.com/blog/javascript/feather/ -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/feather-icons/4.9.0/feather.min.js"></script>
<script>feather.replace()</script>

Création de chaque modèle

Après avoir créé le modèle de base, créez un fichier HTML qui sera ** contenu "à l'intérieur" **. Nous ajouterons du contenu plus tard, alors copiez d'abord ce qui suit et créez un fichier.

templates/app_folder/top_page.html


{% extends 'base.html' %}
{% block contents %}

<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center mt-5 border-bottom">
    <h1 class="h2">haut de page</h1>
</div>

<div>
    <h4>Décrivez le contenu ici</h4>
</div>

{% endblock %}

Il n'y a qu'un seul point, et il y a trois {% ~%} décrits au début et à la fin. C'est un mécanisme que vous pouvez insérer ** "" à l'intérieur de la "partie de contenu" ** dans le modèle de base.

Ceci termine la préparation du modèle.

Puisque rien ne peut être affiché à l'écran simplement en créant un modèle (fichier HTML) Ensuite, créons une vue qui contrôle le système interne.

Créer une vue qui contrôle l'intérieur du système

Comme je l'ai mentionné au début, il existe deux types de vue.

--ʻApp_config / views.py: ** Contrôlez l'ensemble ** en gros ** --ʻApp_folder / views.py: ** Contrôle des fonctions individuelles **

Commencez par créer ʻapp_config / views.pyà partir du plus simple. Créezviews.py dans le dossier ʻapp_config et décrivez le contenu comme suit.

app_config/views.py


from django.shortcuts import render, redirect, reverse  
from django.views import View  
  
class index(View):
    def get(self, request, *args, **kwargs):
        return redirect(reverse('app_folder:top_page'))
index = index.as_view()

Il s'agit d'un paramètre tel que ** "S'il y a accès au système, passez à la page d'accueil" **. Ce n'est pas grave si vous écrivez la même chose à chaque fois.

Ensuite, ouvrez ʻapp_folder / views.py pour contrôler les fonctions spécifiques du système et copiez ce qui suit Il s'agit d'écrire une fonction qui "affiche top_page.html` lors de l'accès à la première page".

app_folder/views.py


from django.shortcuts import render  
from django.views import View  
  
class SampleView(View):  
	def get(self, request, *args, **kwargs):  
		return render(request, 'app_folder/top_page.html')
top_page = SampleView.as_view()

Maintenant que nous avons créé la vue minimale, passons à autre chose.

Créer un répartiteur d'URL

Ici, définissez l'URL requise pour accéder au système à partir de l'écran Web. Par exemple, http: // localhost: 8000 / my_app / top_page, vous pouvez choisir librement ce qui suit https: //.

Deux types de fichiers doivent être modifiés.

--ʻApp_config / urls.py: conception d'URL à l'échelle du système --ʻApp_folder / urls.py: conception d'URL dans des applications individuelles

La relation entre les deux affecte l'ordre dans lequel les URL sont composées. ** http: // localhost: 8000 / <paramètre d'URL de app_config / urls.py> / <paramètre d'URL de dossier_app / urls.py> ** Les URL sont configurées dans cet ordre.

Le premier est ʻapp_config / urls.py`.

app_config/urls.py


from django.contrib import admin
from django.urls import path, include
from django.conf import settings
from django.conf.urls.static import static
from . import views

#Conception globale de l'URL
urlpatterns = [
    #L'application "app" sera créée cette fois_URL pour accéder au "dossier"
    path('app_folder/', include('app_folder.urls')),
    #Si vous ne spécifiez aucune URL (app_config/views.Avec py, "app" automatiquement_(Déjà configuré pour accéder au "dossier")
    path('', views.index, name='index'),
    #URL pour accéder au site de gestion
    path('admin/', admin.site.urls),
]

#Paramètre d'URL pour la publication de fichiers multimédias
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

Ensuite, créez ʻurls.pydans le dossier ʻapp_folder /et écrivez comme suit.

Puisque nous n'avons encore préparé que la première page (top_page /), ʻurlpatterns` est une ligne, Le nombre d'URL à enregistrer augmentera à mesure que diverses fonctions seront ajoutées.

app_folder/urls.py


from django.urls import path
from . import views

app_name = 'app_folder'
urlpatterns = [
    path('top_page/', views.top_page, name='top_page')
]

Pour comprendre, ** http: // localhost: 8000 / <paramètre d'URL de app_config / urls.py> / <paramètre d'URL de dossier_app / urls.py> **

Selon les règles de configuration d'URL ici, l'URL pour accéder à la page d'accueil est http://localhost:8000/app_folder/top_page Etc. C'est ainsi que fonctionne le répartiteur d'URL.

Essayez de démarrer le système

Maintenant que vous avez un ensemble complet de paramètres, démarrons le système.

$ python manage.py runserver

S'il n'y a pas de problème, le terminal s'affiche comme suit.

image.png

Ensuite, démarrons le navigateur et accédons à http: // localhost: 8000 / app_folder / top_page.

Si l'écran suivant s'affiche, il est réussi, et dans la partie où les exemples de caractères sont temporairement saisis Vous pouvez créer divers services en ** ajoutant du contenu par vous-même **.

image.png

Maintenant que la configuration initiale est terminée, ajoutons juste une fonctionnalité simple.

Procédure de développement Django_Développer des fonctionnalités supplémentaires

Recevoir la condition de recherche ** du ** formulaire de saisie affiché sur l'écran Web, ** Rappelez les données stockées dans la base de données ** Développons des fonctionnalités supplémentaires.

Le flux de traitement est le suivant.

--Affichez le formulaire de saisie à l'écran --Recevoir les critères de recherche saisis par l'utilisateur

Construction de la base de données

Tout d'abord, définissons une base de données pour stocker les données.

Afin de comprendre models.py, ** la connaissance de la base de données est également requise **, donc Après avoir étudié cet article, je vous recommande d'étudier en détail avec quelques Django Primer.

app_folder/models.py


from django.db import models

class SampleDB(models.Model):
    class Meta:
        db_table = 'sample_table' #Nom de table utilisé dans DB
        verbose_name_plural = 'sample_table' #Nom de la table à afficher sur le site Admion
    sample1 = models.IntegerField('sample1', null=True, blank=True) #Numéros de magasin
    sample2 = models.CharField('sample2', max_length=255, null=True, blank=True) #Enregistrer la chaîne

Exécutez ensuite la commande suivante pour refléter les paramètres dans la base de données.

$ python manage.py makemigrations
$ python manage.py migrate

Si cela ressemble à ceci dans le terminal, c'est réussi.

image.png

Enregistrement de l'utilisateur administrateur

Après avoir configuré la base de données, enregistrons l'utilisateur qui gère le système. Tout d'abord, entrez la commande suivante.

$ python manage.py createsuperuser

Ensuite, les questions seront posées dans l'ordre suivant, alors entrez-les dans l'ordre. Pour des raisons de sécurité, le mot de passe ne sera pas affiché lorsque vous le saisissez, mais ça va. (Je suis surpris au début, mais ne t'inquiète pas)

Après la saisie, si «Superutilisateur créé avec succès.» S'affiche, l'enregistrement de l'utilisateur administrateur est réussi.

Construction du site de gestion

Après vous être enregistré en tant qu'administrateur, créons un ** site de gestion **.

Qu'est-ce qu'un site de gestion?

C'est un site Web pratique, alors essayons d'abord comment faire fonctionner la base de données plutôt que de la comprendre avec des mots. Définissez les paramètres pour créer un site de gestion à la fois.

app_folder/admin.py


from django.contrib import admin
from .models import SampleDB # models.Nom de classe spécifié par py

admin.site.register(SampleDB) # models.Nom de classe spécifié par py

Ceci termine les paramètres du site de gestion. Accédons à localhost: 8000 / admin après avoir exécuté la commande suivante.

$ python manage.py runserver

image.png

Après vous être connecté avec le nom d'utilisateur et le mot de passe que vous avez créés précédemment Si vous voyez un écran comme celui-ci, vous avez réussi.

image.png

Essayons de vous inscrire dans la base de données. L'inscription se fait en 3 étapes.

-①: Cliquez sur Samplle_table

image.png

-②: Cliquez sur ʻAjouter SAMPLE_DB``

image.png

--③: Remplissez les éléments et cliquez sur "Enregistrer"

image.png

Ceci termine l'enregistrement dans la base de données.

image.png

Afficher / modifier les modèles

Maintenant que vous avez enregistré les informations dans la base de données, récupérons les données. Après cela, continuez avec le flux d'affichage des données sur l'écran Web.

--Recevoir les conditions de recherche du formulaire de saisie à l'écran

** [Recevoir les conditions de recherche à partir du formulaire de saisie à l'écran] ** Tout d'abord, créez page01.html pour créer un formulaire de saisie.

templates/app_folder/page01.html


{% extends 'base.html' %}
{% block contents %}

<h4 class="mt-5 mb-4 border-bottom">Entrez les conditions de recherche</h4>
<form  action="{% url 'app_folder:top_page' %}" method="post">
<div class="container-fluid">
  <div class="row">
    <div class="col-2">
      <input class="form-control" type="text" name="input_data" maxlength="255">
    </div>
    <div class="col-2">
      <div class="text-left align-bottom">
          <button type="submit" name="button" class="btn btn-info">
Chercher
          </button>
      </div>
    </div>
  </div>
</div>
{% csrf_token %}
</form>

{% endblock %}

** [Obtenir les données de la base de données en fonction des conditions de recherche] ** Puis éditez views.py pour recevoir les données du formulaire d'entrée

app_folder/views.py


from django.shortcuts import render  
from django.views import View  
from .models import SampleDB

class SampleView(View):  
	def get(self, request, *args, **kwargs):  
		return render(request, 'app_folder/page01.html')

	def post(self, request, *args, **kwargs):  
		input_data = request.POST['input_data']
		result = SampleDB.objects.filter(sample1=input_data)
		result_sample1 = result[0].sample1
		result_sample2 = result[0].sample2
		context={'result_sample1':result_sample1, 'result_sample2':result_sample2}
		return render(request, 'app_folder/page02.html', context=context,)
		
top_page = SampleView.as_view()

** [Transmettez les données acquises au modèle (écran)] ** Et enfin, créez un nouveau page02.html pour afficher les données obtenues à partir de la base de données.

templates/app_folder/page02.html


{% extends 'base.html' %}
{% block contents %}

<h4 class="mt-5 mb-4 border-bottom">Afficher les résultats de la recherche DB</h4>
<div class="container-fluid">
  <div class="row">
    <div class="col-4">
      <p>sample1:{{result_sample1}}</p>
      <p>sample2:{{result_sample2}}</p>
    </div>
  </div>
</div>

{% endblock %}

Contrôle de fonctionnement

Lorsque vous avez terminé, redémarrez le système Allez sur http: // localhost: 8000 / app_folder / top_page /.

$ python manage.py runserver

Si vous obtenez un écran comme celui-ci, cela fonctionne.

image.png

Après avoir saisi ** "1" ** dans le formulaire de saisie et cliqué sur le bouton de recherche Si le ** "1er échantillon" ** enregistré dans la base de données plus tôt est affiché, il réussit.

image.png

Ceci termine la configuration initiale de Django et une série d'étapes simples d'ajout de fonctions. ** Cet ensemble de fichiers sera la base du développement de Django **, donc enregistrez-le et enregistrez-le.

à la fin

Dans cet article, après avoir organisé les cinq enjeux du développement système, J'ai traité (1) et (2) de chiffres.

(1) L'image globale du développement du système n'est pas visible (2) Les rôles des différentes parties qui composent le système ne sont pas visibles (3) Je n'ai pas les bases pour contester le développement (4) Je n'ai pas les compétences nécessaires pour réfléchir à la conception d'un système à partir d'idées (5) Que faire? (Idée) ne sort pas

Ensuite, après avoir organisé la ** définition du système **, Je pense que j'ai pu réellement comprendre (2) et (3) des trois compétences requises grâce à la programmation.

** Système: une collection de "programmes" qui organisent un grand nombre de "données" et "une série de processus" **

Compétences requises: ① Capacité à réfléchir aux pièces nécessaires au développement ② Compétences pour fabriquer des pièces individuelles ③ Compétences à développer de manière ordonnée

De plus, comme je l'ai écrit avec une politique de ** "Faites quelque chose qui fonctionne en premier" **, il y a certaines parties où l'explication est omise. Si vous ne comprenez pas quelque chose, veuillez utiliser les livres d'introduction et les tutoriels dont vous disposez pour compenser.

Nous espérons que tous ceux qui liront l'article développeront un bon service. Jusqu'à la fin Merci d'avoir lu.

Comme son titre l'indique, cet article a été écrit comme ** "Introduction" **, alors attendez-vous à la suite.

【P.S.】 Diverses informations sont également publiées sur SNS, donc si vous pensez que vous pouvez lire l'article Je vous serais reconnaissant de bien vouloir suivre compte Twitter "Saku731".

Recommended Posts

Articles permettant le développement de systèmes avec Django (Python) _Introduction
[Python] Créer un environnement de développement Django avec Docker
Django 1.11 a démarré avec Python3.6
Résumé du développement avec Django
Faites Django avec CodeStar (Python3.6.8, Django2.2.9)
Introduction à Python Django (2) Win
Faites Django avec CodeStar (Python3.8, Django2.1.15)
Python3 + Django ~ Mac ~ avec Apache
Premiers pas avec Python Django (1)
Premiers pas avec Python Django (4)
Premiers pas avec Python Django (3)
Introduction à Python Django (6)
Premiers pas avec Python Django (5)
[Python] Article qui permet le calcul rapide de matrices éparses
Développement piloté par les tests avec Django Partie 3
Développement piloté par les tests avec Django Partie 4
Système de notation IPynb réalisé avec TA d'introduction à la programmation (Python)
Développement piloté par les tests avec Django Partie 6
Activer Python raw_input avec Sublime Text 3
Introduction à Hadoop et MapReduce avec Python
Développement de jeux Othello avec Python
Créer un système de recommandation avec python
Développement d'applications IOS avec Python (kivy) que même les singes peuvent faire
Configurer un environnement de développement Python avec Atom
Développement piloté par les tests avec Django Partie 1
Introduction à Python Django (2) Édition Mac
Développement piloté par les tests avec Django Partie 5
[Introduction à Python3 Day 21] Chapitre 10 Système (10.1 à 10.5)
Commerce système à partir de Python3: investissement à long terme
[Python] Un programme qui crée des escaliers avec #
[Environnement de développement] Python avec Xcode [Avec transition d'écran]
Introduction au remplissage d'image Python Remplissage d'image à l'aide d'ImageDataGenerator
"Commerce du système à partir de Python3" lecture du mémo
Introduction facile de la reconnaissance vocale avec Python
[Introduction à Python] Utilisons foreach avec Python
CentOS 6.4, Python 2.7.3, Apache, mod_wsgi, Django
Développement d'applications à l'aide de SQLite avec Django (PTVS)
Visualisez le point P qui fonctionne avec Python
Un monde typé qui commence par Python
Modèle de construction d'environnement de développement local Python [Flask / Django / Jupyter avec Docker + VS Code]
[Python] Introduction facile à l'apprentissage automatique avec python (SVM)
Introduction à l'intelligence artificielle avec Python 1 «Théorie des algorithmes génétiques»
Markov Chain Artificial Brainless avec Python + Janome (1) Introduction à Janome
Je ne peux pas créer de projet avec Python3.5 (Windows) + django1.7.1.
Créez des données de test comme ça avec Python (partie 1)
Introduction à l'intelligence artificielle avec Python 2 «Pratique de l'algorithme génétique»
Créez une application qui devine les étudiants avec Python
Créer un environnement de développement Python avec Visual Studio Code
Introduction à Tornado (1): Framework Web Python démarré avec Tornado
La requête [Développement Web avec Python] est également redirigée
Créer une page qui se charge indéfiniment avec python
Django avec Python Tools 2.2 pour Visual Studio (PTVS 2.2)
Introduction au vol en formation avec Tello edu (Python)
Créer un environnement de développement Django à l'aide de Doker Toolbox
Introduction à Python avec Atom (en route)
Vitesse explosive avec Python (bouteille)! Développement d'API Web
Liste de tâches simple créée avec Python + Django
Introduction au modèle linéaire généralisé (GLM) par Python
Débutants en Python accro à Django