+31 (0) 53 30 33 600

Frontend Developer Love Conference

Frontend Developer Love Conference

Op 15 en 16 februari vond de Frontend Developer Love Conference plaats in het Theater Amsterdam. Tijdens deze twee dagen waren er meerdere inspirerende sprekers die verhalen vertelden over verschillende Javascript / Frontend case studies. Ook enkele collega’s van ons waren hierbij aanwezig. Ceryl vertelt hieronder graag meer over zijn ervaringen tijdens deze dagen!

“De eerste dag was een dag met vele verschillende verhalen over de diverse grote Frontend frameworks, waaronder Angular, React, Vue.JS en webcomponents. Daarnaast waren er verhalen over de verschillende technieken die binnen deze frameworks gebruikt (kunnen) worden.

Animating Vue: How capable and elegant is Vue.JS in terms of animation
Sarah Drasner vertelde een interessant verhaal over hoe je met Vue.JS gebruik kan maken van animaties om overgangen en transities in je applicatie soepeler te laten verlopen. Een mooi voorbeeld dat ze gaf was een kaart waarop een marker staat. Deze kun je aanklikken om vervolgens vloeiend te transformeren in een dialoog met daarop een aantal invoervelden om je te kunnen inschrijven. Wanneer je deze velden hebt ingevuld en op submit klikt, veranderen de invoervelden in een laad indicatie. Deze transformeren vervolgens in een bericht dat je succesvol bent aangemeld.

Hiermee liet ze zien dat, wanneer je de overgangen in je applicatie vloeiender laat verlopen, dit een veel prettigere ervaring oplevert voor je gebruikers.

Build progressive web apps with Angular
De tweede spreker waar ik ben geweest was Simona Cotin. Zij vertelde een verhaal over het ontwikkelen van progressieve webapplicaties, waarbij de focus ligt op de betrouwbaarheid, snelheid en de immersie van de gebruikservaring. Hierbij werd een webapplicatie gebruikt welke vervolgens stap voor stap werd getransformeerd in een progressieve webapplicatie.

Als eerste werd er een Manifest json bestand toegevoegd, dit diende voor de installatie van de applicatie.
De tweede stap betrof het toevoegen van service workers, zodat data ook beschikbaar is wanneer er bijvoorbeeld geen netwerkverbinding is, middels het gebruik van caching. Hierdoor kan er ook offline gebruik worden gemaakt van de desbetreffende applicatie.
Als laatste stap werd de performance van de applicatie getest met Lighthouse, een Chrome browser extensie. Daarna werden enkele stappen doorlopen om de performance in de applicatie te verbeteren.

Start using Vue.JS like JQuery
Alexandre & Sébastien Chopin gingen dieper in op een webapplicatie JQuery, welke middels een live demo werd omgezet in een Vue.JS applicatie. Het leuke van deze presentatie was om te zien hoe verschillende grote stukken JQuery code werden vervangen door enkele regels Vue.JS code.

De conclusie die je uit deze presentatie kon trekken was dat JQuery niet meer van deze tijd is en dat de hedendaagse frameworks dezelfde problemen veel gemakkelijker kunnen oplossen met minder code. Daarbij heb ik door deze presentatie ook interesse gekregen in het gebruiken van Vue.JS voor een eigen project.

Automating boring Programming Tasks with the Angular CLI and Schematics
Manfred Steyer is een betreffelijk grote naam in de Angular community. Hij ging dieper in op de geavanceerde technieken binnen Angular. Een nieuwe ontwikkeling binnen Angular is het gebruiken van schematics. Dit kan worden gebruikt voor het opzetten van een applicatie of onderdelen hiervan, ook wel scaffolding genoemd. Deze techniek wordt onder andere al gebruikt in NPM en Angular-CLI. Nu kan het ook gebruikt worden om bepaalde onderdelen, bijvoorbeeld componenten, op te zetten. Een voorbeeld hiervan is het opzetten van een menu item component. Een component die vaak meer dan één keer voorkomt in een applicatie.

