Vue.js für Angular Entwickler

Ich habe bisher mehr mit Angular als mit Vue.js gearbeitet. Für ein kleines Projekt wollte ich aber lieber Vue.js (aufgrund der geringeren Größe) verwenden.

Dabei sind mir ein paar Fragen in den Sinn gekommen, die ich hier in Form von einem kleinen Cheatsheet auch für andere Angular Entwickler festhalten möchte.

Grundsätzlicher Aufbau

Vue.js und Angular sind vom grundsätzlichen Aufbau nicht so verschieden. Vue.js hat sich ja auch bei der Erstellung von Angular.js (welches grundsätzlich anders als Angular v2+ aufgebaut ist) inspirieren lassen und wurde von einem ehemaligen Google-Entwicker gestartet.

Bei beiden Projekten gibt es Components, welche aus einem HTML, CSS und JavaScript (oder TypeScript) bestehen. Diese Components kann man entweder in einer Datei (HTML und CSS inline) oder in getrennten Dateien erstellen.

TypeScript und class-style Components

Der gemeine Angular-Entwickler ist TypeScript mit schönen Decorators gewohnt. Wenn er also das Standard-Vue.js einrichtet (JavaScript ohne Decorators) ist er erst mal geschockt. Das muss aber nicht sein!

Vue.js unterstützt auch TypeScript: https://vuejs.org/v2/guide/typescript.html und mit der https://github.com/vuejs/vue-class-component sieht eine Vue.js Component fast wie eine Angular-Component aus!

Dependency Injection

Gibt es in Vue.js auch: https://vuejs.org/v2/guide/components-edge-cases.html#Dependency-Injection

RxJS

Auch hier muss der gewohnte Angular-Liebhaber auf nichts Neues setzten: https://github.com/vuejs/vue-rx

Material Design

https://vuetifyjs.com/en/ ist quasi das äquivalent für Angular Material.

Fazit

Gerade über die letzten Jahre sind viele Standard-Features von Angular auch zu Vue.js gekommen und man muss sich nicht einmal großartig umgewöhnen, wenn man mal statt Angular Vue.js in einem neuen Projekt verwenden will.

Kommentare

Sie können Ihr Fediverse-Konto (z. B. Mastodon und viele andere) verwenden, um auf diesen Beitrag zu antworten.