This content originally appeared on DEV Community and was authored by Alexandre Calaça
Open the terminal
Solution
Add bootstrap
yarn add bootstrap
Output
The command yarn add bootstrap is used to add the Bootstrap framework to your project using Yarn, which is a package manager for JavaScript and front-end dependencies.
Bootstrap is a popular open-source front-end framework that provides a collection of pre-designed HTML, CSS, and JavaScript components and styles for building responsive and visually appealing web applications.
Check bootstrap’s installation
yarn info bootstrap version
Output
Add @poppejs/core
yarn add @popperjs/core
OUtput
The command yrn add @popperjs/core is used to add the Popper.js library to your project using Yarn.
Popper.js is a JavaScript library that provides positioning and alignment for pop-up elements, tooltips, and popovers.
It’s commonly used in conjunction with other libraries and frameworks like Bootstrap to manage the positioning of elements that need to appear relative to other elements on a web page.
Check @popperjs/core installation
yarn info @popperjs/core version
OUtput
Add the Webpacker gem package
yarn add @rails/webpacker
Output
Check @rails/webpacker installation
yarn info @rails/webpacker version
OUtput
Check all npms packages
npm list
OUtput
Open any view page
If you pay attention closely, the font is different. It’s due to bootstrap.
Done
Let’s network
Final thoughts
Thank you for reading this article.
If you have any questions, thoughts, suggestions, or corrections, please share them with us.
We appreciate your feedback and look forward to hearing from you.
Feel free to suggest topics for future blog articles. Until next time!
This content originally appeared on DEV Community and was authored by Alexandre Calaça