31.08.2018. od 9 do 17h, zajedno s kolegama, sudjelovao sam na radionici “Od backenda do frontenda uz AWS i Vue.js” koju su održali Damjan Namjesnik i Kornelije Sajler.
Iako je već dvije godine stalna lokacija konferencije Pampas, development radionice održane su na dobro poznatoj lokaciji BIOS-a.
Opis radionice:
Na treningu ćemo se upoznati s nekoliko relativno novih i “trendy” tehnologija kroz razvoj jedne jednostavnije aplikacije.
Počevši od prikaza arhitekture i osnovnih funkcija backenda, pa sve do dizajniranja frontenda, pokazat ćemo što je to serverless, aws, vuejs, ssr, continuous deployment
i još par buzzworda koji se često spominju u zadnje vrijeme.Iako će fokus biti na određenim tehnologijama, spomenut ćemo usput i alternative i prokomentirati naš odabir.
Osim slušanja, od polaznika će se očekivati i rješavanje nekoliko laganijih zadataka kako ne bi sve završilo samo na teoriji.Potrebno predznanje:
Predavanje je koncipirano da ga mogu pratiti svi – od junior developera koji žele vidjeti razvoj jedne jednostavnije aplikacije, do eksperata koji žele vidjeti primjere raznolikih tehnologija.
Osnove HTML-a i Javascripta su poželjne za razumijevanje primjera i rješavanje zadataka.Priprema polaznika:
– Ponijeti laptop (barem 1 laptop na 3 osobe) i instalirat neki moderan browser
– Registrirati se na AWS Free Tier https://aws.amazon.com/free/
Što se moglo naučiti
Iako primarno radim s Angularom htio sam čuti, vidjeti i probati nešto novo.
Bilo je dovoljno svega 15ak minuta od instalacije Vue.js-a tj. Vue.js CLI-a na PC do izrade jednostavne SPA (Single-page application) aplikacije.
1 2 3 4 5 |
$ npm install -g vue $ npm install -g @vue/cli $ vue init webpack kulendayz $ cd kulendayz $ npm run dev |
Što se koda tiče izgleda ovako:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
<template> <div class="hello"> <h1 :class="{'novaboja': checked}">{{ naslov }}</h1> <input type="checkbox" id="checkbox" v-model="checked" v-on:click="counter += 1, contracounter -= 1" :disabled="counter == 10"> <label for="checkbox">{{ checked }}</label> <p v-if="checked">Čekirano</p> <p v-else>Odčekirano</p> <p>{{ counter }} : {{ contracounter }}</p> <h2 v-on:mouseover="mouseOver" v-if="counter == 10" :class="{'novaboja': !checked}">"Hej majstore! Previše klikaš!"</h2> </div> </template> <script> export default { name: 'HelloWorld', data () { return { naslov: 'Od backenda do frontenda uz AWS i Vue.js', checked: false, counter: 0, contracounter: 10 } }, methods: { mouseOver: function(){ this.counter = 0; this.contracounter = 10; } } } </script> <!-- Add "scoped" attribute to limit CSS to this component only --> <style scoped> h1, h2 { font-weight: normal; } .novaboja{ color: red; } </style> |
No, prije svega toga trebalo je proći uvod u AWS tj. isprobati kako radi AWS Lambda. Na taj se način kroz praktičan primjer moglo vidjeti što zapravo znači ‘Serverless computing‘.
1 2 3 4 5 6 |
# Installing the serverless cli $ npm install -g serverless # Updating serverless from a previous version of serverless $ npm install -g serverless # Login to the serverless platform (optional) $ serverless login |
Zaključak
U trenutcima kada bi sudionici radionice neformalno razgovarali moglo se zaključiti da svaki framework ima i dobre i loše strane tj. da zapravo rješavaju iste probleme na različite načine.
U svakom slučaju vrijeme je brzo prošlo i moglo se saznati nešto novo, a vjerujem da je i kolegama sudjelovanje na radionici, iako novo, bilo zanimljivo iskustvo i da će u budućnosti nastavljati posjećivati ovu i druge IT konferencije.