0
0
Bootsrapmarkup~10 mins

CDN setup vs npm installation in Bootsrap - Interactive Practice

Choose your learning style9 modes available
LearnWhyDeepRenderTryChallengeProjectRecallPerf
Practice - 5 Tasks
Answer the questions below
1fill in blank
easy

Complete the code to include Bootstrap CSS using CDN in an HTML file.

Bootsrap
<link rel="stylesheet" href="[1]">
Drag options to blanks, or click blank then click option'
Astyles/bootstrap.min.css
Bhttps://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css
Cbootstrap.css
D/node_modules/bootstrap/dist/css/bootstrap.min.css
Attempts:
3 left
💡 Hint
Common Mistakes
Using a local path without installing Bootstrap first.
Using a relative path that does not exist.
2fill in blank
medium

Complete the command to install Bootstrap via npm.

Bootsrap
npm install [1]
Drag options to blanks, or click blank then click option'
Ajquery
Bfontawesome
Cbootstrap
Dpopper.js
Attempts:
3 left
💡 Hint
Common Mistakes
Installing unrelated packages like jQuery or FontAwesome instead.
Misspelling the package name.
3fill in blank
hard

Fix the error in the import statement to load Bootstrap CSS from npm in a JavaScript file.

Bootsrap
import '[1]';
Drag options to blanks, or click blank then click option'
Acss/bootstrap.css
Bbootstrap/dist/js/bootstrap.bundle.min.js
Cbootstrap.min.css
Dbootstrap/dist/css/bootstrap.min.css
Attempts:
3 left
💡 Hint
Common Mistakes
Importing the JavaScript file instead of CSS.
Using incorrect relative paths.
4fill in blank
hard

Fill both blanks to explain the difference between CDN setup and npm installation.

Bootsrap
CDN setup loads Bootstrap [1] from the internet, while npm installation downloads Bootstrap [2] into your project.
Drag options to blanks, or click blank then click option'
Adirectly
Blocally
Cindirectly
Dremotely
Attempts:
3 left
💡 Hint
Common Mistakes
Confusing local and remote loading.
Using 'indirectly' which is unclear.
5fill in blank
hard

Fill all three blanks to complete the advantages of using npm installation over CDN setup.

Bootsrap
npm installation allows [1] control, better [2], and offline [3] of Bootstrap files.
Drag options to blanks, or click blank then click option'
Aversion
Bcustomization
Caccess
Dspeed
Attempts:
3 left
💡 Hint
Common Mistakes
Choosing 'speed' which is more related to CDN benefits.
Mixing up customization with version control.