Added SSR Workshop (#135)

_workshops/2024/Server-Side-Rendering/index.md

@@ -0,0 +1,51 @@
+---
+layout: workshop
+titel: Server Side Rendering
+social-media-untertitel: Workshop am 2. Juli 2024
+datum: 2024-07-02
+modul: wt
+published: true
+autor: Dennis Wäckerle
+bild: ../thumbnail.jpg
+bildcredits: "Bildquelle: https://pixabay.com/de/photos/server-raum-serverraum-dunkel-led-2160321/"
+art: workshop
+termin: Dienstag, 02. Juli 2024, 13:00 Uhr
+dauer: ~120 Minuten
+raum: 3.216
+---
+## Workshopinhalt
+
+In diesem Workshop werden die Basics zu Server Side Rendering (SSR), wie es den Rendering Prozess beeinflusst und die Vor- und Nachteile erklärt. Dabei wird anhand von SvelteKit eine kleine Anwendung mit SSR implementiert.
+
+## Ziele des Workshops
+Die Teilnehmer können ...
+
+- ... können die Basics von Web Rendering erklären
+- ... unterschiede zwischen Pre Rendering, Client Side Rendering und Server Side Rendering nennen
+- ... SSR mit SvelteKit implementieren
+- ... die Vor- und Nachteile von SSR nennen
+
+
+## Zielgruppe
+Dieser Workshop richtet sich an alle Personen, die die Grundlagen zu Server Side Rendering in Web Anwendung und die Unterschiede zu Client Side Rendering wissen möchten.
+
+## Vorkenntnisse
+Die Teilnehmer sollten folgende Grundlagen beherrschen:
+
+- HTML
+- TypeScript
+
+## Benötigte Tools
+- [Docker](https://docs.docker.com/guides/getting-started/get-docker-desktop/)
+- [Node.js](https://nodejs.org/en/download/package-manager)
+- Beliebige IDE
+- [Google Chrome Browser](https://www.google.com/chrome/)
+
+## Material
+- [Aufgaben Repository](https://github.com/denwae/web-tech-ssr)
+- [Svelte Dokumentation](https://svelte.dev/docs/introduction)
+- [SvelteKit Dokumentation](https://kit.svelte.dev/docs/introduction)
+- [How Browsers Work](https://web.dev/articles/howbrowserswork)
+- [Rendering on the Web](https://web.dev/articles/rendering-on-the-web)
+- [User-centric performance metrics](https://web.dev/articles/user-centric-performance-metrics)
+- [Understand JavaScript SEO Basics](https://developers.google.com/search/docs/crawling-indexing/javascript/javascript-seo-basics)