in this  important concept of javascript is going to be learn and implement in the project as well.

<canvas align='center' id="qrCode"></canvas>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/qrcode/build/qrcode.min.js"></script>
  
<script>
    const uploadForm = document.getElementById("uploadForm");
    const resultBox = document.getElementById("result");
    const downloadLink = document.getElementById("downloadLink");
    const toast = document.getElementById("toast");
    const toastMessage = document.getElementById("toastMessage");

    uploadForm.onsubmit = async (e) => {
      e.preventDefault();

      const formData = new FormData(uploadForm);
      try {
        const res = await axios.post("/file-transfer/upload", formData);
        const fullUrl = window.location.origin + "/file-transfer" + res.data.url;
        downloadLink.href = fullUrl;
        downloadLink.innerText = fullUrl;
        QRCode.toCanvas(document.getElementById("qrCode"), fullUrl);
        resultBox.classList.remove("hidden");
        uploadForm.classList.add("hidden");

      } catch (err) {
        const errorMessage = err.response?.data?.detail || err.message;
        alert(errorMessage)
      }
    };
  </script> 

<a title='Nepal' href='javascript:void(0);'>Hello Nepal</a>

  <!-- Scroll to Top Button -->
  <button id="scrollToTop" class="fixed bottom-4 right-4 bg-blue-600 text-white p-3 rounded-full shadow-lg hidden">?</button>

  <!-- JavaScript -->
  <script>
    // Theme Toggle
    const toggleBtn = document.getElementById('theme-toggle');
    toggleBtn.addEventListener('click', () => {
      document.documentElement.classList.toggle('dark');
    });

    // Contact Form Submission (demo purpose only)
    document.getElementById('contact-form').addEventListener('submit', function(e) {
      e.preventDefault();
      alert('Thank you for your message, Amrit will get back to you soon!');
      this.reset();
    });

    // Scroll to Top
    const scrollToTopBtn = document.getElementById('scrollToTop');
    window.addEventListener('scroll', () => {
      scrollToTopBtn.classList.toggle('hidden', window.scrollY <= 300);
    });
    scrollToTopBtn.addEventListener('click', () => {
      window.scrollTo({ top: 0, behavior: 'smooth' });
    });
  </script>

 <script rel="prefetch" src="main.js"></script>
 
 document.addEventListener("DOMContentLoaded", function () {
    document.body.style.background = 'linear-gradient(to right, #0f0c29, #302b63, #24243e)';
    document.body.style.color = 'white';
});