Ruby on Rails für Designer

Ruby on Rails ist ein Open-Source-Web-Framework, das für Programmiererglück und nachhaltige Produktivität optimiert ist. Damit können Sie schönen Code schreiben, indem Sie Konventionen der Konfiguration vorziehen.

Dies ist die Art und Weise, wie Ruby on Rails sich selbst bewirbt - aber in meinen Worten ist dies ein unglaublicher Rahmen, der Ihr Leben wirklich erleichtern kann. Sie können mehr auf ihrer Website http://rubyonrails.org erfahren

Schritt 1- Ruby on Rails installieren

Die Installation von Ruby on Rails (oft auch auf RoR verkürzt) ist auf den meisten Systemen ziemlich schmerzlos, aber Sie müssen sich mit dem Öffnen des Terminals vertraut machen. Auf der Ruby on Rails-Download-Seite finden Sie Links zum Einstieg. Ich werde sie hier reproduzieren, um Ihnen etwas Zeit zu sparen. Nur ein Hinweis, dies sind die Orte, an denen Sie Ruby bekommen können, wozu Rails programmiert ist, und wir werden Rails in einer Minute installieren. Weitere Informationen zur Sprache finden Sie auf der Ruby-Site

  • Windows: One-Click Ruby Installer (ich empfehle die 1.8.6-26 Final Release)
  • Mac OS X 10.4: Versendet mit gebrochenem Ruby, aber Sie können dem erstaunlichen Führer von Dan Benjamin folgen
  • Mac OS X 10.5: Wenn Sie die Entwicklertools von Apple installieren, werden Sie eingestellt. Probieren Sie entweder Ihre Installations-CDs oder die Apple Developer Site aus und laden Sie Xcode herunter
  • Linux: Während dies für jede Distribution unterschiedlich sein kann, müssen Sie Ruby, IRB und Rdoc installieren

Nachdem wir Ruby heruntergeladen haben, stellen Sie sicher, dass Sie über RubyGems verfügen, einen Paketmanager für Ruby.

Um zu testen, ob Sie RubyGems haben, führen Sie im Terminal Folgendes aus:

gem -v

Zum jetzigen Zeitpunkt ist 1.3.2 die neueste Version. Um zu aktualisieren, wenn Sie nicht über die neueste Version verfügen, führen Sie Folgendes aus, und wenn Sie sich auf einem Mac befinden, setzen Sie Sudo in den Vordergrund.

gem update - system

Wenn Sie RubyGems nicht verwenden, gehen Sie folgendermaßen vor:

  1. Laden Sie die neueste Version von RubyGems hier herunter.
  2. Extrahieren Sie das Paket
  3. Wechseln Sie in das Verzeichnis in Ihrem Terminal (cd ist der Befehl)
  4. Führen Sie dies im Terminal aus: ruby ​​setup.rb (Fügen Sie sudo vor dem Befehl für Linux- und Mac OS X-Benutzer hinzu. Sie müssen auch für alle Installationsbefehle von gem fortfahren.)

Wenn Sie ein Linux-System haben, sollten Sie in der Lage sein, RubyGems über Ihren Paketmanager zu installieren. Ich bevorzuge jedoch die oben beschriebene Methode. Wenn Sie weitere Probleme haben, lesen Sie die Installationsdokumentation auf der RubyGems-Site.

Schienen installieren

Nun, da wir die neueste Version von RubyGems haben, installieren wir Rails:

gem monte Schienen

Die Installation von Rails und aller seiner Abhängigkeiten dauert einige Minuten.

Schritt 2 - Anwendung erstellen

Nun, da wir Ruby, RubyGems und Rails installiert haben, erstellen wir ein Projekt! Um ein neues Projekt zu erstellen, erstellen Sie mit dem Befehl Rails neue Projekte. Wir erstellen ein einfaches Projekt mit dem Namen "Blog". Hinweis: Dadurch wird der App-Ordner in dem aktuellen Verzeichnis erstellt, in dem Sie sich im Terminal befinden. Stellen Sie daher sicher, dass Sie in das Verzeichnis wechseln, in dem die App gespeichert werden soll.

