Hackforge Academy

Explanation

A Bootstrap navbar provides a responsive navigation menu for web applications.

Code:

<nav class="navbar navbar-expand-lg bg-body-tertiary">
  <div class="container">
    <a class="navbar-brand" href="#">MyApp</a>
  </div>
</nav>

Explanation

Bootstrap cards are useful for displaying products, users, courses, and other grouped content.

Code:

<div class="card" style="width: 18rem;">
  <div class="card-body">
    <h5 class="card-title">Java Course</h5>
    <p class="card-text">Learn Java.</p>
  </div>
</div>

Explanation

Bootstrap alerts provide contextual messages such as success, warning, and error notifications.

Code:

<div class="alert alert-success">
  Registration successful!
</div>

<div class="alert alert-danger">
  Login failed.
</div>

Explanation

A Bootstrap modal displays content in a dialog overlay without navigating away from the current page.

Code:

<button class="btn btn-primary"
        data-bs-toggle="modal"
        data-bs-target="#loginModal">
  Login
</button>

Explanation

Modals can contain forms, confirmation messages, or detailed information.

Code:

<div class="modal fade" id="loginModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-body">
        Login Form
      </div>
    </div>
  </div>
</div>