FMK2017 - Webdevelopment mit Rails by Stefan Husch qutic.com

8. FileMaker Konferenz | Salzburg | 12.-14. Oktober 2017
www.ﬁlemaker-konferenz.com
Mit Open Source Software eine Webapplikation erstellen
Stefan Husch
s.husch@qutic.com
qutic development
Consulting, Development, Hosting
Open Source - eine FileMaker Alternative?

Open Source - eine FileMaker Alternative? | Stefan Husch
Stefan Husch
• Inhaber qutic development
• Consulting, Development, Hosting
• Security- & Privacy-Focus
• FileMaker-Entwickler 1993-2006
• Webentwickler 2005-heute
• Vorträge zum Thema Server-Orchestration,
Virtualisierung, Hochverfügbarkeit, Security

Wahl des richtigen Tools

FileMaker: Vor- & Nachteile
+ Graphische Oberﬂäche
+ Geringe Lernkurve
+ Schnelles Prototyping
+ Das FileMaker Magazin Forum
- Graphische Oberﬂäche
- Maus-Arm
- Lizenzkosten
- Keine Entwickler-Leitlinien
- Schwer zu erweitern (Plugins)
- Schlecht zu skalieren
- Schlecht zu dokumentieren
(SourceCode)
- Keine automatisierten Tests

Rails: Vor- & Nachteile
+ Open Source
+ Textbasierte Entwicklung
+ Versionskontrolle
+ Schnelle App-Entwicklung
+ Entwickler-Leitlinien
+ Flexibel
+ Beliebig zu skalieren
+ Gut zu dokumentieren
+ Automatisierte Tests
+ Endlose Möglichkeiten
- Steilere Lernkurve
- Endlose Möglichkeiten
- Dokumentation in Englisch

Entwicklungskosten
Web == FMP *
*große Projekte: Web < FMP

Warum ein Webframework?
• Datenbankzugriff (Object-relational mapping, ORM)
• Templatesysteme (View)
• Scaffolding (Gerüstbau für Controller, Model, View)
• Routing (URL-Struktur)
• Role Based User Authentification (Wer darf was)
• Lokalisierung (Mehrsprachigkeit)
• Sicherheitsfunktionen (SQL-Injection, XSS, etc.)

Warum Rails?
• Ausgereiftes Webframework (seit 2005, Vorbild für Andere)
• Objektorientiert
• Don’t repeat yourself
• Konvention vor Konﬁguration
• Einfach zu lernen
• Sehr große Community
• Vielfalt an vorhandenen Bibliotheken (gems)

Endlose Möglichkeiten
• Welche Datenbank wähle ich?
PostgreSQL, MySQL, SQLite, MonoDB, Oracle, etc.
• Welche Template-Engine wähle ich?
Haml, ERB, etc.
• Welches CSS-Framework wähle ich?
Sass, SCSS, Less, Stylus, etc.
• Welche Background-Queue wähle ich?
Sidekiq, DelayedJob, Resque, RabbitMQ, etc.

FileMaker Starter Solutions

Keep it simple
• Ziel: Intranet-Applikation für maximal 250 Benutzer
• Datenbank: SQLite
• Template-Engine: -
• CSS-Framework: -
• Background-Queue: -

Entwicklungs-Umgebung
• Ruby (Programmiersprache)
• Rails (Webframework)
• bundler (Installations-Automatisierung für Ruby Bibliotheken)
• rvm (Ruby Version Manager)
• git (Versionskontrollsystem)
• TextMate (Textverarbeitung, macOS)
• SQLite

„Textbasierte Entwicklung“
$
$
$
$
$
$ # Das Terminal ist Dein Freund :)
$
$
$
$
$

Ruby und Rails installieren
$ curl -sSL https://get.rvm.io | bash -s head
$ rvm install ruby-2.4.2
$ gem install bundler
$ echo "rvm use ruby-2.4.2@contacts --create"
> .rvmrc
$ source .rvmrc
$ gem install rails

Rails Projekt erstellen
$ rails new contacts -d sqlite3

Rails Projekt ansehen
$ cd contacts
$ m . # öffnet das Projekt in TextMate

Rails Überblick
• Model-View-Controller Architektur (MVC)
• active_record (ORM)
• Klare Projekt-Struktur
• Konﬁguration
• Initializers
• Routes
• Datenbank-Schema
• Datenbank-Migration
• Gemﬁle
• Log

Was ist ActiveAdmin?
• Rails-Erweiterung (Engine)
• Keine Controller und Views nötig (aber möglich)
• Domain-speciﬁc language (DSL)
• Einfache Entwicklung

Und los geht es
$ cat <<EOF >> Gemfile
gem 'activeadmin'
gem 'devise'
EOF
$
$ bundle
$ rails generate active_admin:install
$ rails db:migrate
$ rails db:seed
$
$ git init .
$ git add .
$ git commit -m "initial commit"
$
$ rails server

Browser-Ansicht

Datenbank-Model FileMaker

Datenbank-Model Rails
persons
id
group_id
title
ﬁrst_name
last_name
company
job_title
notes
addresses
id
person_id
type
street
street_addition
city
zip
groups
id
name
contact_types
id
name
contacts
id
person_id
contact_type_id
contact

Modell erstellen
$ rails generate model group
name:string
$
$ rails generate model contact_type
name:string
$
$ rails generate model contact
person:belongs_to
contact_type:belongs_to
contact:string

Modell erstellen
$ rails generate model person
group:belongs_to
title:string
first_name:string
last_name:string
company:string
job_title:string
notes:text

Modell erstellen
$ rails generate model address
person:belongs_to
mode:string
street:string
street_addition:string
city:string
zip:string

