hero

Wie lernt man Programmieren?

Und womit baut man eine App?

Lesezeit:  8  Minuten

Nach meinem letzten Eintrag, in welchem ich meine App [Athenify] vorgestellt habe, erhielt ich viele Fragen. Die meisten waren Variationen dieser beiden Fragen:

  • Wie hast Du Programmieren gelernt?
  • Womit hast Du die App gebaut?

In diesem Artikel möchte ich diese Fragen beantworten. Im Wesentlichen geht es also um zwei Aspekte:

  1. Wie lernt man ĂŒberhaupt Programmieren, wenn man es nicht schon an der Uni als Fach hatte?
  2. Wie baut man eine Web App? Welche Tools braucht man dafĂŒr?

Widmen wir uns zunÀchst der ersten Frage.

# Programmieren lernen: Wo fÀngt man an?

Ich hatte in der Schule drei Jahre Informatik und es hat mir großen Spaß bereitet. Ich habe, als ich vor einem Jahr fĂŒr meine Masterarbeit JavaScript gelernt habe, also nicht ganz bei Null angefangen. Allerdings: Zu meiner Schulzeit haben wir mit Delphi programmiert. Das ist eine (veraltete) Programmiersprache, die heute niemand ernsthaft lernen sollte!

Zum GlĂŒck gibt es heute im Internet eine Vielzahl an wirklich tollen Materialen – manche kostenlos, manche kostenpflichtig. Mithilfe dieser Materialien ist es sehr gut möglich, aus dem Stand heraus zum Programmierer zu werden. Aus meiner Sicht sind drei Dinge entscheidend, wenn man Programmieren lernen möchte:

# 1. Die Bereitschaft zu Investieren

Auch wenn es viele gute kostenlose Kurse auf YouTube und anderen Seiten gibt, wĂŒrde ich empfehlen, direkt von Anfang an einen kostenpflichtigen Kurs zu machen. Das hat mehrere GrĂŒnde. Erstens: Ein kostenpflichtiger Kurs stellt ein Investment dar, und die Forschung zeigt, dass man dann eher am Ball bleibt. Zweitens: Kostenpflichtige Kurse sind oft besser gestaltet, d.h. besser strukturiert und umfangreicher ,als kostenlose Kurse. Das ist natĂŒrlich nicht immer der Fall, aber tendenziell ist die QualitĂ€t von kostenpflichtigen Kursen besser.

Ich habe vor einem Jahr folgendes gemacht. Ich habe mir einen Account auf Udemy erstellt und dort nach den bestbewerteten Kursen fĂŒr JavaScript gesucht (viele Bewertungen, mehr als 4,5 Sterne). Dann habe ich mir einige Kurse gekauft und mir die Videos angeschaut. Hier ist ein Screenshot meines Udemy-Accounts. In rot umrandet sind die Kurse, die ich fĂŒr meine erste App benötigt habe, die anderen Kurse mache ich gerade oder plane sie bald zu machen:

# 2. Googeln können

Jeder, wirklich jeder Programmierer macht es so: Etwas klappt nicht, man kopiert die Fehlermeldung oder Frage in Google und öffnet dann unzÀhlige Tabs von StackOverflow (ein Online-Forum, auf dem sich Programmierer gegenseitig austauschen und helfen).

Kein Programmierer baut in einem Vakuum eine App. In Wirklichkeit gehört hundertfaches Googeln zum Alltag. Will sagen: Wenn Du Programmieren lernst, gehört es zur Tagesordnung, stÀndig zu Googeln, wie ein Problem gelöst werden kann. Das ist nicht »Cheaten« sondern der ganz normale Prozess.

Wenn man also etwas nicht hinbekommt: Google anwerfen und das Problem suchen. Die Wahrscheinlichkeit ist sehr hoch, dass es im Internet bereits eine Lösung fĂŒr das Problem, vor dem man steht, gibt. Ich habe mir unzĂ€hlige Lösungen ergoogelt und die FĂ€higkeit, richtig Googlen zu können ist zum Programmieren lernen wirklich unerlĂ€sslich.

# 3. Ein echtes Projekt haben, fĂŒr das man das Programmieren lernt

