Environnement CSS créé en 10 minutes avec Django

prologue

Créez un environnement d'étude CSS avec Django.

Si Django est déjà installé, 10 minutes sont attendues.

Je pense que cela n'affectera pas le contenu, mais c'est l'environnement d'exécution OS : Windows10 python : Python 3.7.6 django : 3.1

procédure

Création de dossier, création de projet, création d'application

C:\work\02_la mise en oeuvre>mkdir 20200919_htmlcss
C:\work\02_la mise en oeuvre>cd 20200919_htmlcss
C:\work\02_la mise en oeuvre\20200919_htmlcss>django-admin startproject htmlcss
C:\work\02_la mise en oeuvre\20200919_htmlcss>cd htmlcss
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss>python manage.py startapp test_app
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss>dir
Le lecteur C n'a pas d'étiquette de volume.
Le numéro de série du volume est D48D-C505

 C:\work\02_la mise en oeuvre\20200919_htmlcss\répertoire htmlcss

2020/09/19  19:38    <DIR>          .
2020/09/19  19:38    <DIR>          ..
2020/09/19  19:38    <DIR>          htmlcss
2020/09/19  19:38               685 manage.py
2020/09/19  19:38    <DIR>          test_app
1 fichier 685 octets
4 répertoires 8,932,749,312 octets d'espace libre

Reconnaissance des applications (ajoutez le nom de l'application défini dans les applications à setting.py)

C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss>cd htmlcss
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>notepad settings.py
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>type ..\test_app\apps.py
from django.apps import AppConfig

class TestAppConfig(AppConfig):
    name = 'test_app'

htmlcss/setting.py


# Application definition

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'test_app.apps.TestAppConfig',
]

Accéder aux paramètres de destination (définis dans le projet urls.py et app urls.py)

C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>notepad urls.py

htmlcss/urls.py


from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('test_app.urls')),
]
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>copy urls.py ..\test_app\
J'ai copié un fichier.
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>notepad ..\test_app\urls.py

test_app/urls.py


from django.urls import path, include
from . import views

urlpatterns = [
    path('', views.index),
]

Spécifiez et créez le code HTML de la destination d'accès

C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>notepad ..\test_app\views.py

test_app/views.py


from django.shortcuts import render

# Create your views here.

def index(request):
    return render(request, 'index.html')
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>mkdir ..\test_app\templates
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>notepad ..\test_app\templates\index.html

index.html


<html>
  <head>
  </head> 
  <body>
    <p>hello, world</p>
  </body>
</html>

Enfin CSS (reconnaissance et création css, appel depuis html)

C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>notepad settings.py

htmlcss/setting.py


# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/3.1/howto/static-files/

import os

STATIC_URL = '/static/'

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
)
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>mkdir ..\test_app\static\css
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>notepad ..\test_app\static\css\style.css

style.css


.T1 {
  background-color: #99cc00
}
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>notepad ..\test_app\templates\index.html

index.html


{%load static%}
<html>
  <head>
    <link href="{% static 'css/style.css'%}" rel="stylesheet">
  </head> 
  <body>
    <div class='T1'>
      <p>hello, world</p>
    </div>
  </body>
</html>

Démarrez le serveur Web et vérifiez avec le navigateur

C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>start
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>python ..\manage.py runserver
C:\work\02_la mise en oeuvre\20200919_htmlcss\htmlcss\htmlcss>start http://localhost:8000

Achevée! !! !! 1.png

épilogue

Maintenant, vous pouvez essayer CSS comme vous le souhaitez

Recommended Posts

Environnement CSS créé en 10 minutes avec Django
Déployez Django en 3 minutes à l'aide de docker-compose
Créez un environnement Django avec Vagrant en 5 minutes
(Note) Django dans l'environnement Vagrant
Comment refléter CSS dans Django
Créez et essayez un environnement OpenCV et Python en quelques minutes à l'aide de Docker
Installer Django dans l'environnement virtuel pipenv
Utilisation de venv dans un environnement Windows + Docker [Python]
Mémo d'enregistrement d'informations en utilisant la session dans Django
J'ai créé un environnement Anaconda à l'aide de Docker!
Création de scicit-learn dans un environnement Windows 10 à l'aide de Pycharm
Ajax dans Django (en utilisant la vue de classe générique)
Tutoriel de clé externe de Django en 10 minutes
Construction de l'environnement Django
Modèle dans Django
Démarrez Django dans un environnement virtuel à l'aide de Pipenv
construction d'environnement django
[Construction de l'environnement] Analyse des dépendances à l'aide de CaboCha avec Python 2.7
[Django] css dans le projet ne peut pas être lu
Formulaire à Django
[Docker] Créez un environnement jupyterLab (python) en 3 minutes!
TensorBoard facile de 3 minutes dans Google Colab (en utilisant TensorFlow 2.x)
Créer un environnement de développement Django à l'aide de pyenv-virtualenv sur Mac
Construire un environnement virtuel Python en utilisant venv (Django + MySQL ①)
OpenVINO utilisant l'API Python d'Inference Engine dans un environnement PC
Une collection de lignes de commande qui utilisent des environnements virtuels avec Anaconda
Déboguer à distance l'environnement Django créé avec docker-compose avec VS Code
Configurer un environnement de développement Django en utilisant homebrew sur MacOSX Mavericks (10.9)
Python --Comparez Django css / js
Apprenez les pandas en 10 minutes
Construction de l'environnement du projet Django
Modifications du modèle dans Django
virtualenvwrapper dans l'environnement Windows
environnement virtuel en Python
Comprendre en 10 minutes le sélénium
Essayez d'utiliser Django templates.html
Le sélénium fonctionne en 15 minutes
Environnement de développement en Python
Python Django CSS reflété
[Memo] Environnement de développement Django
[AWS] J'ai essayé d'utiliser EC2, RDS, Django. Construction de l'environnement à partir de 1
Maintenance de l'environnement de développement Django + MongoDB (en cours d'écriture)
Refléter l'environnement virtuel créé par Miniconda dans le notebook Jupyter
Prise en main et utilisation d'exemples de vues génériques basées sur des classes dans Django
Comment générer une requête à l'aide de l'opérateur IN dans Django
Programme d'acquisition du marché Drakue 10 Bazaar créé en 20 minutes
La découverte de test échoue lors de l'utilisation de tensorflow dans l'environnement vscode + pytest
Créez un modèle de suivi facile à utiliser avec Django en utilisant ManyToManyField via