Add backend and frontend structure with routing, components, and styling

- Implemented Express server with CORS and dotenv support
- Created basic routing with React Router in frontend
- Added Admin and Home components with navigation
- Integrated MainForm component for user input
- Updated package.json and package-lock.json with new dependencies
- Styled components using Tailwind CSS and Lucide icons
- Added error handling in server
- Created initial EJS view for backend

frontend/src/components/MainForm.tsx

@@ -0,0 +1,125 @@
+import React from "react";
+
+const MainForm: React.FC = () => {
+  return (
+    <section className="mx-auto mt-10 w-full max-w-lg rounded-3xl border border-black/10 bg-zinc-200/90 p-6 shadow-lg backdrop-blur-sm">
+      <h2 className="text-2xl font-black text-zinc-900">Los registrieren</h2>
+      <p className="mt-1 text-xs text-zinc-500">
+        * alle Informationen werden benötigt
+      </p>
+
+      <form className="mt-5 space-y-4">
+        <div className="space-y-1">
+          <label
+            htmlFor="losnummer"
+            className="text-sm font-medium text-zinc-800"
+          >
+            Losnummer:
+          </label>
+          <input
+            type="text"
+            id="losnummer"
+            placeholder="XXXX-XXXX-XXXX-XXXX"
+            required
+            className="w-full rounded-xl border border-black/25 bg-white/80 px-4 py-2.5 text-sm text-zinc-800 placeholder-zinc-400 shadow-inner outline-none ring-0 transition focus:border-black/40 focus:ring-2 focus:ring-black/10"
+          />
+        </div>
+
+        <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
+          <div className="space-y-1">
+            <label
+              htmlFor="vorname"
+              className="text-sm font-medium text-zinc-800"
+            >
+              Vorname:
+            </label>
+            <input
+              type="text"
+              id="vorname"
+              placeholder="Max"
+              required
+              className="w-full rounded-xl border border-black/25 bg-white/80 px-4 py-2.5 text-sm text-zinc-800 placeholder-zinc-400 shadow-inner outline-none focus:border-black/40 focus:ring-2 focus:ring-black/10"
+            />
+          </div>
+
+          <div className="space-y-1">
+            <label
+              htmlFor="nachname"
+              className="text-sm font-medium text-zinc-800"
+            >
+              Nachname:
+            </label>
+            <input
+              type="text"
+              id="nachname"
+              placeholder="Mustermann"
+              required
+              className="w-full rounded-xl border border-black/25 bg-white/80 px-4 py-2.5 text-sm text-zinc-800 placeholder-zinc-400 shadow-inner outline-none focus:border-black/40 focus:ring-2 focus:ring-black/10"
+            />
+          </div>
+        </div>
+
+        <div className="space-y-1">
+          <label
+            htmlFor="strasse"
+            className="text-sm font-medium text-zinc-800"
+          >
+            Straße + Haus Nr.:
+          </label>
+          <input
+            type="text"
+            id="strasse"
+            placeholder="Musterstraße 1"
+            required
+            className="w-full rounded-xl border border-black/25 bg-white/80 px-4 py-2.5 text-sm text-zinc-800 placeholder-zinc-400 shadow-inner outline-none focus:border-black/40 focus:ring-2 focus:ring-black/10"
+          />
+        </div>
+
+        <div className="space-y-1">
+          <label htmlFor="plz" className="text-sm font-medium text-zinc-800">
+            Postleitzahl + Ort:
+          </label>
+          <input
+            type="text"
+            id="plz"
+            placeholder="12345 Musterstadt"
+            required
+            className="w-full rounded-xl border border-black/25 bg-white/80 px-4 py-2.5 text-sm text-zinc-800 placeholder-zinc-400 shadow-inner outline-none focus:border-black/40 focus:ring-2 focus:ring-black/10"
+          />
+        </div>
+
+        <div className="space-y-1">
+          <label htmlFor="email" className="text-sm font-medium text-zinc-800">
+            E-Mail:
+          </label>
+          <input
+            type="email"
+            id="email"
+            placeholder="max@mustermann.de"
+            required
+            className="w-full rounded-xl border border-black/25 bg-white/80 px-4 py-2.5 text-sm text-zinc-800 placeholder-zinc-400 shadow-inner outline-none focus:border-black/40 focus:ring-2 focus:ring-black/10"
+          />
+        </div>
+
+        <button
+          type="submit"
+          className="mt-2 w-full rounded-xl bg-blue-600 px-4 py-3 text-base font-bold text-white shadow transition hover:bg-blue-700 active:bg-blue-800"
+        >
+          Los Registrieren
+        </button>
+        <p className="mt-1 text-xs text-zinc-500">
+          Wenn Sie die Daten eines Loses bearbeiten möchten,{" "}
+          <a
+            className="text-blue-600 underline"
+            href="mailto:example@example.com"
+          >
+            kontaktieren Sie uns
+          </a>
+          .
+        </p>
+      </form>
+    </section>
+  );
+};
+
+export default MainForm;