bootstrap Utiliser Bootstrap : CDN ou installation serveur ?

[Cascadeur]

bonsoir

j'ai envie d'essayer bootstrap depuis quelques temps, et vue qu'il y a un forum dédié maintenant sur le forum je me dis que c'est l'occasion et donc je vais me lancer. J'ai déjà une première question qui concerne son installation sur mon serveur ou bien l'utilisation des CDN Bootstrap.

Qu'en pensez-vous, j'ai lu un peu tout sur le sujet, ce qu'il en ressors c'est que l'utilisation des CDN est fort pratique en plus d'être simple.
Mais je me demande dans quelle mesure un site qui ferait appel à ses CDN serait viable en cas de nouvelles versions du Framework ou si les serveurs distants venaient à lâcher temporairement.

Et pour une utilisation sur son propre serveur, quid de la bande passante ? Est-ce que cela l'impacte ?

 

[Jack]

Salut,

Si tu utilises un CDN le lien ne sera pas rompu par un upgrade de Bootstrap, ton site continueras de tourner mais avec une version antérieure du Framework. D'ailleurs il existe plusieurs CDN à utiliser pour Bootstrap...

/* voici pour le CSS en version 5 par jsdeliver.net */
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">

/* le Bundle complet JS */
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>

/* Via maxCDB pour la version 3*/
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

Bootstrap nécessite aussi JQuery donc ne pas oublier le CDN également comme dans le code ci-dessus.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

 

[Jack]

Ah oui le lien de la doc pour l'installation (in english of course...)
Introduction · Bootstrap v5.0 (getbootstrap.com)

 

[Nicolas]

J'ai du mal à saisir comment fonctionne les CDN. Ok il faut appeler les bibliothèques dans les en-têtes des fichiers HTML mais pourquoi Bootstrap dispose de tant de liens ? CDN depuis JSdeliver, depuis maxCDN et d'autres encore... Et puis il faut appeler JQuery aussi...

De plus il y a des liens vers CSS, Bundle, JS.
Il nous faudrait un spécialiste qui nous éclaire à ce sujet, Anthony tu peux nous aider là dessus ?

 

[yule]

Hello,

@Cascadeur : Perso, je garde tout sur mon hébergement. Aucune incursion de l'externe (c'est un choix, et comme je suis assez adepte de la vie privée..) mais ton 2ème paragraphe résume très bien la situation.
@Moebius : Juste pour la concurrence, tu choisis qui tu veux, les fichiers sont les mêmes
@Jack : Pour Jquery, aucune obligation et c'est également une des raisons de la nouvelle version de Bootstrapp de cette semaine (Version 5 Beta 1). Et il y a d'autres librairies que Jquery

Après et comme toujours, ça va dépendre de votre utilisation. N'utilsant pas de CMS pour mon site, ce Framework me simplifie grandement mes besoins. Je suis un autodidacte en programmation, je suis suffisant en prog pour mes besoins et quand je pédale.. go sur les forums poser mes questions ! En étant suffisant , je devrais me tourner vers un cms.. mais non, j'aime bien savoir et comprendre ce que je fais comme tout bon pizzaiolo (La pizza d'un pizzaiolo est bien meilleure qu'une pizza surgelée... )

Bonne bonne
Yule

 

[Cascadeur]

Merci @yule pour les infos, ça me tente bien d'installer ça sur mon mutualisé, ne serait-ce que pour la partie technique bien que ça ne doit pas être bien méchant. Est-ce que c'est pas un souci que la version 5 ne soit qu'en beta actuellement ?

Une autre petite question : si j'installe bootsrap sur mon serveur, comment j'y fais référence dans mon HTML ? comme un lien vers une feuille de style CSS ? Je demande au passage, j'ai pas encore lu de doc mais la question me vient à l'esprit.

A+ tout le monde, je vous tiens au jus !

 

[Wazz9]

mais pourquoi Bootstrap dispose de tant de liens ?

Juste pour la concurrence, tu choisis qui tu veux, les fichiers sont les mêmes

Et ouais même dans l'open source tu as de la concurrence... La seule différence c'est qu'elle n'influe pas sur les prix vu que c'est gratuit.

Cependant je m'interroge tout de même sur l'utilité d'héberger, à grand frais, des CDN qui sont disponibles ailleurs, quel est l'intérêt de JSDeliver ou de maxcdn ? je comprends pas bien.

À moins qu'ils aient quelque chose d'autre à vendre par la même occasion ?

 

[Anthony]

Amuse toi à l'installer sur ton serveur pourquoi pas, c'est un peu de boulot quand même c'est pas juste un upload de fichiers, il te faudra compiler ton CSS via SASS déjà, vois le lien de Jack pour t'informer si tu speak english...

Sinon regarde cette vidéo pas mal foutue à partir de 1'50

 

[Nicolas]

Clairement l'utilisation via CDN est la plus simple, mais effectivement on "dépend" d'un autre serveur que le sien pour le bon affichage de son site.
Je vais quand même tester l'utilisation de ses CDN c'est intéressant, je penche plus vers React du coup.

 

[Jack]

Mais je me demande dans quelle mesure un site qui ferait appel à ses CDN serait viable en cas de nouvelles versions du Framework ou si les serveurs distants venaient à lâcher temporairement

Cela pourrait tout aussi bien arriver sur ton serveur une panne.
Et si une nouvelle version d'un frameworks sort tu dois changer l'adresse qui pointe vers le fichier CSS ou JS que ce qoit via CDN ou sur ton serveur.

L'avantage du CDN c'est la disponibilité à travers le monde, les visiteurs récupèrent les fichiers sur un serveur proche de chez eux.

 

[CandyShop]

Salut, si on veut utiliser bootstrap mais qu'on veut aussi son propre fichier css comment on l'inclue dans les balises ? Merci

 

[Audrey]

Hello CandyShop, ton avatar est excellent

Sinon pour ta question, tu rajoutes simplement une nouvelle balise link dans ton fichier HMTL.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com......">
<link rel="stylesheet" type="text/css" href="style.css">

 

[CandyShop]

Okayyy ! Merci Audrey