Learning how to add a modal in Bootstrap 4 to Bootcamp Index

I'm a big believer in doing the hardest thing first in the day so it's over and done with! Today's task was to add a modal to my Bootstrap cards for Bootcamp Index.  This wasn't hard once I knew how but at the start of today I just didn't know!

A modal is just a pop-up when you press a button on a website. It's a way of letting the user get some more information briefly when they are going to want to return to the rest of the site. It's also a way to keep the user's focus by keeping them in the 'main flow' of your site. Here's an example from Harry Dry's Marketing Examples site:

Any way, I wanted to do the same on Bootcamp Index. I had a look on the Bootstrap website and sure enough, there is boiler plate code for making a modal. I know it's trendy to trash Bootstrap but it's so quick for making things quickly! I added the modal to my HTML

This means that when a user click more info they get taken to a modal page showing text with options to either close the modal or to register their interest or go to the bootcamp's apply page. This means the user doesn't have to add a new page to their browser and they can stay on the page. I'll probably change the text to something that you can scan quickly but you get the idea!

I'm pleased with how things are going with Bootcamp Index! I added a form for the newsletter sign-up as well (another Bootstrap component!). So it's starting to come together nicely. I'm enjoying learning each day and just focusing on aiming to complete one new, tricky thing each day. I think that way I can make a really nice site if I keep on improving my skills one day at a time. Far too many people overestimate what they can do in a day and underestimate what they can do in a year.