Meetup #7, Laravel intro, og design/GUI
-
Upload
morten-bergset -
Category
Data & Analytics
-
view
223 -
download
9
Transcript of Meetup #7, Laravel intro, og design/GUI
Laravel og design/GUI
Meetup #7
En intro til Laravel, ved Morten
Laravel is a simple framework for web application development. It attempts to make writing web applications in PHP as simple as possible.
Taylor Otwell, creator of Laravel:
Motforestillinger mot rammeverk
• Har ikke tid/ork til å lære noe nytt • Det vi har funker... • Oppdateringer? • Sikkerhet? • Vil ha kontrollen • Kanskje vi ikke
kommer helt i mål? • Er det fleksibelt nok? • Produktivitet?
Offisiell dokumentasjon er god!
Men jeg har kanskje lest ett par bøker…
Og Jeffrey Way er fantastisk!
Hva fikk meg til å ta i bruk rammeverk?
Jeg tenker at når “alle” andre bruker det, så burde kanskje
jeg også?• PHP, jQuery, Bootstrap er alle teknologier
jeg har tatt i bruk fordi “alle” bruker det.Men man trenger ikke alltid gjøre som vennene…
Andre programmerer
• Lettere for andre å akseptere de valg som er tatt når man følger et rammeverk
• Lettere å få andre til å overta/hjelpe å vedlikeholde systemet
Ikke så jalla…
• Hjemmesnekra høres så jalla ut • Et rammeverk høres så proft ut • Det handler om trygghet og følelser…
Man får mye gratis
• Alle rammeverk har kjekke features, hjelpe funksjoner som gjør utviklingen raskere.
• Cross-site request forgery blir håndter av Laravel automatisk med CSRF token (noen som husker min OWASP top 10 presentasjon?)
• Cross-site scripting (XSS) håndteres default i Laravel
Hvordan er det å ta i bruk Laravel?
• Som å ta i bruk Twitter Bootstrap eller jQuery • Nå virker det for dumt å bruke det…
• Det er som å bytte til Mac • Du må gi litt slipp på kontrollen. Men det
virker, og da trenger du ikke kontrollen… • Det er som en ny bil som har deksel over
motoren men en liten luke til å fylle spylerveske. • Det er endel “magic” shait under panseret…
HVORFOR bruke Laravel". Hvilke fordeler gir det deg som har brukt det.
• Fordelen er mange, jo mer jeg bruker Laravel, jo bedre liker jeg det…
• Eloquent lar meg slippe å skrive SQL i PHP • Blade lar meg bruke PHP kode uten å blande
med html sine hake paranteser, og så har den noen smarte løsninger…
• Struktur i koden, routing, view, controller osv. Det er ryddig og vedlikeholdsvennlig
• Mye dokumentasjon og tips er lett tilgjengelig
Hva jeg liker med Laravel
• Enkel CRUD • Views kan vises, inkluderes, sende som
epost eller bli til en pdf • Terminal kommandoene er enkle og
kraftige • Scheduler gjør det enkelt å sette jobber
til å kjører regelmessig
“Jeg er veldig interessert i å vite om dette kunne vært noe for meg.”
• Det var jeg også… • Jeg så noen videoer på Youtube og klikket
gjennom noen slides fra tidligere presentasjoner. Det så enkelt ut…
• Nå har jeg lagd et relativt stort prosjekt på Laravel, og har nå tenkt å bruke samme rammeverk på en enkel hjemmeside. Hvorfor gå tilbake til en punktert Lada…
Fordel med rammverk
• Struktur på kode • Alltid kjekke libs og
helper-functions • Hjelp med
sikkerheten: XSS, SQL injection, CSRF osv
• Mindre egen kode å vedlikeholde
• Lettere å få hjelp online
• MVC • Pretty URLs • Ikke finn opp hjulet
pånytt...
Mortens tips
• Sett deg i naming conventions før du setter opp databasen og begynner på PHP koden. Mye av magien baserer seg på streng naming convention (det er flott når du begynner nytt prosjekt)
• “The Laravel way”… det meste er tenkt på, og det er lurt å finne ut hvordan gjør man dette i Laravel. Aldri lurt å krangle med et rammeverk (selv om Laravel kan konfigureres mye)
Mange gode rammeverk…
Laravel er mest populært
En Laravel oversikt
Ruby on Rails' ActiveRecord? Well, in the PHP end of the world, Eloquent is its premier implementation.
Relasjoner er enkelt i Laravel
“Routing og restify er alltid artig”
Dynamisk id i url, som enkelt blir sendt videre til controlleren ($id)
Istedet for get, post osv kan man benytte “resource” som har alle CRUD url`er
Nesting/gruppering, her har vi authentisering, alle router inni her vil automatisk kreve loginn
Retur av array blir json :-)
Retur av view kan få med data som flettes inn
Magic shait og code-completion
• Med PhpStorm vil man gjerne ha codecompletion, og det krasjer litt med magic methods etc..
• Laravel 5 IDE Helper Generator, til unnsetning! • https://github.com/barryvdh/laravel-ide-
helper • php artisan ide-helper:generate - facades • php artisan ide-helper:models - models • php artisan ide-helper:meta - meta file
“Det som er spennende er å vite ideelogien bak det, hva får deg til å like/mislike det? Hvorfor Laravel?”
• Laravel er et rammverk på toppen av Symfony komponenter (akkurat slik vi gjør i Profundo).
• Skjule kompleksiteten • Laravel gir deg flere alternative måter å
gjøre ting på, det kommer ann på størrelse etc
• Laravel er brukervennlighet for utviklere “Det er ferdig når du ikke kan ta bort mer”
Whatever gets the job done the quickest and is the most
readable is just fine.
Top Ten Reasons To Use Laravel:
1. Documentation. 2. Laracasts 3. Intuitive Syntax 4. Practical Application
Structure 5. Artisan Code
Generation
6. Out-of-the-box User Model
7. Blade Templating Engine
8. Dependency Injection Made Simple
9. Supporting Products and Packages
10.Innovative Founder
I think Laravel is well positioned
right now because we use over two dozen
popular community
packages to build the framework.
Noen av pakkene som Laravel bruker
• Monolog, logging • Carbon, enkel dato
håndtering • Swiftmailer • Mockery • Phpunit • Doctrine • League/flysystem,
filhåndtering
• Symfony • console • debug • finder • http-foundation • http-kernel • process • routing • translation • var-dumper
Demo, først i slides,
så i PhpStorm…
Sett opp site i Mamp
Eller bruk PHPs innebygde
Nytt i v5.2, lag en kjap auth :-)
Flere db alternativer, bruker sqlite
make:auth gir oss dette
make:auth gav oss enkel registrering
rout:list gir oss alle url`er i løsningen
make:model lager en model-classe i PHP, og -m parametere lager også en migrate fil for å
sette opp en tilhørende databasetabell
Laravel har en enkel
feature for db migrering og rollback
make:controller gir oss en ny kontroller klasse, og —resource gir oss definisjoner av alle CRUD metodene som en god start :-)
FRONTEND/VISUELL DESIGN
av Morten Bergset
HVA UTVIKLERE BØR VITE OM DESIGN OG GUI
• Ja, det må virke, men det er ikke nok…
• Ingen kunder/brukere bryr seg om MVC pattern, regex, API og rammeverk. De bryr seg om det de kan se!
MIN ETTERUTDANNING: JOBBE MED DESIGNERE
Da jeg begynte å jobbe i Netlab så fikk jeg design-sjokk!
Etter å ha jobbet i dagevis med å implementere et Photoshop design, så synes jeg det var ferdig.
Men nei, det var helt forferdelig! Alt var galt, og det var totalt ubrukelig!
Bilde var 2 pixler for høyt og manglet skyggen. Overskriften var 18 og ikke 20 pixler. Og den footeren hadde feil grønnfarge!
OI, SÅ MYE JEG IKKE FORSTOD…
Man kan ha forskjellig oppfatning av hva som er pent, men der er noen prinsipper og sannheter som vi utviklere kan forholde oss til.
Jeg er fremdeles ikke kunstnerisk anlagt, men med litt forståelse blir det mye bedre.
DESIGNER BUZZWORDS• Symmetri
• Grid
• Luft
• Farger og fargesammensetning
• Fonter
• Tyngde i siden
• Dont`t make me think
• Hover effekt
• Call to action
• Konsekvent design (alle lenker, alle overskrifter osv)
• Avvik er kraftig og skal benyttes gjennomtenkt
• Design styrer adferd
GRID GIR STRUKTUR
HOVER EFFEKT ER VIKTIG BÅDE FOR DESIGN OG UX
UTEN SKYGGE
MED SKYGGE
DET ER IKKE LETT FOR ET UTRENT ØYE Å SE DISSE
FORSKJELL…
GOD DESIGN ER INTUITIV
• Logo oppe til høyre
• Menyen er lett å finne
• Piler i menyen indikerer undermeny
• Ikoner for søk og handlevogn er velkjente
AVVIK (HÅNDSKRIFT) ER BLIKKFANG OG STYRER BRUKEREN
CALL TO ACTION
ANBEFALT BOK• Denne bør alle lese!
• Ikke misbruk tiden til brukerene dine
• Man skal få det man forventer når man klikker på noe
• Ting skal være intuitivt
INGEN TVIL OM HVILKE FELT SOM ER PÅKREVD, ELLER HVA SOM SKJER NÅR MAN TRYKKER PÅ
KNAPPEN
HVOR ER MAN?FREMHEVE AKTIVT MENYPUNKT
EVT. BREADCRUMBS
SYMMETRI, LUFT, FONTSTØRRELSER, LIK AVSTAND, KONSEKVENTE FARGER
http://www.goodui.org/evidence/