Jeden Monat teile ich mit Mitgliedern
4 neue praxisnahe Tutorials (je 1000+ Wörter).


Trage Deine Mail, damit Du
Deine Coding + Hacking Skills erweitern kannst!

Die Webseite nutzt nur technisch notwendige Cookies.

5 Coding Challenges – Ideen, Herausforderungen, Aufgaben

5 Coding Challenges

Dieser Beitrag stellt Dir 5 Coding Challenges vor.

Von Anfänger bis Profi!

Teste Dich aus und beginne heute noch Dein erstes Projekt?

Starte jetzt Dein neues Projekt …

Wie starte ich eine Coding Challenge?

Programmieren - Doch nur was?
Programmieren – Doch nur was?

Du musst Dir im Klaren sein, wie Deine Software am Ende aussehen soll:

  • Was ist das Ziel?
  • Was sind die minimalen Features?
  • Was muss ich dafür können / machen?

Ein kluger erster Schritt ist es, ein Git-Repo zu erstellen und dort eine Readme.md mit den wichtigsten Ideen festzuhalten. Dabei sollst Du den „Monkey“ zuerst behandeln.

Was meint „Monkey first“?

Stell Dir vor, Du bist Angestellter und bekommst von Deinem Chef gesagt, Du sollst einen sprechenden Affen auf ein 3-teiliges Podest stellen.

Weil Du schon mal ein Podest gebaut hast, beginnst Du mit dem Podest. Jetzt kommt der Affe.

Nach 7 Tagen Arbeit kommst Du zum Schluss, dass es gar keine sprechende Affen gibt.

Steffen Lippke

Deshalb solltest Du den „Affen“ immer zuerst machen. Es ist klüger, ein Projekt früh abzubrechen, als 10.000 von Euros für einfachere Vorarbeiten auszugeben.

To-do-Liste bauen – Level: absoluter Anfänger

Todos managen
Todos managen

Architektur

Eine To-do-Liste besteht aus einem Array. Dieser speicherst Du lokal im RAM. Wenn Du eine Aufgabe erledigt hast, dann entferne das einzelne Objekt aus dem Array. Die Nutzeroberfläche kannst Du mit HTML und einer Würze CSS gestalten. JavaScript übernimmt die Logik und führt die Operation auf dem Array aus.

Monkey first

Die schwierigste Aufgabe solltest Du zuerst bearbeiten: Wie kann ich neue To-dos zu einer bestehenden Liste hinzufügen und die richtige To-do beim Klick auf diese herauslöschen?

Minimale Features

To-dos hinzufügen, anzeigen und löschen, die To-dos sollten untereinander erscheinen und nicht To-dos andere To-dos überschreiben

Hinweise: Eine <ul> Liste ist für eine solche Anwendung geeignet. Nutze die fertigen JavaScript-Array-Funktionen, um die Elemente zu bearbeiten.

Texteditor mit Formatierung bauen – Level: eingearbeiteter Anfänger

StackEdit ist eine gute Vorlage
StackEdit ist eine gute Vorlage

Architektur

Die einfachste Formatierungssprache nennt sich Markdown. Mit einfachen Symbolen vor bzw. nach dem Text formatiert der Schreiber seine Texte. Du brauchst eine Ansicht für die Eingabe und eine Ansicht für die Darstellung des fertigen Texts. Für dieses Projekt eignet sich ein webbasiertes Framework besonders gut. Das kann Angular, Ionic oder Vue sein.

Monkey first

Du musst nicht alles neu erfinden. Ein Text-Markdown-Converter als Bibliothek gibt es sehr wahrscheinlich auch in Deiner Programmiersprache.

Die Kunst ist es jetzt, die Dokumentation zu lesen, zu verstehen und nach allen Best Practices in Dein Projekt zu implementieren. Überlege Dir, ob Du zusätzliche Shortcuts und Textauswahlen einbaust. Wenn der Nutzer den Text markiert, dann soll bei einem Klick auf den Button „Fett“ oder „F“ der Text mit Sternen **umrandet** sein.

Minimale Features

Text eingeben, Markdown zu HTML konvertieren und darstellen, in Echtzeit Markdown konvertieren, die HTML als fertiges Dokument ausdrucken

Hinweise: Du kannst nicht in 2 Stunden einen Microsoft Word Killer bauen, aber Du kannst ein Schreibprogramm bauen, welches für 1 Aufgabe sehr gut spezialisiert ist, z. B. das Schreiben von Berichten, mit ein paar coolen Funktionen, die für diese Berichte super sind.

Kreativ am Zeichenprogramm – Level: Fortgeschritten

Zeichnen ist genial
Zeichnen ist genial

Architektur

Hierbei handelt es sich um eine lokale Software, welche viele Daten im RAM vorhält. Ich empfehle Dir nicht, Deine eigene Grafik-Engine zu bauen, sondern bestehende Canvas-Komponenten, Pfaden und Farbskalen zu verwenden.

Monkey first

Wenn Du ein solches Projekt angehst, solltest Du immer mit der Grafikfläche anfangen:

  • Wie bekomme ich von der Mausposition Farbe auf die Leinwand?
  • Wie speichere ich die Pinselstriche zwischen?

