Router

Router like SPA

tsc script.ts

function loadPage(page: "home" | "about" | "contact"): void {
  const content = document.getElementById("content");

  if (content) {
    if (page === "home") {
      content.innerHTML = `
                <h1>Welcome to the Home Page</h1>
                <p>This is the home page of our simple app.</p>
            `;
    } else if (page === "about") {
      content.innerHTML = `
                <h1>About Us</h1>
                <p>This is the about page. Learn more about our app and its purpose here.</p>
            `;
    } else if (page === "contact") {
      content.innerHTML = `
                <h1>Contact Us</h1>
                <p>This is the contact page. Get in touch with us!</p>
            `;
    }
  } else {
    console.error("Content element not found");
  }
}

// Load home page by default on initial load
window.onload = function (): void {
  loadPage("home");
};

HTML RouterCSS RouterJS Router