Zrozumieć React

LinkiRozgrzewka
Powrót do lekcji

Rozpocznijmy od rozgrzewki 😉. Poniżej widzisz prostą stronę-wizytówkę. Strona składa się z trzech podstron:

Strony głównej
Strony o mnie
Strony konaktu

Skonfiguruj router w taki sposób, aby:

Po wpisaniu / w pasku adresu wyświetlał się komponent MainPage
Po wpisaniu /o-mnie w pasku adresu wyświetlał się komponent About
Po wpisaniu /kontakt w pasku adresu wyświetlał się komponent Contact

Upewnij się, że menu będzie widoczne na każdej podstronie (wyświetl komponenty jako dzieci Layout). Wszystkie komponenty są już zbudowane i znajdują się w odpowiednich plikach. Menu jest odpowiednio skonfigurowane, więc możesz go używać, aby przechodzić pomiędzy poszczególnymi podstronami.

Twój kod 💻

import React from "react";
import ReactDOM from "react-dom/client";
import { createBrowserRouter, RouterProvider } from "react-router-dom";
import { Layout } from "./Layout";

const router = createBrowserRouter([
  {
    element: <Layout/>,
    path: "/",
  },
]);

ReactDOM.createRoot(document.getElementById("root")).render(
  <React.StrictMode>
    <RouterProvider router={router} />
  </React.StrictMode>
);

Open Sandbox

Dla własnej wygody skorzystaj z platformy z zadaniamy w trybie desktopowym 🙏
Jeżeli potrzebujesz dostępu do zadań w wersji mobile skontaktuj się z nami na kontakt@jakzaczacprogramowac.pl

LinkiRozgrzewkaPowrót do lekcji

Twój kod 💻

Dla własnej wygody skorzystaj z platformy z zadaniamy w trybie desktopowym 🙏Jeżeli potrzebujesz dostępu do zadań w wersji mobile skontaktuj się z nami na kontakt@jakzaczacprogramowac.pl

LinkiRozgrzewka
Powrót do lekcji

Dla własnej wygody skorzystaj z platformy z zadaniamy w trybie desktopowym 🙏
Jeżeli potrzebujesz dostępu do zadań w wersji mobile skontaktuj się z nami na kontakt@jakzaczacprogramowac.pl