Schienen-Blog

Sie sollten so etwas wie durchfliegen sehen:

Als nächstes öffnen Sie das Projekt in Ihrem bevorzugten Texteditor / IDE. Ich persönlich liebe TextMate. Bislang nur für Mac OS X gibt es einige tolle Klone, die auch verfügbar sind.

Ordnerstruktur

Die Ordnerstruktur eines Ruby on Rails sieht folgendermaßen aus:

Es gibt drei Ordner, mit denen jeder Entwickler oder Designer täglich arbeiten muss: die App, die Konfiguration und die öffentlichen Ordner. Bitte lesen Sie die kurzen Erklärungen für jeden Ordner:

  • app: Hier lebt die Logik Ihrer Anwendung.
    • Controller: Hier sucht Rails die Controller-Klassen. Kurz gesagt, diese erhalten die Anfragen.
    • Helfer: Helfer leben in diesem Verzeichnis und unterstützen die Controller, Modelle und Ansichten
    • Modelle: Jede dieser Optionen stellt im Wesentlichen eine Tabelle in der Datenbank dar. Das Suchen nach Informationen und das Einrichten Ihrer Anwendung ist daher denkbar einfach
    • Ansichten: was der Benutzer sieht
      • Layouts: Dies sind die Layouts, die Sie für die Verwendung eines Controllers definieren können. Macht das Templating sehr einfach.
      • alle anderen: Während sich in unserer Anwendung derzeit noch keine befinden, stellt jeder der anderen Ordner, die sich in diesem Ordner befinden, einen Bezug zu den Controllern dar, und die Dateien, die sich hier befinden, entsprechen den Aktionen im Controller
  • config: Dieser Ordner enthält alle Einstellungen Ihrer App. Einige spezifische Dateien:
    • Datenbank.yml: Diese Datei enthält Ihre Datenbankeinstellungen
    • environment.rb: Diese Datei enthält die Rails-Einstellungen für Ihre Anwendung
    • Umwelt /: Dieser Ordner enthält die Konfigurationseinstellungen für jede der spezifischen Umgebungen: Entwicklung, Test und Produktion
    • routen.rb: Diese Datei enthält die Einstellungen für das URL-Schema sowie eine bestimmte URL und den Ort, an den die Anforderungen gesendet werden sollen
  • db: Dieser Ordner enthält schließlich Ihre Datenbank (wenn Sie sqllite verwenden), Ihr Datenbankschema und alle Ihre Datenbankmigrationen (Änderungen an der Struktur).
  • doc: Dieser Ordner enthält die gesamte Dokumentation, die von rake doc: app erstellt wurde
  • lib: Die hier enthaltenen Dateien enthalten anwendungsspezifischen Code, der nicht in Ihre Controller gehört.
  • Log: Rails speichert die Protokolle hier, vier davon. Eine für serverspezifische Informationen in server.log und eine für jede Umgebung.
  • Öffentlichkeit: Dieser Ordner enthält alle Dateien, die sich nicht so sehr ändern. Rails sucht nach Dateien, bevor sie zu einem Controller geht. Javascripts werden im Ordner javascripts, Bilder im Ordner images und Stylesheets im Ordner Stylesheets gespeichert. Statische Dateien wie robots.txt und andere HTML-Dateien können hier ebenfalls gespeichert werden. Stellen Sie sicher, dass Sie die index.html-Datei löschen, da diese anstelle des gewünschten Werts angezeigt wird!
  • Skript: Diese Skripte erleichtern Ihnen das Leben. Das Serverskript startet den Entwicklungs-Webserver und generiert Code generieren.
  • Prüfung: Die Tests, die Sie schreiben und die, die Rails für Sie erstellt, werden hier gespeichert.
  • tmp: Rails speichert hier temporäre Dateien.
  • Verkäufer: Hier können Sie beliebige Rails-Plugins (oder -Bibliotheken) installieren, die von Drittanbietern erstellt wurden, die nicht standardmäßig in der Rails-Distribution enthalten sind.

