- Formations
- conversion_path Parcours & Formations
- science Projets
- data_object Exercices de code
- psychology Exercices IA
- quiz Quiz
- Articles
- rss_feed Blog
- sort_by_alpha Glossaire
- menu_book Guides
- help_center FAQ
- media_link Ressources
- Communauté
- groups La communauté
- forum Questions
- live_tv Mentorats
- science Projets mensuels
- Formations
- conversion_path Parcours & Formations
- science Projets
- data_object Exercices de code
- psychology Exercices IA
- quiz Quiz
- Articles
- rss_feed Blog
- sort_by_alpha Glossaire
- menu_book Guides
- help_center FAQ
- media_link Ressources
- Communauté
- groups La communauté
- forum Questions
- live_tv Mentorats
- science Projets mensuels
Deviens membre Premium magic_button
Débloque cette session en devenant Membre Premium 🚀
Inscris-toi
(c'est gratuit !)
Un compte est nécessaire pour participer aux discussions.
Créer un compte person00:00:00 :Pour le moment, quand on se rend sur notre blog, les fichiers CSS sont correctement servis par notre serveur.Donc si sur mon site, j'ouvre les outils d'inspection de Chrome en faisant un clic droit Inspect,et que je me rends dans l'onglet Sources, on voit qu'on a bien nos fichiers statiques qui sont présents,
00:00:15 :donc les fichiers style.css et reset.css.Et j'ai ici le fichier HTML qui correspond à la page d'accueil de mon blog.Donc comment est-ce que ça fonctionne ? Comment est-ce que Django sait qu'il doit servir ses fichiers ?
00:00:26 :Et comment est-ce qu'il sait qu'il doit les mettre à cet endroit ?Donc dans le dossier statique, comme on l'a vu ici dans l'onglet Sources,on a tout ça qui est disponible à l'intérieur d'un dossier qui s'appelle static.css.
00:00:37 :Alors ça c'est vraiment pour deux raisons.Tout d'abord parce qu'on a cette application, l'application django.contrib.staticfiles,qui est par défaut installée dans les applications ici quand vous créez un projet,donc vous n'avez pas besoin de la rajouter, elle est là par défaut.
00:00:50 :Mais vous allez voir que si j'enlève donc cette application,et que je reviens sur mon site et que j'actualise,là cette fois-ci vous voyez que les fichiers de CSS ne sont plus servis par notre serveur.
00:01:00 :Donc c'est vraiment cette application qui va faire le travail d'aller chercher en fait dans les sources,dans le dossier post ici, donc le dossier qui correspond à mon application post,d'aller chercher donc dans le dossier statique tous les fichiers pour les serviret qu'ils soient disponibles donc quand je me rends sur mon site.
00:01:16 :Donc si je remets cette application et que j'actualise ma page,cette fois-ci on a bien les fichiers qui sont servis.La deuxième chose c'est qu'on a ici la variable debug qui est égale à true.
00:01:25 :Donc quand vous êtes sur votre serveur local, que vous faites du développement,cette variable vous la laissez à true comme ça vous avez accès à toutes les erreurset tout ce que vous pouvez avoir besoin pour un mode de développement.
00:01:36 :Maintenant quand vous mettez votre site en production, vous allez passer cette variable à false.Le problème c'est que quand je fais ça, si j'actualise la page,vous voyez que de nouveau nos fichiers statiques ne sont plus servis.
00:01:46 :Donc comme je vous avais dit précédemment,dans les prochaines parties on ne va pas voir comment réglerce problème des fichiers statiques dans le cas du debug qui est égal à false.
00:01:54 :Donc nous on va le remettre à true puisque quand on met le debug à false ici,on va être donc dans un contexte de production,on va donc être sur un serveur qui ne sera plus notre machineet là il va falloir servir ces fichiers statiques d'une autre façon qu'on ne verra pas pour l'instant.
00:02:08 :Donc je remets cette variable à true iciet si j'actualise mon site vous allez voir qu'on retrouve bien nos fichiers statiques.Alors qu'est-ce qui fait qu'on a accès à nos fichiers statiques à l'URL que je vous ai montré ?
00:02:18 :Donc quand on revient ici, que je fais clic droit inspect,que je vais dans les sources, là j'ai bien mes fichiers qui sont dans l'URL statique.
00:02:25 :Donc je peux ouvrir ce fichier style.css en faisant un clic droit open in new tabet là si vous regardez dans la barre d'adresse,l'URL c'est slash static slash css slash style.css.
00:02:37 :Donc ça, cette URL ici en fait elle est définie dans le fichier de settings.Donc je vais revenir dans le fichier de settingset c'est le dernier paramètre qui est défini ici static URLet on a cette chaîne de caractère slash static slash.
00:02:49 :Donc cette URL on peut la modifier si à la place je remets notre cher Patricket que j'actualise la page cette fois-ci,vous voyez qu'on est avec un page not found puisqu'il n'y a plus rien à cette adresse.
00:02:58 :Donc à slash static slash on n'a plus rien.Par contre si je change le static par Patrick que j'actualise,là on retrouve bien notre fichier css.
00:03:07 :Donc cette variable static URL c'est vraiment juste pour spécifierà quelle URL on souhaite accéder à nos fichiers statiques.Et ensuite on va concatener cette URL avec les dossiers dans lesquels se trouvent nos fichiers.
00:03:18 :Donc par exemple dans static ici on a ce fichier styleet ce fichier reset qui sont à l'intérieur d'un dossier css.Donc c'est ce chemin à partir du dossier static qui va être concatené avec cette URL.
00:03:29 :Donc on a bien Patrick slash et ensuite css slash style point css.Ok ? Donc ça c'est vraiment pour l'URL.Je vais remettre static ici dans mon URL et dans mon fichierpuisque c'est un peu mieux et un peu plus explicite que Patrick,même si on aime beaucoup Patrick.
00:03:44 :Et par la suite on va pouvoir rajouter une autre variablequi cette fois-ci va nous permettre de récupérer tous ces fichiers à l'intérieur d'un même dossier.
00:03:52 :Donc ça ce n'est pas utile dans un contexte de développement localmais je vais quand même vous le montrer puisque ces commandes vous allez les voir assez souventet ça va être pratique quand on va mettre notre site en productionpour récupérer en fait toutes les ressources statiques dans un même dossier.
00:04:05 :Donc comme ça ça va permettre à notre serveur d'accéder à un seul dossierqui va contenir tous les fichiers statiquesplutôt que d'aller chercher dans 15, 20 ou 30 dossiers différentspour les différents fichiers statiques qu'on pourrait avoirqui seraient disséminés dans différentes applications.
00:04:19 :Donc là ce qu'on va faire c'est une autre variable qui cette fois-ci s'appelle static route.Donc ça, ça rend la chose assez confuse pour les débutantsparce qu'on a presque le même nom ici, static URL et static route.
00:04:29 :Donc static URL c'est vraiment uniquement pour changer l'URL qu'on va taper dans la barre d'adressepour accéder à nos fichiers statiqueset static route en fait ça va être un dossier.
00:04:38 :Donc on va indiquer ici un chemin de dossierdans lequel on va vouloir récupérer tous les fichiers statiques que l'on a à l'intérieur de notre projet.
00:04:46 :Donc ce dossier je vais le créer à partir de base.dirqui est notre dossier de base, donc le dossier source ici.Donc base.dir elle est définie ici tout au début de mon fichier de settings
00:04:55 :et je vais concatener donc base.dir ici avec un dossier.Donc généralement on l'appelle static files,vous pouvez l'appeler comme vous voulez, on pourrait là encore utiliser patricks,c'est vraiment juste un nom de dossier.
00:05:05 :Donc je vais l'appeler static fileset ce dossier donc on va pouvoir collecter tous les fichiers statiques à l'intérieur.Donc pour ça je vais ouvrir un terminal ici,j'ouvre un nouvel onglet et on va utiliser une commandequi est la commande python manage.py.
00:05:19 :Donc là assurez-vous d'être bien à l'intérieur du dossier qui contient le fichier manage.py,donc dans mon cas le dossier src.Et avec donc manage.py on va utiliser la commande collect static.
00:05:31 :Et collect static, donc tout en minuscule ici, tout attaché,ça va nous permettre de récupérer tous les fichiers statiques dans le même dossier.Donc je valide en appuyant sur entréeet là vous voyez qu'il m'indique que 134 fichiers statiques ont été copiésdans django.blog.src.staticfiles.
00:05:48 :Donc si je reviens dans ma structure ici,on voit qu'on a un nouveau dossier static files qui va contenir plusieurs dossiers.Alors on a bien notre dossier css qui contient les deux feuilles de styleque j'avais à l'intérieur de mon application, donc de l'application post.
00:06:01 :Donc vous voyez que Django va savoir en fait automatiquementoù il doit aller chercher toutes ces ressources.Vous remarquez par contre qu'on a un autre dossier adminet donc là vous pouvez vous demander à quoi ça correspond.
00:06:11 :Et bien en fait ça correspond à notre application adminqui est installée par défaut dans installed apps ici,cette application django.contrib.admin.Donc qu'est-ce que c'est en fait tous ces fichiers ?
00:06:20 :C'est tous les fichiers de css, de javascript, les images etc.qui sont utiles pour notre interface d'administration.Donc quand on se rend dans l'url ici à slash admin,on a plein d'images qui sont utilisées, plein de feuilles de style.
00:06:32 :Et bien c'est grâce à cette application django.contrib.adminet ces dossiers vous pouvez les retrouversi vous allez dans les external libraries ici.On va aller voir dans le site packages,donc là où est installée notre version de Django pour ce projet.
00:06:45 :Et si on va dans contrib, on retrouve le dossier adminqui est le dossier de cette application.Et dans le dossier admin, on a ce dossier statique,donc qui est le dossier qui va contenirtous les fichiers statiques de cette application.
00:06:55 :Et on retrouve le dossier admin.Donc vous voyez c'est vraiment en fait Djangoqui automatiquement va regarder toutes les applicationsqu'on a ici, donc admin, auth, content types etc.
00:07:04 :et notre application post.Il va regarder à l'intérieur de ces applicationss'il trouve un dossier statique.Et s'il trouve un dossier statique,et bien il va tout simplement copiertout ce qui est à l'intérieuret le mettre dans le dossier qu'on a définidans notre variable ici static route.
00:07:17 :Donc il va copier tout çaet il va le mettre dans le dossier static files.Donc comme je vous le disais,dans le cas d'un développement local,ça n'est pas une étape nécessairepuisque automatiquement Django,quand on est en debug égal à true,il va aller faire ce travail
00:07:30 :en allant directement dans les dossiers statiquesde mes applications.Mais quand vous êtes en production sur un serveur,il est préférable d'avoir tout au même endroit,donc tous ces fichiers statiques.
00:07:38 :Et donc dans ce cas-ci,on va spécifier cette variable static route.On va collecter nos fichiersà chaque fois qu'on en crée des nouveaux.Donc dès qu'on a des nouveaux fichiers statiques,on utilise python manage.py collect static
00:07:48 :pour récupérer tous ces fichiers statiquesau même endroit, donc ici dans ce dossier,et pour ensuite les servir à notre application.Donc voilà pour ces deux variables.
00:07:56 :Ça fait une partie assez longue,mais il est bien important de comprendrela différence entre static URL,qui est donc vraiment juste l'URLqui nous permet d'accéder à ces ressources,et static route, qui est vraiment une variablequi nous permet de définir un dossierdans lequel on va récupérer tous les fichiers statiques
Ce n'est pas fini...
✋
Tu as complété % du parcours 🔥
Termine l'intégralité de la formation pour pouvoir débloquer ton attestation de réussite.