Vue and VUEX

THE GOOD THE BAD AND THE UGLY

GitLab's use case

GDG Coimbra DEVFEST 2018

@filipalacerda

Filipa Lacerda

GDG Coimbra DEVFEST 2018

Filipa Lacerda

senior CI/CD frontend engineer

GitLab

@filipalacerda

gitlab.com/filipa

github.com/filipalacerda

alligator.io/author/filipa-lacerda

@filipalacerda

GDG Coimbra DEVFEST 2018

Vue and VUEX

THE GOOD THE BAD AND THE UGLY

GitLab's use case

@filipalacerda

GDG Coimbra DEVFEST 2018

wHAT IS GITLAB?

@filipalacerda

GDG Coimbra DEVFEST 2018

390 team members

98 pets

https://about.gitlab.com/team/

@filipalacerda

GDG Coimbra DEVFEST 2018

0 offices

Remote only

47 countries

@filipalacerda

GDG Coimbra DEVFEST 2018

COLLABORATION

RESULTS

EFFICIENCY

DIVERSITY

ITERATION

TRANSPARENCY

Work asynchronously with fully remote workforce

Track outcomes, not hours

Boring solutions win.

We want cultural diversity instead of cultural conformity.

Minimum Viable Change.  If the change is better than the existing solution, ship it.

Everything at GitLab is public by default

@filipalacerda

GDG Coimbra DEVFEST 2018

results
efficiency
iteration

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

THE GOOD

@filipalacerda

GDG Coimbra DEVFEST 2018

🦄     PROGRESSIVE

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

https://gitlab.com/gitlab-org/gitlab-ce/merge_requests/5554

1 month

@filipalacerda

GDG Coimbra DEVFEST 2018

1 month

@iamphill

@dbalexandre

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

rails application

Vue app

Vue app

Vue app

Vue app

Vue app

Vue app

Vue app

Vue app

Vue app

Vue app

Vue app

Vue app

Vue app

Vue app

Vue app

@filipalacerda

GDG Coimbra DEVFEST 2018

THE bad

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

ESLINT-PLUGIN-VUE

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

Vuex

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

but!

https://gitlab.com/gitlab-org/gl-vue-cli

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

https://gitlab-org.gitlab.io/gitlab-ui

@filipalacerda

GDG Coimbra DEVFEST 2018

THE ugly

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

https://codepen.io/leipert/pen/dKjKBx

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

🚀

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

v-if
v-show

VS

🥊

@filipalacerda

https://gitlab.com/gitlab-org/gitlab-ce/issues/48898

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

https://gitlab.com/gitlab-org/gitlab-ce/merge_requests/20448/

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

mapGetters
pure functions

@filipalacerda

GDG Coimbra DEVFEST 2018

EVENT LISTENERS

https://gitlab.com/gitlab-org/gitlab-ce/issues/48789

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

DO WE REGRET the refactors?

@filipalacerda

GDG Coimbra DEVFEST 2018

no.

@filipalacerda

GDG Coimbra DEVFEST 2018

DO WE REGRET chosing vue and vuex?

@filipalacerda

GDG Coimbra DEVFEST 2018

no.

@filipalacerda

GDG Coimbra DEVFEST 2018

@filipalacerda

GDG Coimbra DEVFEST 2018

gl-vue-cli
gitlab-ui
gitlab-svg
graphql

@filipalacerda

GDG Coimbra DEVFEST 2018

EVERYONE CAN CONTRIBUTE

https://gitlab.com/gitlab-org/gitlab-ce/tree/master

@filipalacerda

GDG Coimbra DEVFEST 2018

Thank you!

@filipalacerda

gitlab.com/filipa

github.com/filipalacerda

@filipalacerda

GDG Coimbra DEVFEST 2018

Made with Slides.com