Schritt 3 - Hände schmutzig machen

Der Zweck dieses Tutorials besteht nicht darin, eine Anwendung zu erstellen, wir werden jedoch noch ein wenig programmieren. Erstellen Sie zunächst einen Controller mit dem Namen "Artikel": (Stellen Sie sicher, dass Sie sich im Stammverzeichnis der Rails-Anwendung befinden.)

Skriptartikel generieren

Öffnen Sie nun die Datei und Sie sollten Folgendes sehen:

Klasse ArticlesController < ApplicationController end 

Dieser Code besagt lediglich, dass wir eine neue Klasse mit dem Namen ArticlesController definieren, die von einer anderen Klasse mit dem Namen ApplicationController erbt. Jetzt erstellen wir eine Aktion (als Methode bezeichnet, die strikt in Ruby genannt wird), den Namensindex. Wenn Sie also zu http: // localhost: 3000 / articles / gehen, wird etwas angezeigt. Ändern Sie Ihren Code so, dass er wie folgt aussieht:

Klasse ArticlesController < ApplicationController def index end end

Nun, da wir eine Aktion haben, gehen Sie in den App / Views-Ordner. Wir erstellen eine Ansicht. Wenn ein Benutzer diese URL anfordert, sehen sie tatsächlich etwas. Möglicherweise haben Sie bemerkt, dass sich in den hier genannten Artikeln ein neuer Ordner befindet. Dieser Ordner wurde erstellt, als der Controller generiert wurde. Erstellen Sie also eine neue Datei mit dem Namen index.html.erb im Artikelordner. Sie können nach der Endung fragen, die HTML-Datei bezieht sich auf den Dateityp, und die erb verweist auf eingebettete Ruby-Dateien als Template-Engine. Ich persönlich bevorzuge rhtml, da es sich um ein einzelnes Ende handelt, das jedoch in Rails 3, das voraussichtlich in diesem Sommer bei RailsConf erscheinen soll, abgeschrieben wird. Fügen Sie dies in Ihre neue Datei ein:

Es ist jetzt Uhr <%= Time.now %>

Die & lt% =%> -Tags können Sie faszinieren. Dieses Tag ist so gedacht, dass Ruby die Ergebnisse des beiliegenden Ruby-Codes ausgibt. Dieser Code gibt also jetzt die Uhrzeit aus. Das andere Tag, das Sie in Rails verwenden werden, ist einfach <%- -%>. Dieses Tag ist für Ruby-Code gedacht, der eigentlich nichts ausgibt, beispielsweise wenn Elemente in einem Array wiederholt werden.

Jetzt erstellen wir ein Layout, um diesen Text schön zu gestalten. Erstellen Sie daher eine Datei mit dem Namen application.html.erb im Verzeichnis views / layouts mit folgendem Inhalt:

   <%= h(@title) %> <%= stylesheet_link_tag 'application' %> <%= javascript_include_tag 'prototype' %> <%= yield(:head) %>   
<%- flash.each do |name, msg| -%> <%= content_tag :div, msg, :id => "flash _ # name"%> <%- end -%> <%= yield %>

Bevor ich den Code erkläre, möchte ich, dass Sie wissen, warum wir die Datei application.html.erb benannt haben. Rails lädt dieses Layout jedes Mal automatisch, sofern nicht anders angegeben. Wenn Sie dieses Layout "Layout" genannt hätten, müssten Sie Layout: Layout oben auf dem Controller hinzufügen. Dieser Codeblock enthält einige wichtige Hinweise, die Sie beim Entwickeln von Layouts beachten sollten.

  • <%= stylesheet_link_tag 'application' %>: Dieses Tag generiert das CSS-Inclusion-Tag für die CSS-Datei mit dem Namen application.css
  • <%= javascript_include_tag 'prototype' %>: Dieses Tag generiert das Javascript-Inclusion-Tag für die JavaScript-Bibliothek von Prototype. Prototype ist die Standard-JavaScript-Bibliothek, die mit Rails geliefert wird. Sie können auch Folgendes angeben: Standardwerte (nicht in einfache Anführungszeichen) statt nur Prototyp und Rails lädt alle Standardwerte: Alle würden alle Dateien im Ordner public / javascripts laden.
  • <%- flash.each do |name, msg| -%>: Dieser Code und der Code im Block bedeutet, dass für jedes Element im Flash-Array dem Benutzer eine Nachricht angezeigt wird.
  • <%= yield %>: Dadurch werden alle Informationen aus der einzelnen Ansicht und die Vorlage in der Vorlage ausgegeben und an den Benutzer gesendet.