ActiveAdmin-Ressourcen erstellen
$ rails generate active_admin:resource Person
$ rails generate active_admin:resource Address
$ rails generate active_admin:resource Group
$ rails generate active_admin:resource ContactType
$ rails generate active_admin:resource Contact

Select-Menu Daten erstellen
$ cat <<EOF >> db/seeds.rb
Group.create!(name: 'Personal')
Group.create!(name: 'Professional')
Group.create!(name: 'Family')
Group.create!(name: 'Friend')
ContactType.create!(name: 'Office Phone')
ContactType.create!(name: 'Mobile Phone')
ContactType.create!(name: 'Personal Phone')
ContactType.create!(name: 'Fax')
ContactType.create!(name: 'Office Email')
ContactType.create!(name: 'Personal Email')
ContactType.create!(name: 'FaceTime')
ContactType.create!(name: 'Twitter')
EOF

Datenbank-Migration
$ rails db:drop
$ rails db:create
$ rails db:migrate
$ rails db:seed
$
$ git add .
$ git commit -m "integrate ActiveAdmin"

Todo
• Comments deaktivieren
• permit_params in allen ActiveAdmin-Resources setzen
• routes.rb: root to: redirect('/admin')
• Addresses und Contacts aus Menü entfernen (menu false)
• Model-Relations erweitern
• ActiveAdmin-Ressourcen anpassen

ActiveAdmin-Ressourcen anpassen
# app/admin/address.rb
ActiveAdmin.register Address do
menu false
permit_params :person_id, :type, :street, :street_addition, :city, :zip
end
# app/admin/contact_type.rb
ActiveAdmin.register ContactType do
permit_params :name
end
# app/admin/contact.rb
ActiveAdmin.register Contact do
menu false
permit_params :person_id, :contact_type_id, :contact
end
# app/admin/group.rb
ActiveAdmin.register Group do
permit_params :name
end

# app/admin/person.rb
ActiveAdmin.register Person do
permit_params :group_id, :title, :first_name, :last_name, :company,
:job_title, :notes,
contacts_attributes: [:id, :contact_type_id, :contact],
addresses_attributes: [:id, :person_id, :mode, :street,
:street_addition, :city, :zip]
show do
attributes_table_for person do
Person.column_names.each do |c|
row c.to_sym
end
end
table_for person.contacts do
column "Type", :contact_type
column "Contact", :contact
end
table_for person.addresses do
column "Mode", :mode
column "Street", :street
column "Addition", :street_addition
column "City", :city
column "Zip", :zip
end
end

form :html => {:multipart => true} do |f|
f.inputs 'Person' do
f.input :group
f.input :title
f.input :first_name
f.input :last_name
f.input :company
f.input :job_title
f.input :notes
f.input :image, as: :file
end
f.inputs do
f.has_many :contacts, allow_destroy: true do |c|
c.input :contact_type
c.input :contact
end
end

f.inputs do
f.has_many :addresses,
allow_destroy: true do |a|
a.input :mode, :as => :select, :collection => [ ['Work','Work'],
['Personal','Personal'] ]
a.input :street
a.input :street_addition
a.input :city
a.input :zip
end
end
f.actions
end
end

Model erweitern
# app/model/person.rb
class Person < ApplicationRecord
belongs_to :group
has_many :contacts
has_many :addresses
accepts_nested_attributes_for :contacts, reject_if: :all_blank, allow_destroy: true
accepts_nested_attributes_for :addresses, reject_if: :all_blank, allow_destroy: true
def name
[title, first_name, last_name].join(" ").strip
end
end

Bild-Upload
$ cat <<EOF >> Gemfile
gem 'paperclip'
EOF
$
$ bundle
$ rails generate paperclip person image
$
$ # fix migration file
$ sed -i '' -e "s#ActiveRecord::Migration#ActiveRecord::Migration[5.1]#g"
db/migrate/*_add_attachment_image_to_people.rb
$
$ rails db:migrate

Image-Referenz hinzufügen
# app/admin/person.rb
ActiveAdmin.register Person do
permit_params :group_id, :title, :first_name, :last_name, :company, :job_title, :notes,
:image,
contacts_attributes: [:id, :contact_type_id, :contact],
addresses_attributes: [:id, :person_id, :mode, :street,
:street_addition, :city, :zip]
# app/model/person.rb
class Person < ApplicationRecord
has_attached_file :image, styles: { medium: "300x300>",
thumbnail: "100x100>" }
validates_attachment_content_type :image,
:content_type => [ "image/jpg",
"image/jpeg",
"image/png",
"image/gif" ]

?

Links zum Vortrag
• https://speakerdeck.com/qutic
• https://de.wikipedia.org/wiki/Webframework
• http://rubyonrails.org
• https://www.ruby-lang.org/en/
• https://rvm.io
• https://stackoverﬂow.com/questions/15691977/why-start-a-shell-command-
with-a-backslash
• http://bundler.io
• https://gorails.com/setup/windows/10
• http://macromates.com/download
• https://activeadmin.info
• https://activeadmin.info/documentation.html

Weiter lernen
• https://github.com/activeadmin/activeadmin/wiki
• https://gorails.com/episodes/using-activeadmin-to-build-an-admin-ui
• https://spin.atomicobject.com/2016/07/23/ﬁle-upload-active-admin-paperclip/
• https://pragprog.com/book/ruby4/programming-ruby-1-9-2-0
• https://pragprog.com/book/rails51/agile-web-development-with-rails-5-1
• http://railscasts.com

Vortrag und Sprecher
Vielen Dank unseren Sponsoren

FMK2017 - Webdevelopment mit Rails by Stefan Husch qutic.com

Weitere ähnliche Inhalte

Was ist angesagt? (20)

Mehr von Verein FM Konferenz (20)

FMK2017 - Webdevelopment mit Rails by Stefan Husch qutic.com