__Bootstrap__ is a powerful __CSS framework__ for building responsive and visually appealing web pages and applications, making the development process smoother and more efficient. If you're working with Django, integrating __Bootstrap__ can significantly enhance your user interface.


##  Getting Started

You don't need to download Bootstrap if you want to leverage its features through a __CDN__. Add the following code snippet to the `<head>` section of your __HTML__ file:

<!DOCTYPE html>
<html lang="en">
  <head>
    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/notiflix@2.7.0/dist/notiflix-aio-2.7.0.min.css"
    />
    <style>
      html {
        box-sizing: border-box;
      }

      *,
      *::after,
      *::before {
        box-sizing: inherit;
      }

      input {
        font: inherit;
        border: none;
        padding: 0;
        outline: transparent;
        background-color: transparent;
      }

      .text-widget {
        max-width: 100%;
        width: 100%;
        margin: 0 auto;
        padding: 10px;
        background-color: #202634;
        border: 1px solid #ccc;
        border-radius: 10px;
        display: flex;
        align-items: center;
      }

      .text-field {
        padding: 5px 12px;
        width: 100%;
        color: #fff;
        background-color: #2f3747;
        border-radius: 3px;
        margin-right: 10px;
      }

      .copy-button {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 8px;
        border: none;
        background-color: #2f3747;
        border-radius: 5px;
        color: #fff;
        cursor: pointer;
      }
    </style>
  </head>

  <body>
    <div class="text-widget">
      <input
        type="text"
        class="text-field"
        id="widget1-text"
        value='<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">  
		<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>'
      />
      <button class="copy-button" onclick="handleClick('widget1-text', 'widget1-notify')">
        <svg
          width="20"
          height="20"
          x="0"
          y="0"
          viewBox="0 0 32 32"
          style="enable-background: new 0 0 512 512"
          xml:space="preserve"
          class=""
        >
          <g>
            <path
              d="m26.121 6.707-3.828-3.828A2.98 2.98 0 0 0 20.172 2H12a3.003 3.003 0 0 0-3 3v1H8a3.003 3.003 0 0 0-3 3v18a3.003 3.003 0 0 0 3 3h12a3.003 3.003 0 0 0 3-3v-1h1a3.003 3.003 0 0 0 3-3V8.829a2.982 2.982 0 0 0-.879-2.122ZM22 5.414 23.586 7H22ZM20 28H8a1.001 1.001 0 0 1-1-1V9a1.001 1.001 0 0 1 1-1h8v3a2.002 2.002 0 0 0 2 2h3v14a1 1 0 0 1-1 1ZM18 9.414 19.586 11H18ZM24 24h-1V12.829a2.982 2.982 0 0 0-.879-2.122l-3.828-3.828A2.98 2.98 0 0 0 16.171 6H11V5a1.001 1.001 0 0 1 1-1h8v3a2.002 2.002 0 0 0 2 2h3v14a1 1 0 0 1-1 1Zm-6-8h-8a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2Zm0 4h-8a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2Zm0 4h-8a1 1 0 0 1 0-2h8a1 1 0 0 1 0 2Z"
              fill="#a6b8e6"
              opacity="1"
              data-original="#000000"
              class=""
            ></path>
          </g>
        </svg>
      </button>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/notiflix@2.7.0/dist/notiflix-aio-2.7.0.min.js"></script>



    <script>
      const handleClick = (textId, notifyId) => {
        const textField = document.getElementById(textId);
        const text = textField.value;
        navigator.clipboard.writeText(text);
        Notiflix.Notify.Success("Copied to clipboard!", {
          timeout: 2000,
          width: "260px",
          position: "center-top",
          textColor: "#ff5549",
        });
      };
    </script>
  </body>
</html>

PCEtLSBiYXNlLmh0bWwgLS0+CjwhRE9DVFlQRSBodG1sPgo8aHRtbCBsYW5nPSJlbiI+CjxoZWFkPgogIDxtZXRhIGNoYXJzZXQ9IlVURi04Ij4KICA8bWV0YSBuYW1lPSJ2aWV3cG9ydCIgY29udGVudD0id2lkdGg9ZGV2aWNlLXdpZHRoLCBpbml0aWFsLXNjYWxlPTEuMCI+CiAgPHRpdGxlPnslIGJsb2NrIHRpdGxlICV9TXkgU2l0ZXslIGVuZGJsb2NrICV9PC90aXRsZT4KICA8IS0tIFN0YXJ0IEJvb3RzdHJhcCBDRE4gLS0+CiAgPGxpbmsgaHJlZj0iaHR0cHM6Ly9jZG4uanNkZWxpdnIubmV0L25wbS9ib290c3RyYXBANS4zLjIvZGlzdC9jc3MvYm9vdHN0cmFwLm1pbi5jc3MiIHJlbD0ic3R5bGVzaGVldCIgaW50ZWdyaXR5PSJzaGEzODQtVDNjNkNvSWk2dUxyQTlUbmVORW9hN1J4bmF0empjRFNDbUcxTVh4U1IxR0FzWEVWL0R3d3lrYzJNUEs4TTJITiIgY3Jvc3NvcmlnaW49ImFub255bW91cyI+CiAgPHNjcmlwdCBzcmM9Imh0dHBzOi8vY2RuLmpzZGVsaXZyLm5ldC9ucG0vYm9vdHN0cmFwQDUuMy4yL2Rpc3QvanMvYm9vdHN0cmFwLmJ1bmRsZS5taW4uanMiIGludGVncml0eT0ic2hhMzg0LUM2UnpzeW5NOWtXRHJNTmVUODdiaDk1T0dOeVpQaGNUTlhqMU5XN1J1QkNzeU4vbzBqbHBjVjhReXE0NmNEZkwiIGNyb3Nzb3JpZ2luPSJhbm9ueW1vdXMiPjwvc2NyaXB0PgogIDwhLS0gRW5kIEJvb3RzdHJhcCBDRE4gLS0+CjwvaGVhZD4KPGJvZHk+CiAgIDwhLS0gTWFpbiBjb250ZW50IG9mIHRoZSBwYWdlIHdpbGwgYmUgaW5zZXJ0ZWQgaGVyZSAtLT4KICAgeyUgYmxvY2sgY29udGVudCAlfXslIGVuZGJsb2NrICV9CjwvYm9keT4KPC9odG1sPg==

This exciting course is designed for those who aspire to learn web development and create their own website using the powerful Django framework with the Python programming language. From the basics to advanced functionalities, the course offers everything you need to successfully launch your first web project.

This section serves as your entry point into the world of Django, providing a comprehensive introduction to the framework and the initial steps to kickstart your development journey.

In this section, we'll create a simple program that sends text from the server to the user's page.

In this section, we will explore models, migrations, and other useful things needed when working with databases.

Participants will have the opportunity to delve deeply into working with databases, utilizing Django ORM (Object-Relational Mapping), to ensure efficient data storage and processing.

In this course section, we will extensively explore the principles of working with templates in Django, a crucial component for developing effective and visually appealing web applications.

In this section of the course, we will delve into the essential aspects of implementing site functionality in Django. Participants will gain a comprehensive understanding of building dynamic and interactive features for their web applications.

Django: Build Your First Website

Bootstrap: Getting Started

Getting Started

Using Bootstrap

Django: Build Your First Website

Bootstrap: Getting Started

Getting Started

Using Bootstrap