user19485937
user19485937

Reputation:

for making boostrap cdn work, do I need also the javascript cdn or only css, or all 3?

which one do I need to use? https://www.bootstrapcdn.com/

CSS or JS or BUNDLE or all 3? enter image description here

I want to use buttons styling, grid, card (and maybe dropdown but in the future)

<!-- which one? -->

https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css

https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js

https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js

Upvotes: 1

Views: 166

Answers (2)

full-stack developer
full-stack developer

Reputation: 21

If you are planning to use dropdowns, poppers and tooltips, use all. If you only need styles use bootstrap.min.css only.

Upvotes: 1

Laaouatni Anas
Laaouatni Anas

Reputation: 3798

TLDR: if you want basic styling, use a CSS-only file.

if you need interactivity then use also javascript

  • CSS is mandatory
  • JS is optional

I suggest seeing the official docs https://getbootstrap.com/docs/4.4/getting-started/introduction/

"Many of our components require the use of JavaScript to function. Specifically, they require jQuery, Popper.js, and our own JavaScript plugins. Place the following s near the end of your pages, right before the closing tag, to enable them. jQuery must come first, then Popper.js, and then our JavaScript plugins."

they basically say if you want some extra functionality then go for javascript one (for example you want a tooltip, a dropdown that opens and close)

if you want instead of coloring, or changing size, then use only the CSS link. (buttons are one of this case)


however, if you use this only to learn, I suggest importing all the files there, for not have any import issues.
once you will learn it, then try to use one cdn link at the time.


if you want to use bootstrap in the production site, then maybe try using the npm package instead.

npm i bootstrap

(but first try to learn using CDN, the once you know the basics, then use npm)


also remember to use <link> tag to make HTML import the CSS file, by copy the first link appear you once you open the dropdown

enter image description here

Upvotes: 1

Related Questions