Nun erstellen wir eine schnelle CSS-Datei mit dem Namen application.css in public / stylesheets und fügen Folgendes hinzu:

Körper Hintergrundfarbe: # 111; Schriftfamilie: Verdana, Helvetica, Arial; Schriftgröße: 14px;  #container width: 75%; Marge: 0 auto; Hintergrundfarbe: #FFF; Polsterung: 10px; Grenze: fest 5px # 999; Rand oben: 20px; 

Jetzt haben wir eine sehr einfache Anwendung zum Anzeigen der aktuellen Uhrzeit; hoffentlich sollten Sie mit den Grundlagen von Rails besser vertraut sein.

Schritt 4 - Fertigstellen

Sie denken vielleicht: "Das ist cool und alles, aber wie sehe ich das Endprodukt?" Es gibt einen Terminalbefehl, den Sie in der Basis der Rails-Anwendung ausführen müssen, um den lokalen Entwicklungsserver zu starten. Skript / Server startet den Server, normalerweise an Port 3000. Führen Sie den Befehl aus und rufen Sie den Browser auf http://127.0.0.1:3000/articles auf. Sie sollten Folgendes sehen:

Um den Server zu stoppen, wählen Sie das Terminalfenster und Control-C aus. Dadurch wird der Entwicklungsserver angehalten. Stellen Sie als Hinweis sicher, dass Sie niemals einen Produktionsserver auf diese Weise ausführen.

Es gibt noch eine letzte Sache, die ich Ihnen gerne zeigen möchte. Wie bereits gesagt, verwaltet die Datei config / routes.rb, wohin die Anforderungen gehen. Öffnen Sie die Datei. Wir werden es so machen, wenn Sie auf http://127.0.0.1:3000/ gehen, sehen Sie dasselbe wie zuvor. Suchen Sie die Zeile "# Sie können das Stammverzeichnis Ihrer Site mit map.root weiterleiten lassen. Denken Sie daran, public / index.html zu löschen." Fügen Sie unter diesem Abschnitt Folgendes hinzu:

map.root: controller => "Artikel"

Speichern Sie die Datei und stellen Sie sicher, dass Sie den Webserver neu starten. Sie müssen den Server immer neu starten, wenn Sie ein neues Modell erstellen und einige andere Dateien ändern, die Rails im Arbeitsspeicher speichert, um den Server zu beschleunigen. Stellen Sie sicher, dass Sie public / index.html löschen oder einfach umbenennen. Stellen Sie nun sicher, dass der Server gestartet ist, und gehen Sie zu http://127.0.0.1:3000. Sie sollten dasselbe sehen.

Fazit

Nun sollten Sie sich mit Ruby on Rails ein wenig besser auskennen. Ich habe auch auf einige wirklich großartige Websites verlinkt, auf die ich bei der Entwicklung mit Rails verweisen kann. Viel Spaß beim Programmieren mit Rails!

  • Railscasts von Ryan Bates sind eine erstaunliche Quelle für Video-Tutorials, und Sie können immer etwas Großes erwarten.
  • Die Rails-API ist eine großartige Möglichkeit, weitere Informationen zu einem Thema zu finden, bei dem Sie möglicherweise nicht ganz sicher sind.

Folgen Sie uns auf Twitter für mehr tägliche Webentwicklungsberichte und Artikel.