Title Text

Warsztaty z Vue.js

Sylwia Laskowska - Senior Software Developer

Krótko o Vue

Elastyczny framework do UI

Powstał w 2014 roku

Twórca: Evan You

Wygodny sposób kodowania oparty o komponenty

Komponenty

Podstawowa cegiełka aplikacji

Jak wygląda komponent?

<template>
	<div>Jakiś kod html</div>
</template>

<script>
import {cosWaznego} from 'jakas-biblioteka';

export default {
	name: "naszKomponent",
    data: {
    	return {
        	jakasZmienna: 'xyz'
        }
    }
    I TAK DALEJ
}
</script>

<style scoped>
    .tu-mozemy-umieszczac {
    	style: specyficzne-dla-naszego-komponentu;
    }
</style>

Metody cyklu życia

beforeCreate

created

beforeMount

mounted

beforeUpdate

updated

beforeDestroy

destroyed

System reaktywności

Czyli jak kontrolować stan komponentu

(czyli jakie fajne opcje daje nam vue ;)

data: stan naszej aplikacji

computed: przeliczone wartości stanu

methods: czyli nasze metody

Vuex - czyli menedżer stanu

Link do repozytorium:

https://github.com/sylwia-lask/trip-planner/