Portfolio Webseite programmieren, aber welche Technologie sollte ich verwerden?
Hallo,
ich programmiere seit einigen Jahren aktiv in verschiedenen Spielen und studiere zudem Informatik. Nun möchte ich eine Portfolio-Webseite erstellen, um mich intensiver mit dem Thema Webentwicklung auseinanderzusetzen. Ziel ist es, meine Person, Projekte und Ideen ansprechend darzustellen.
Besonders wichtig ist mir dabei ein ansprechendes Design.
Ich habe bereits Erfahrungen mit HTML und CSS gesammelt und frage mich nun, ob ich Frameworks wie React oder Vue.js für dieses Projekt nutzen sollte. Welches Framework würdet ihr mir empfehlen, und welches wäre am besten geeignet für eine Portfolio-Webseite?
Ich plane, mich anschließend in das empfohlene Framework einzuarbeiten.
Vielen Dank im Voraus für eure Unterstützung!
Mit freundlichen Grüßen,
Florian R.
5 Antworten
Hi ByZentrox,
du solltest unabhängig von deiner Portfolio-Webseite dich mit JavaScript-Frameworks auseinander setzen. Für deine Portolio-Seite würde ich dir aber empfehlen auf native Funktionen von JavaScript zurück zu greifen.
Denn Frameworks bringen nicht nur Vorteile, sondern auch Nachteile mit sich. Frameworks verursachen unnötigen Code-Overflow, beeinflusst die Performance und auch den Traffic. Man macht sich abhängig an ein Framework, was nach Versionssprüngen zu weitreichenden Problemen führen kann. Viele Entewickler passen ihre Seiten an das Framework an und nicht umgekehrt.
Alternativ kann man auf JavaScript-Libraries zugreifen. Diese nehmen nicht viel Platz ein, können aber die passend die Funktionalität der Webseite erweitern.
Natives JavaScript bietet dir jetzt schon viel Funktionalität, sodass du komplexe "objektorientierte" Softwareprojekte umsetzen kannst. Komplexe Webseiten die mit moderner Software-Architektur entwickelt wird, kann man mit den Bordmittel eines Browser nutzen.
Natürlich sollte man auch die Vorteile aufzeigen. Größere Projekte lassen sich mit Frameworks im Team gut austauschen.
Es gibt aber auch in JavaScript Schreibstandards ähnlich wie in PHP die PSR-Standards. Diese sind meist in Standard-Gemeinschaften geregelt wie bei Google oder Airbnb. Das kann auch helfen nativen Code im Team verständlich zu teilen
Für eine normale Webseite muss man nicht unbedingt ein Framework benutzen, kann man aber natürlich trotzdem tun.
Bei einer einfachen Webseite wie einem Portfolio, das du nur selbst aktualisierst, reicht auch eine statische Webseite. Bei größeren Webseiten, insbesondere, wenn diese durch nicht-Entwickler gepflegt werden sollen, setzt man in der Regel auf ein Content Management System (CMS). Wordpress ist da sehr beliebt, das kann ich allerdings nicht ausstehen, Typo3 is ein sehr solides System, insbesondere für umfangreiche Seiten, für kleinere Seiten benutze ich gerne das etwas unbekanntere, aber sehr praktische CMS Redaxo.
Wie gesagt brauchst du das für deine Seite aber nicht unbedingt, außer, du willst den Umgang mit so einem System lernen.
Ansonsten würde ich für eine statische Webseite Nuxt.js benutzen, welches auf Vue.js basiert, aber eben besser für statische Webseiten optimiert ist.
Sowohl Vue als auch React sind primär für Web-Apps ausgelegt, also dynamische und interaktive Webseiten mit wenig statischem Content. Nuxt.js (bzw. Next.js in der React-Welt) sind eben besser für statische Webseiten ausgelegt, was aber nicht heißt, dass man nicht trotzdem interaktive und dynamische Elemente haben kann.
Ich persönlich bin mit Vue und Nuxt sehr glücklich, ich habe zu Beginn meiner Laufbahn als Webentwickler mal kurz React angeschaut, fand es aber nicht intuitiv und umständlich. Daher habe ich mich nach Alternativen umgeschaut und das zu dem Zeitpunkt noch deutlich unbekanntere Vue-Framework entdeckt, in das ich deutlich schneller hineingefunden habe. Schon damals konnte Vue eigentlich alles, was React konnte, meiner Meinung nach aber eleganter und einfacher.
Daher arbeite ich bis heute bevorzugt mit Vue oder Nuxt, und mittlerweile ist Vue auch ziemlich weit verbreitet und findet auch in einigen größeren Firmen Verwendung.
Was das Design angeht - ich designe meine Webseiten selbst, daher habe ich mich nicht wirklich mit Component-Libraries, Templates oder CSS-Frameworks wie Bootstrap befasst. Ich setze meine Designs selbst mit SASS um. Allerdings habe ich schon öfters verschiedene Design-Systeme für Vue gesehen, also scheint es auch hier einfach zu integrierende Lösungen zu geben, wenn du das Design nicht von Grund auf selbst entwickeln willst.
Das gewöhnliche "Starterpacket" welches HTML, CSS und Javascript umfasst sollte reichen. Vor allem weil eine Portfolio Website meist simpel ist, da lohnt es sich schon fast gar nicht ein framework zu verwenden.
Wenn du was schönes mit 3d haben möchtest kannst du ThreeJS verwenden, für CSS geht wenn es dir lieber ist auch tailwind aber ansonsten reicht das Starterpacket wie gesagt aus.
VG Weißbrot
Ich gehe davon aus, dass du dich in deinem Portfolio als Programmierer präsentieren möchtest, und daher vlt. auch das ein oder andere coole grafische Feature einbauen möchtest. Daher würde ich dir vom Vorschlag von Ireeb, ein CMS zu benutzen, abraten, und lieber eine eigene Lösung bauen. Dann hast du direkt ein Projekt mehr auf deinem Github zum herzeigen und bist beim Aufbau der Seite durch nichts eingeschränkt. Von PHP würde ich dir auch abraten, da gibt es deutlich modernere Alternativen.
Ich würde dir der Einfachkeit halber empfehlen, ein Framework zu verwenden das Frontend und Backend kombiniert. Meine Favouriten sind:
- Nuxt.js (verwendet Vue)
- Next.js (verwendet React)
- SvelteKit (verwendet Svelte)
Auf dieser Seite hier kannst du den Code der verschiedenen Frontend-Frameworks vergleichen, um zu entscheiden was dir am besten gefällt:
https://component-party.dev/#conditional
Am besten gefällt mir da Svelte 5. Bei Svelte würde man SvelteKit für Frontend + Backend verwendet, was ich auch absolut empfehlen kann. Das Routing-System von SvelteKit ist genial. Will man einen /about Pfad auf seiner Website muss man einfach nur unter src/routes einen Ordner namens "about" anlegen und darin eine Svelte-Datei mit dem Inhalt der Seite. Fertig, nun hat man eine /about Seite, so einfach ist das.
Andere Frameworks wie Next.js und Nuxt.js haben da meiner Meinung nach eine etwas höhere Lernkurve.
Also ich würde dir für deine Portfolio Website SvelteKit empfehlen. Next.js und Nuxt.js sind aber auch keine schlechte Wahl.
Serverseitig wird man in Zukunft weiterhin nicht um PHP herumkommen.
Clientseitig sehe ich es als hilfreich an, Javascript vanilla (also nativ) zu lernen, da die Unterstützung durch die Browserlandschaft mittlerweile sehr gut ist.
Die ganzen Frameworks unterliegen einer ständigen Modebewegung. Darüber würde ich mir erst im nächsten Schritt Gedanken machen und erst schauen, was potentielle Arbeitgeber bevorzugen.
Als ob PHP so schrecklich wäre. Die Verbreitung ist hoch, die Pflege und Weiterentwicklung der Sprache dynamisch.
Dass PHP sehr viel verwendet wird und in vielen Fällen eine sinnvolle Option ist, ist keine Frage.
Die Aussage, man würde nicht drumherumkommen, ist allerdings auch ein bisschen Quatsch, es gibt sehr viele Alternativen.
Das klingt schon eher fast nach dem "Goldenen-Hammer"-Syndrom. Wenn man nur einen Hammer hat, sieht jedes Problem aus wie ein Nagel. Man kann zwar versuchen, jedes Problem mit PHP zu lösen, aber es ist auch nicht immer die optimale Wahl.
Ich benutze PHP oft, aber es hat einfach nach wie vor einige "Altlasten", die es manchmal etwas altmodisch und umständlich wirken lassen.
Nur mal als Beispiel:
stristr, strstr, strtr, strchr, strcmp, strcoll, strcspn, strnatcasecmp, strnatcmp, strncasecmp, strncmp, strrchr sind nur ein paar der verfügbaren String-Funktionen in PHP. Selbst, wenn man einige Erfahrung in PHP hat, wird man da doch wahnsinnig, stristr, strstr, strtr, wie soll man sich da die Unterschiede merken? Und auch wenn die Doku gut gepflegt ist, machen solche Dinge es unnötig schwer, einfach nur die richtige Funktion zu finden.
Einen weiteren tollen Gag in PHP finde ich:
str_contains($haystack, $needle);
array_search($needle, $haystack);
Manchmal könnte man meinen, jemand hat versucht, PHP-Entwickler zu ärgern.
Die neueren Dinge, die bei PHP in den letzten Jahren dazugekommen sind, waren in der Regel deutlich besser durchdacht und konsequenter. Neue Funktionen haben meist besser lesbare Namen und einheitliche Signaturen. Ändert aber eben nichts daran, dass viele der älteren Teile von PHP irgendwie unsauber und veraltet wirken, und das schreckt viele Leute daran ab.
Prinzipiell kann man alles, was PHP kann auch mit Node.js, Python, Go oder anderen Server-Systemen/Sprachen abbilden. Die Frage ist aber immer, welche Architektur für eine Anwendung am meisten Sinn macht. Bei kleineren Anwendungen benutze ich gerne PHP, weil man damit mit wenig Zeit und Aufwand viel umsetzen kann. Aber bei umfangreicheren Backends finde ich dann doch Node.js mit Express übersichtlicher.
„Serverseitig wird man in Zukunft weiterhin nicht um PHP herumkommen.“
So ein Quatsch.. und was für „weiterhin“ 😂
PHP wird fast nur noch für WordPress Seiten verwendet
Falls Sie die Eingangsfrage nicht nur kursiv gelesen und sogar verstanden haben, geht es dort um das Thema "Webentwicklung". Das Unterthema PHP wurde noch nicht explizit erwähnt.
Und wie man heutzutage an PHP herumkommt (Gott sei Dank)