Aktualisiert: Januar 16th, 2019
Learn by doing
Meine bevorzugte Art zu lernen ist, indem ich lerne. Ich kann den ganzen Tag Dinge lesen und beobachten, aber bis ich mit dem Code schmutzig werde, sinkt er nicht wirklich ein. Eine großartige Möglichkeit, dies zu lernen, besteht darin, eine App zu erstellen, sodass wir dies tun werden!
Es wird kein Überblick auf hoher Ebene sein, der alles erklärt, was passiert. Es ist eher eine begehbare Anleitung für diejenigen, die mit Elixir und Phoenix vertraut sind, aber noch keine erste App erstellen müssen. Ich verwende Phoenix 1.4 und Elixir 1.8 für dieses Tutorial.
Die Funktionalität wird einfach sein. Sie können ein Konto erstellen. Sie können Videos suchen und anzeigen. Sie können neue Videos hinzufügen. Es wird einige Komplexitäten geben, z. B. Informationen von der YouTube-API abzurufen, um Videos hinzuzufügen, und Tailwind CSS anstelle des Standard-Milligramms zu verwenden (Milligramm ersetzte Bootstrap in Phoenix 1.4). Da ich jedoch bereits die Mühe gemacht habe, den Code zu bekämpfen, damit die Dinge funktionieren, sollte für Sie alles reibungslos verlaufen.
Lassen Sie mich wissen, wenn Sie an irgendeinem Punkt stecken bleiben und ich werde Ihnen gerne helfen. Lass uns anfangen!
HINWEIS: Wenn Sie zu irgendeinem Zeitpunkt nicht weiterkommen, können Sie mir einen Kommentar hinterlassen oder das Repo auf GitHub überprüfen. Jeder Teil hat seinen eigenen Zweig und wird am Anfang mit (GitHub) verlinkt. Es wird auch Commit-Hashes geben, damit Sie sehen können, was für einen bestimmten Abschnitt getan wurde. Sie werden wie folgt aussehen (70ea207). Wenn sie sich in einer Unterüberschrift befinden, bezieht sich der Commit auf diesen gesamten Abschnitt. Andernfalls wird das Commit am Ende des relevanten Textes geteilt.
Generieren Sie die App (70ea207) (GitHub)
Wir werden Catcasts erstellen. Es wird ein Ort sein, um Ihre Lieblings-YouTube-Katzenvideos zu teilen. Der Benutzer wird erstellt, indem er sich bei Google anmeldet. Die Videos werden erstellt, indem eine URL an die YouTube-API gesendet und die Informationen zurückgegeben werden. Diese Informationen werden verwendet, um eine Seite mit dem eingebetteten Video zu erstellen.
Wenn Sie Elixir und Phoenix noch nicht installiert haben, können Sie dem Elixir Guide und dem Phoenix Guide folgen. Angenommen, das ist erledigt, Zeit, unsere App zu erstellen. Wir führen mix phx.new catcasts aus, um unsere App zu generieren, und wenn sie gefragt wird „Abhängigkeiten abrufen und installieren? “ wir werden „y“ sagen.
Postgres einrichten (975847b)
Am Ende der Generierung unserer App erhalten wir einige hilfreiche Anweisungen, was wir als nächstes tun müssen.
Das erste, was wir nach dem Ausführen von cd catcasts und vor dem Ausführen von mix ecto.create tun müssen, ist unsere Datenbank zu konfigurieren. Abhängig davon, wie Sie Ihr lokales Postgres-Setup haben, besteht eine gute Chance für Ihre lokale Umgebung, dass der Benutzername Ihr Home-Verzeichnis ist (für mich wäre es thebrianemory) und Ihr Passwortfeld leer ist. Öffnen wir unsere config/dev.exs Datei und konfigurieren unsere Datenbank.Hinweis: Wenn Sie Postgres nicht auf Ihrem lokalen Computer eingerichtet haben, bietet Heroku eine hilfreiche Anleitung zur Einrichtung. Wenn Sie Homebrew verwenden, können Sie stattdessen brew install postgresql in der Befehlszeile ausführen.
Sie können dann mix ecto.create ausführen, Ihre App wird kompiliert, und dann sehen Sie die wunderbare Nachricht „Die Datenbank für Catcasts.Repo erstellt wurde.“ An dieser Stelle können Sie mix phx.server ausführen und http://localhost:4000 besuchen, um „Willkommen in Phoenix!“
HINWEIS: Wenn Sie eine Meldung ähnlich wie „Soll ich rebar3 installieren? (wenn Sie nicht interaktiv ausgeführt werden, verwenden Sie „mix local.rebar – force“) „, gehen Sie vor und wählen Sie „y“.
Wir haben auch drei Tests, die mit der App erstellt wurden, die derzeit bestehen. Um sie passieren zu sehen, müssen wir zuerst auch unsere Datenbankeinstellungen in config/test.exs aktualisieren.
Sie können die Tests jetzt mit mix test ausführen (Ihre App wird kompiliert, bevor die Tests ausgeführt werden) und den schönen grünen Text „3 Tests, 0 Fehler“ sehen.