FrontEnd For Students — April 2022 Update — Bootstrap 5 Migration

Jay (Vijayasimha BR)
2 min readApr 19, 2022

--

the new starter page of the new bootstrap 5 starter template of mine. source

This month, I was brushing up my syllabus for my JavaScript front end corporate training stuff, and I realized something.

My demo repository that contains some bootstrap projects, were still stuck in bootstrap 4. Bootstrap 5 has been out for a while, and I thought, okay, migrating it should be simple enough.

As usual, the code is available on Github.

Migrating to Bootstrap 5 is easy enough. I found a few breaking changes.

  1. The dependency on jQuery has been removed. So, that’s good. One less library to learn and depend on.
  2. The navbar has been overhauled, especially, the menu bar that comes on mobile views. I think, that was one of the main things that were dependent on jQuery. So, I had to replace the old navbar code with new navbar code. All of the sample code is available in the always excellent bootstrap documentation.
  3. Some style components have different spelling now. On many occasions, had to add, ‘bs’ to some styling elements.
  4. One of the demo projects, the Admin dashboard, the sidebar simply stopped working. I tried to fix it, but eventually, only the mobile view was working. The standard, widescreen view would not. The grid math is correct, but, the content kept overlapping with each other. Eventually, I let be as it is.

As usual, I have added some extra documentation, images for better clarity and fixed minor issues.

Final Note

So, that is all there is to it. I no longer use bootstrap, but, it is an important technology to learn.

I work as a full time freelance coding tutor. Hire me at UpWork or Fiverr or Stack Overflow. My personal website is here. Find more of my art at Behance and Unsplash. Also, I have a Podcast about everyday life. And, a 2nd Podcast, where I talk about freelancing.

--

--

No responses yet