Hello
+Social Media
- {/* social media icons */} +
+
+ {images.map(({ path, title }, idx) => (
+ //
+
+ 
+
+ ))}
+
+
+ )}
+
+ );
+};
+export default SliderSplide;
diff --git a/05_react/unterricht/tag52/react-app/src/main.jsx b/05_react/unterricht/tag52/react-app/src/main.jsx
index afc3f15..6187b22 100644
--- a/05_react/unterricht/tag52/react-app/src/main.jsx
+++ b/05_react/unterricht/tag52/react-app/src/main.jsx
@@ -1,13 +1,18 @@
import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
+import { BrowserRouter } from 'react-router-dom';
// eigene separate Gestaltung mit main.scss (beinhaltet boostrap)
import './styles/main.scss';
+import 'bootstrap'; // bootstrap JS wird über esbuild aus node_modules ausgelesen und eingebunden (bundled)
+
import App from './App.jsx';
createRoot(document.getElementById('root')).render(
+
+ );
+};
+export default About;
diff --git a/05_react/unterricht/tag52/react-app/src/pages/Contact.jsx b/05_react/unterricht/tag52/react-app/src/pages/Contact.jsx
new file mode 100644
index 0000000..68ff51a
--- /dev/null
+++ b/05_react/unterricht/tag52/react-app/src/pages/Contact.jsx
@@ -0,0 +1,16 @@
+const Contact = (props) => {
+ // const { } = props;
+
+ return (
+
+
+ About
+Welcome to the Single-Page-Application (SPA) with React. This is the About page.
+
+
+ );
+};
+export default Contact;
diff --git a/05_react/unterricht/tag52/react-app/src/pages/Home.jsx b/05_react/unterricht/tag52/react-app/src/pages/Home.jsx
new file mode 100644
index 0000000..ee88d61
--- /dev/null
+++ b/05_react/unterricht/tag52/react-app/src/pages/Home.jsx
@@ -0,0 +1,13 @@
+const Home = (props) => {
+ // const { } = props;
+
+ return (
+
+
+ Contact
++ Lorem ipsum dolor, sit amet consectetur adipisicing elit. Iste suscipit eos autem iure soluta laboriosam in + perferendis atque explicabo, possimus eius? Ea magnam sed atque exercitationem officiis ipsum, deserunt iste. +
+
+
+ );
+};
+export default Home;
diff --git a/05_react/unterricht/tag52/react-app/src/routes/Router.jsx b/05_react/unterricht/tag52/react-app/src/routes/Router.jsx
new file mode 100644
index 0000000..53cd192
--- /dev/null
+++ b/05_react/unterricht/tag52/react-app/src/routes/Router.jsx
@@ -0,0 +1,17 @@
+import { Route, Routes } from 'react-router-dom';
+import Home from '../pages/Home';
+import About from '../pages/About';
+import Contact from '../pages/Contact';
+
+const Router = (props) => {
+ // const { } = props;
+
+ return (
+
+
+ Hello, Spa!
+Welcome to the Single-Page-Application (SPA) with React. This is the Home page.
+