Bei Zeichenprogrammen gibt es zwei Ansätze: Vektor basiert oder Pixel basiert. Vektoren können unendlich gut auflösende Inhalte mit ihren mathematischen Kurven und Graden herstellen, während Pixel basierende Programme aus einzelnen Bildpunkten bestehen.

Minimale Features

Bilder laden und exportieren, Pinselstriche tätigen, Farben wechseln, Rückgängig des letzten Pinselstrichs

Hinweise: Als Speicherstruktur von Pinselstrichen ist ein Stack eine sehr gute Wahl. Die letzte Aktion löschst Du mit einem pop(), das oberste Element im Stapel.

Handschrift mit KI erkennen – Level: tiefes Verständnis

TensorFlow hilft Dir viel
TensorFlow hilft Dir viel

Architektur

Wenn Du mit Bildern und neuronalen Netzen arbeiten willst, dann brauchst Du eine Modellierung, damit die Netze das Bild aufnehmen können. Zentriere die Zahl, skaliere alle Bilder gleich groß, z. B. 64 Pixel x 64 Pixel und reduziere das Bild auf ein Schwarz-Weiß-Spektrum. Die Daten musst Du mit TensorFlow auswerten.

Monkey first

Bevor Du eine Zeile Code schreibst, solltest Du Dich mit der „Mathematik dahinter“ auseinandersetzen. Du kannst die Tutorials abtippen und dann nutzt Du eine paar Funktionen, die ihre „Schwarze Magie“ tätigen, aber Du hast bei diesem Projekt nichts gelernt. Nur wer sich mit den Grundlagen auseinandersetzt, kann auch später das Feintuning tätigen, um noch bessere Ergebnisse als alle anderen zu erhalten.

Minimale Features

Bilder einlesen, durch ein neuronales Netz jagen und Wahrscheinlichkeiten für jede Zahl erhalten, optional: Visualisiere den Trainingsfortschritt mit Deinen Systemen.

Hinweise: Du kannst Deinen eigenen Datensatz erstellen, aber ich empfehle Dir zuerst einen fertigen Datensatz zu nutzen. Andere haben dieses Projekt mit den gleichen Daten ausgeführt und Ergebnisse erhalten. Mit diesen kannst Du Dich vergleichen.

Eigene Datenbank programmieren – Level: Experte

Graphendatenbanken sind oft unterschätzt
Graphendatenbanken sind oft unterschätzt

Architektur

Kein Entwickler findet eine Datenbank, die in allen Situationen sehr gut geeignet ist. Du musst immer Kompromisse eingehen. Deshalb ist es so interessant, eine Datenbank zu bauen. Das Projekt X weist verschiedene Anforderungen auf, die eine Datenbank mit sich bringen soll. Entscheidungen können z. B. sein:

  • flüchtig oder permanent
  • in Tabellenform oder freie Objekte
  • Speicherplatz oder Geschwindigkeit optimiert
  • Komplexe oder einfache Abfragen.

Monkey first

Das Schwierigste an der Datenbank ist es, eine Abfragesprache / Manipulationssprache zu entwickeln. Du schreibst Deinen ein Programm, welches Abfragen auf Syntax validiert, ausführt und richtig ausgibt. Die Grundlage ist die Speicherstruktur, welche Du auf Deinen vorher getroffenen Entscheidungen designen musst. Eine Analytik-Datenbank (vertikale Datenbanken, Data Marts) ist anders aufgebaut, als eine operationale Datenbank (relationale Datenbank, schreib-optimiert).

Minimale Features

Jede Datenbank soll Daten lesen, löschen, schreiben und ändern können. Überlege Dir auch einen Ansatz für eine Abfragesprache, die z. B. die Anzahl pro Spaltentyp zählen kann. Einige Grundoperationen der Selektion wie bei SQL (WHERE) sollten vorhanden sein, damit Du diese einigermaßen verwenden kannst.

Hinweise: Beim Datenbank-Design gibt es kein Richtig oder Falsch. Du solltest Du Dir nur im Klaren sein, was Dein zu optimierendes Szenario ist (Schreiben, Lesen, Analyse, Blob, Key-Value usw.).


Danke fürs Lesen! Erhalte weitere Tutorials in meinem kostenlosen Newsletter.
Jeden Monat teile ich mit Dir 4 neue praxisnahe Tutorials.
Trage Deine Mail zum kostenlosen Empfang des Newsletters* ein.




Quellenangabe Bilder: Icons und SVG-Grafiken im Titelbild von Microsoft PowerPoint 2019, frei verfügbar nach EULA
*) Mit dem Abonnement des Newsletters erklären Sie sich mit der Analyse des Newsletters durch individuelle Messung, Speicherung und Analyse von Öffnungsraten und der Klickraten in Profilen zu Zwecken der Gestaltung künftig besserer Newsletter einverstanden. Sie können die Einwilligung in den Empfang des Newsletters und die Messung mit Wirkung für die Zukunft widerrufen. Mehr in der Datenschutzerklärung.