Im ersten Punkt schreibe ich, dass man einen bezahlten Kurs folgen soll. Das ist fĂŒr den Anfang gut und wichtig (start small). Aber: Programmieren nur nach Tutorial, das ist wie Fahrrad mit StĂŒtzrĂ€dern fahren: Es ist Ă€hnlich wie richtig Fahrrad fahren, aber nicht dasselbe. Wenn man die Tour de France fahren möchte, muss man die StĂŒtzrĂ€der ablegen.

In Wahrheit lernt man wirklich programmieren nur dann, wenn man echte Probleme fĂŒr eine echte App lösen muss. Folgt man nur Tutorials wird diese immens wichtige Kompetenz ĂŒberhaupt nicht trainiert. Deshalb ist es ungemein wichtig, so frĂŒh wie möglich von den Tutorials zu einer echten App zu springen.

Wann dieser Sprung gemacht werden sollte ist sehr schwer zu sagen. Macht man ihn zu frĂŒh, ist es zu schwer, denn man besitzt noch nicht die richtigen FĂ€higkeiten. Macht man ihn zu spĂ€t, verliert man Lernzeit. Aus meiner Sicht macht demnach folgendes Sinn:

  • Am Anfang so viel Wissen wie möglich aufsaugen, Tutorial fĂŒr Tutorial schauen.
  • Als nĂ€chstes dann kleinere eigene Experimente wagen, viel Googeln.
  • Gezielt Tutorials anschauen fĂŒr bestimmte Techniken.
  • Und dann irgendwann lĂ€sst man die StĂŒtzrĂ€der komplett weg, baut an einem eigenen Projekt und googelt was das Zeug hĂ€lt.

Das sind aus meiner Sicht die drei wichtigsten Schritte. Schön und gut, aber womit genau baut man nun eine App. Im nachfolgenden skizziere ich den sogenannten "Stack", den ich fĂŒr mein App-Projekt verwendet habe. Mit Stack meint ein Programmierer einfach die Sammlung an Werkzeugen, Bibliotheken und Hilfsmitteln, die zum Programmieren verwendet wird. Es ist sozusagen die AusrĂŒstung des Programmierers. Ein Programmierer kann, wie ein Handwerker, je nach Projekt unterschiedliche Tools verwenden. Es gibt keinen "richtigen" oder "falschen" Stack. Aber: je nach Projekt eigenen sich verschiedene Tools besser oder schlechter.

Tatsache ist aber auch, dass es heute ein ungeheure Vielzahl an Tools gibt. Als AnfÀnger fÀllt es da oft schwer, wo man den nun anfangen soll. Daher soll die folgende Liste als Inspiration dienen.

# Was ist ein möglicher Stack, um eine App zu bauen?

Wenn man eine App bauen möchte, gibt es zwei große Möglichkeiten: Man baut eine native App, zum Beispiel mit Java bei Android, Swift bei iOS oder etwas vergleichbarem fĂŒr Windows oder Mac. Eine native App wird nativ fĂŒr das EndgerĂ€t kompiliert.

Oder man baut eine Web-App.

Ich werde hier die zweite Möglichkeit beschreiben. Eine WebApp nutzt Webtechnologien wie HTML, CSS und JavaScript und lÀuft auf jedem EndgerÀt, das einen Browser besitzt. Die Grenzen zwischen App und Webseite verschwinden zunehmend. Zuletzt hat SpaceX eine Rakete ins All geschickt, die mit JavaScript ausgestattet ist. Im nachfolgenden zÀhle ich die Tools auf, die ich verwendet habe.

Editor: Hiermit schreibt man den Code Um zu Programmieren, braucht man einen Code-Editor (= Word fĂŒr Programmieren). Ich kann den kostenlosen Editor Visual Studio Code von Microsoft sehr empfehlen.

Versions-Management: Hier verwaltet und speichert man den Code Jeder kennt es: "Presentation_V3_Final_last-change_Sent.pptx". Dieses Problem ist bei der Software-Entwicklung dank Versionsmanagement wie Subversion oder Git mittlerweile gelöst. Ich empfehle jedem, Github zu verwenden. Über 50.000.000 Entwickler verwenden es, hier lĂ€uft der** Code der Menscheit**. Auf Github lĂ€dt man den Quelltext der App und kann dort die verschiedenen Versionen organisieren. Es dauert ein paar Stunden, Github zu lernen, aber es ist ein sehr, sehr wichtiges Investment.