Met een schematic kun je een template van dit menu item maken, welke je vervolgens kan gebruiken om meerdere menu items met bepaalde andere variabelen aan te maken, zonder dat je dus elk menu item zelf opnieuw hoeft op te zetten. Dit zou een erg handige techniek kunnen zijn wanneer je van een bepaalde component verwacht dat je deze nog veel vaker zal gaan maken met een andere implementatie.

Manfred gaf de tip om een bestaande template aan te passen naar jouw wensen, om zo een beter gevoel te krijgen van hoe een schematic voor jou nuttig kan zijn. Het gebruik van schematics kan namelijk nogal complex zijn wanneer je hier voor het eerst mee werkt.

Gouda, Edam, or Maasdammer
Als afsluiter van deze lange, maar zeer informatieve, dag was er een presentatie over kaas. Jen gebruikte kazen om drie verschillende technieken te demonstreren voor het gebruik van mobiele apps: React Native, Ionic en als laatste NativeScript. Een helder en duidelijk verhaal over hoe je je app voor mobiel beschikbaar kan maken. Verfrissend was het ook dat deze presentatie met humor werd gebracht en niet zo technisch was in vergelijking met de andere presentaties.

Dag 2: VueJS Amsterdam
VueJS Amsterdam was de grootste Vue.JS conference ter wereld. Op deze tweede dag van The Frontend Developer Love Conference kwamen verschillende sprekers verhalen vertellen over Vue.JS, een populair Javascript Frontend framework.

The past, present and future of Vue.JS
Evam You, de bedenker van Vue.JS, opende deze dag op een mooie manier. Hij beschreef in zijn verhaal de huidige features van Vue.JS en features die in de nabije toekomst er aan zullen komen. Hij gaf tevens een live demo van het opzetten van een nieuwe Vue.JS project middels Vue-CLI. Een erg duidelijke uitleg over hoe je een Vue.JS project kan starten en welke mogelijkheden je daarvoor standaard tot je beschikking hebt.

Building reusable UI components in Vue
Vervolgens was er een presentatie van Plamen over hoe je UI-componenten opbouwt (en daarbij hergebruik in gedachten houden). Voorbeelden hiervan waren een tekstinvoerveld, radiokeuzeveld of dropdown. Hier werd vervolgens verder op ingegaan met complexere componenten en het hergebruik hiervan. Het verhaal op zich was niet erg vernieuwend, aangezien de meeste hedendaagse Frontend frameworks gebruik maken van componenten en herbruikbaarheid hiervan wordt ook aangemoedigd. Daarentegen was het wel interessant te zien hoe zijn kijk op dit probleem is.

Moving from Angular (v5+) to Vue
Een uitgebreid verhaal, van een Google developer expert, over het overstappen op Vue.JS wanneer je van Angular komt. Mede omdat ik voornamelijk met Angular werk, vond ik dit een erg interessant verhaal. Hij liep alle hoofdpunten van beide frameworks langs en beschreef alle verschillen tussen de twee.
Een voorbeeld is het verschil in template syntax, zoals hieronder in de afbeelding beschreven.


Vue Development in CodeSandbox
De laatste presentatie betrof een verhaal van de totstandkoming van CodeSandbox mede ontwikkeld door Ives. Codesandbox is een online code editor voor het ontwikkelen van webapplicaties. Het biedt onder andere ondersteuning voor het ontwikkelen van React, Vue.JS en Angular webapplicaties. Hiermee kun je gelijktijdig code schrijven en het resultaat daarvan direct bekijken.

Al met al waren het twee inspirerende dagen, waarin ik veel informatie heb opgedaan en veel nieuwe dingen heb mogen ontdekken!”

Contact

Wil je meer informatie over OVSoftware?
Neem dan contact op.

Werken bij OVSoftware

Wil je meer weten over onze bedrijfscultuur en vacatures?
Bekijk dan onze werken bij pagina

Branches

Wil je meer weten over de branches waarbinnen OVSoftware actief is?
Bekijk de branches.

Referenties & Projecten

Lees hier klantreferenties en door OVSoftware begeleide lopende en afgeronde projecten waar wij trots op zijn.

Over ons

OVSoftware is één van de eerste softwarebedrijven van Nederland.
Lees meer over ons.

Volg ons op