Entwicklung einer Web-App - Teil 1

  • Coding
  • Git

1.6.2023

Ein neues Webanwendungsprojekt von Grund auf zu beginnen, ist eine Herausforderung, insbesondere für Programmieranfänger. Dennoch lernt man am effektivsten, wenn man es tatsächlich tut, dabei Fehler macht und aus diesen Erfahrungen wertvolle Erkenntnisse gewinnt. Und genau das werde ich jetzt tun.

Die Idee
Derzeit verwende ich auf meinem Smartphone mehrere Apps, um verschiedene Aufgaben zu erledigen, wie z. B. Projektmanagement, Notizen schreiben, To-Do-Listen und Budgets erstellen, meinen Kalender verwalten oder die Verwendung eines Fokus-Timers. Ich möchte eine Web-App entwickeln, die all diese Funktionen auf einer Plattform zusammenfasst.

Das Design
Nachdem ich nun die Funktionalität der App festgelegt habe, beginne ich damit, Ideen auf Papier zu skizzieren, und danach erstelle ich ein Design für jede Seite mit Adobe XD. Ich rechne damit, dass ich während des gesamten Prozesses Änderungen am Design vornehme, aber es ist wichtig, einen Fahrplan zu haben, dem ich folgen kann. Wenn man ohne ein klares Designkonzept mit der Programmierung beginnt, verliert man auf dem Weg dorthin viel Zeit.

Einrichten meiner Programmierumgebung
Ich verwende Visual Studio Code als Code-Editor. Ich kann ihn sehr weiterempfehlen - er ist kostenlos, Open Source, hat viele Erweiterungen und ein integriertes Terminal.
Innerhalb des Editors erstelle ich einen Projektordner und richte in diesem Ornder ein Git-Repository ein, indem ich die Befehlszeile git init im Terminal verwende. Mit Git kann ich alle Änderungen und Fortschritte in meinem Projekt verfolgen. Schliesslich erstelle ich eine .gitignore-Datei, in der ich alle Dateien und Ordner aufliste, die nicht von Git verfolgt werden sollen (wie z.B. .DS_Store, node_modules, .env-Datei und so weiter...).
Für mehr Informationen zu diesem Thema würde ich den Artikel von Dionysia Lemonaki auf freecodecamp.org empfehlen.

Das war's fürs Erste, bleib dran für Teil 2, in dem die eigentliche Programmierreise beginnt...