Paketmanager: Hiermit lĂ€dt man Erweiterungen runter Um Frameworks und Libraries zu installieren, braucht man npmund Node (fĂŒr beides gibt es in jedem Video-Kurs eine Anleitung).

JavaScript Framework: Hilft dabei, ein User Interface zu bauen Wenn man eine Web-App baut, dann nutzt man fast immer ein sogenanntes JavaScript-Framework. Dabei handelt es sich um eine Sammlung von Code, die es einfach macht, mit JavaScript zu arbeiten (man könnte auch ohne Framework starten, das nennt man dann »Vanilla JavaScript«).  Bei den Frameworks gibt es drei Hauptmöglichkeiten (Reihenfolge gibt ungefÀhr die PopularitÀt wieder):

  • React, das von Facebook entwickelt wird
  • Vue, das von einer Gruppe von Programmieren um Evan Vue entwickelt wird
  • Angular, das von Google entwickelt wird

Ich habe mich fĂŒr Vue entschieden. Es ist aus meiner Sicht sehr einsteigerfreundlich. Fakt ist: Mit allen drei Frameworks kann man tolle Web-Apps bauen.

CSS-Library: Ist fĂŒr das optische Styling von Webseiten und Apps verantwortlich Wenn man das Interface der App nicht komplett selbst in CSS gestalten will (und das sollte man als AnfĂ€nger definitiv nicht tun), kann man ein CSS-Framework verwenden. Das bekannteste ist Bootstrap (habe ich fĂŒr meine Masterarbeit verwendet). FĂŒr meine App habe ich **Bulma **verwendet, um genau zu sein die Vue-Implementierung von Bulma, die buefy heißt.

Datenbank: Hier werden die Daten, die in der App verwendet werden, gespeichert Wenn man in einer App Daten speichern möchte, braucht man eine Datenbank. Hier bieten sich MongoDB,

Firebase oder, wenn man relationale Daten hat, eine SQL-Implementierung an. Ich habe Firebase verwendet.

Authentifizierung: Hiermit lassen sich User-Accounts mit Passwort etc. verwalten Wenn die App verschiedene Nutzer unterstĂŒtzten soll (mit E-Mail, Passwort etc.) braucht man eine Auth-Lösung. Ich habe mich auch hier fĂŒr Firebase Auth entschieden und die Implementierung ist wirklich sehr einfach.

Hosting: Ort, wo die App gehostet wird (ein Server, den man mietet) Die Web-App muss natĂŒrlich irgendwo gehostet werden. Wenn man den Code ohnehin auf Github hat, bietet sich Netlify an. Netlify ist fĂŒr die meisten Use Cases kostenlos und sehr einfach einzurichten.

Domain: URL-Adresse, ĂŒber die die App erreichbar ist Wenn man eine eigene Domain will, muss man diese kaufen. Ich habe Athenify auf Strato gekauft. Die Domain verweist dann auf meine App, die bei Netlify gehostet ist.  Hier eine Zusammenfassung meines Stacks:

  • Code-Editor: Visual Studio Code
  • Versions-Management: Github
  • Paket-Manager: npm
  • JavaScript-Framework: Vue
  • CSS-Framework: buefy (Bulma)
  • Datenbank: Firestore von Firebase
  • Authentifizierung: Firebase Auth
  • Hosting: Netlify
  • Domain: Strato

# Wie lange dauert es?

Wie man der obigen Liste entnehmen kann, muss man einige Tools beherrschen. Das lernt man nicht an einem Tag. In der unten stehenden Übersicht habe ich alle Zeiten (wochenweise) erfasst, die ich fĂŒr meine Masterarbeit aufgewendet habe.

Insgesamt habe ich die Programmierung meiner Masterarbeit in weniger als 200 Stunden erreicht. Das scheint mir ein guter Richtwert. Ein mögliches Szenario wĂ€re also: Jeden Tag abends eine Stunde programmieren. Dann kann man in sich in etwas mehr als einem halben Jahr sehr solide Kenntnisse aneignen. NatĂŒrlich ist man dann noch kein Experte (man denke an die Gladwell'sche 10.000-Stunden-Hypothese), aber man ist dann in der Lage, Software deutlich besser einschĂ€tzen zu können.