Update

src/components/footerSection.jsx

@@ -6,7 +6,7 @@ function FooterSection() {
       <nav>
         <a href="/impressum" className="foot-links">Impressum</a>
         <br />
-        <a href="/privacy" className="foot-links">Datenschutzerkl&auml;rungen</a>
+        <a href="/privacy" className="foot-links">Datenschutz</a>
       </nav>
     </footer>
   );

src/components/projects/languageStudy.jsx

@@ -1,10 +1,111 @@
-import React, { Component } from 'react';
+import React, { Component } from "react";
 
 function LanguagestudyPage() {
   return (
-    <section className='center-titles'>
+    <section className="center-titles">
       <h2>Wikipedia Sprachstudie</h2>
+      <p className="centered">
+        Dieses Projekt war mein Abschlussprojekt für den Kurs „CS50x“.
+      </p>
+      <div className="centered">
+        <h3 className="space">GitHub</h3>
+        <a href="https://github.com/simon-266/WikiDictionaryResearch">
+          https://github.com/simon-266/WikiDictionaryResearch
+        </a>
+      </div>
+      <div>
+        <h2 className="space">Worum geht es in dieser Sprachstudie?</h2>
+        <p>
+          Ziel dieser Sprachstudie ist es, einem oft gehörten Fakt beim
+          Sprachenlernen nachzugehen und ihn zu beweisen oder zu widerlegen. Der
+          Fakt lautet:{" "}
+          <b>
+            „Die 1000 häufigsten Wörter machen etwa 80 % des gesprochenen
+            Wortschatzes aus.“
+          </b>
+          Um dies zu untersuchen, habe ich ein Skript programmiert, welches 15.000
+          Wikipedia-Seiten durchsucht und die englischen Wörter darin zählt.
+          Zusätzlich habe ich einige Diagramme zu meinen Ergebnissen in einem
+          Jupyter Notebook erstellt:
+        </p>
+        <div className="image-container">
+          <img
+            src="/assets/projects/languageStudy/images/top1000.png"
+            alt="Kreisdiagramm: Die Top 1000 Wörter im Vergleich zum Rest"
+            className="center-image"
+          />
+          <img
+            src="/assets/projects/languageStudy/images/stats.png"
+            alt="Kreisdiagramm: Verlgeiche der Vorkommen"
+            className="center-image "
+          />
+        </div>
+      </div>
+      <div>
+        <h2 className="space">Ergebnisse</h2>
+        <p>
+          Die Ergebnisse zeigen deutlich, dass die Top 1000 Wörter tatsächlich
+          einen sehr großen Anteil ausmachen – auch wenn es nicht ganz 80 %,
+          sondern knapp 70 % sind. Daraus lässt sich schlussfolgern, dass es sich
+          beim Sprachenlernen definitiv lohnt, sich auf diese Wörter zu
+          konzentrieren, um gute Fortschritte zu erzielen.
+        </p>
+      </div>
 
+      <div>
+        <h2 className="space">
+          Welche Techniken, Technologien und Bibliotheken habe ich verwendet?
+        </h2>
+        <div className="centered-list-container">
+          <ul className="centered-list">
+            <li>
+              <b>Programmiersprachen</b>: Python, IPython
+            </li>
+            <li>
+              <b>Programme</b>: VSCode, JupyterLab, GIT (GitHub)
+            </li>
+            <li>
+              <b>Multithreading und Batchverarbeitung</b>: Mithilfe der Future
+              Library konnte ich das Zählen der Wörter auf mehrere Threads
+              verteilen. Durch einfache Schleifen konnte ich den benötigten
+              Arbeitsspeicher begrenzen, indem ich die 15.000 Seiten in kleinere
+              Batches aufteilte, diese vorab zusammenführte und am Ende zum
+              finalen Ergebnis zusammenführte.
+            </li>
+            <li>
+              <b>Wikipedia</b>: Die Quelle meiner Daten, da die Inhalte dort ohne
+              Copyright-Probleme nutzbar sind, und die zugehörige Python
+              Library, welche das Webscraping vereinfacht.
+            </li>
+            <li>
+              <b>Pandas</b>: Hierfür habe ich mich entschieden, da ich nach einer
+              effizienten Möglichkeit suchte, die Wörter zusammenzuführen.
+              Außerdem vereinfacht es das Speichern dieser Daten in Dateien.
+            </li>
+            <li>
+              <b>sqlite3</b>: Gut zum Speichern und Abrufen meiner Daten.
+            </li>
+          </ul>
+        </div>
+      </div>
+      <div>
+        <h2 className="space">Fazit</h2>
+        <div className="centered-list-container">
+          <ul className="centered-list">
+            <li>
+              <b>Neues Wissen</b>: Durch dieses Projekt konnte ich mich zum ersten
+              Mal intensiv mit den Themen Webscraping (auch wenn es über eine
+              Library geschah) und Multithreading in Python beschäftigen, was für
+              zukünftige Projekte relevant sein könnte.
+            </li>
+            <li>
+              <b>Übung</b>: Das Projekt hat sehr gut dazu gedient, mich intensiver
+              mit Python auseinanderzusetzen und dabei neue Libraries und
+              Funktionen innerhalb der Sprache selbst kennenzulernen.
+            </li>
+          </ul>
+        </div>
+      </div>
     </section>
   );
 }

src/components/projects/server.jsx

@@ -55,6 +55,7 @@ function ServerPage() {
             meine gesamte Homepage mit nur wenigen Klicks oder Befehlen zu
             aktualisieren, ohne dass ich mich auf dem Server einloggen muss.
           </li>
+          <li><b>Certbot</b>: Stellt die SSL/TSL Certifikate bereit und haltet sie stets aktuell.</li>
         </ul>
       </div>
 

src/styles/styles.css

@@ -52,6 +52,11 @@ section {
     min-height: 100vh;
 }
 
+.center-titles {
+    margin-left: 5%;
+    margin-right: 5%;
+}
+
 .center-titles h1, .center-titles h2, .center-titles h3{
     text-align: center;
 }
@@ -68,4 +73,20 @@ section {
 .center-image {
     display: block;
     margin: auto auto;
+    
+        
+    max-width: 100%;
+    max-height: 100%;
+    height: auto; 
+    width: auto; 
+
 }
+
+.image-container {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 10px;
+    flex-wrap: wrap;
+}
+