© Spectral-Design/shutterstock.com
Windows Developer
Einstieg in die fabelhafte Welt der Web Components

Native im Web ohne Framework


Aktuell helfen uns viele Frameworks, im Web Komponenten zu entwickeln. Dabei hat jedes Framework seine individuelle Ausprägung, wie der Code zu strukturieren ist, welche Features oder Lifecycle-Methoden die Komponente hat. Wechseln wir von Framework A zu Framework B, müssen wir mitunter einiges Neue lernen und uns auf die Beschaffenheit des neuen Frameworks einlassen. Mit Web Components zieht ein natives Komponentenmodell in den Browser ein. Ist das die Abhilfe? Und damit der Untergang der Frameworks?

Komponenten – ein Wort, das wir Windows-Entwickler seit vielen Jahren kennen und zu schätzen wissen. Auch im Web ist eine Komponente nichts Neues. Damals, zu jQuery-Zeiten, half uns jQuery, UI-Komponenten zu entwickeln. Heute nutzen wir hier Frameworks wie Angular, React oder Vue. Doch was leistet so eine Komponente eigentlich?

Eine Komponente kapselt Funktion in Form von Code, UI-Struktur und UI-Design. Heruntergebrochen auf das Web bedeutet das z. B. Code in Form von JavaScript oder TypeScript, UI-Struktur mit HTML und UI-Design mit CSS. Mit Hilfe dieser Programmier- und Auszeichnungssprachen erhalten wir wiederverwendbare Komponenten, aus denen wir unsere finale Anwendung komponieren. Oftmals besteht eine Anwendung aus vielen kleinen Komponenten. Jede mit einer eigenen, ganz bestimmten Funktion und oft auch einer Schnittstelle nach außen, sodass der Entwickler Daten in die Komponente geben kann, aber auch Daten aus ihr erhält. Wirft man einen Blick auf die drei großen Single Page Application (SPA) Frameworks, Angular, React und Vue, geben alle drei dem Entwickler ein Komponentenmodell an die Hand. Sei es bei Angular via @ Component-Dekorator, bei React via Ableitung von React.Component und bei Vue die Funktion Vue.component(). All das hilft uns, im jeweiligen Framework unsere Business Use Cases in Komponenten zu gießen.

Auch wenn alle drei genannten Frameworks mit dem Komponentenmodell eine Gemeinsamkeit haben, ist die Entwicklung danach grundverschieden. Jedes F...

Windows Developer
Einstieg in die fabelhafte Welt der Web Components

Native im Web ohne Framework

Aktuell helfen uns viele Frameworks, im Web Komponenten zu entwickeln. Dabei hat jedes Framework seine individuelle Ausprägung, wie der Code zu strukturieren ist, welche Features oder Lifecycle-Methoden die Komponente hat. Wechseln wir von Framework A zu Framework B, müssen wir mitunter einiges Neue lernen und uns auf die Beschaffenheit des neuen Frameworks einlassen. Mit Web Components zieht ein natives Komponentenmodell in den Browser ein. Ist das die Abhilfe? Und damit der Untergang der Frameworks?

Manuel Rauber


Aktuell helfen uns viele Frameworks, im Web Komponenten zu entwickeln. Dabei hat jedes Framework seine individuelle Ausprägung, wie der Code zu strukturieren ist, welche Features oder Lifecycle-Methoden die Komponente hat. Wechseln wir von Framework A zu Framework B, müssen wir mitunter einiges Neue lernen und uns auf die Beschaffenheit des neuen Frameworks einlassen. Mit Web Components zieht ein natives Komponentenmodell in den Browser ein. Ist das die Abhilfe? Und damit der Untergang der Frameworks?

Komponenten – ein Wort, das wir Windows-Entwickler seit vielen Jahren kennen und zu schätzen wissen. Auch im Web ist eine Komponente nichts Neues. Damals, zu jQuery-Zeiten, half uns jQuery, UI-Komponenten zu entwickeln. Heute nutzen wir hier Frameworks wie Angular, React oder Vue. Doch was leistet so eine Komponente eigentlich?

Eine Komponente kapselt Funktion in Form von Code, UI-Struktur und UI-Design. Heruntergebrochen auf das Web bedeutet das z. B. Code in Form von JavaScript oder TypeScript, UI-Struktur mit HTML und UI-Design mit CSS. Mit Hilfe dieser Programmier- und Auszeichnungssprachen erhalten wir wiederverwendbare Komponenten, aus denen wir unsere finale Anwendung komponieren. Oftmals besteht eine Anwendung aus vielen kleinen Komponenten. Jede mit einer eigenen, ganz bestimmten Funktion und oft auch einer Schnittstelle nach außen, sodass der Entwickler Daten in die Komponente geben kann, aber auch Daten aus ihr erhält. Wirft man einen Blick auf die drei großen Single Page Application (SPA) Frameworks, Angular, React und Vue, geben alle drei dem Entwickler ein Komponentenmodell an die Hand. Sei es bei Angular via @ Component-Dekorator, bei React via Ableitung von React.Component und bei Vue die Funktion Vue.component(). All das hilft uns, im jeweiligen Framework unsere Business Use Cases in Komponenten zu gießen.

Auch wenn alle drei genannten Frameworks mit dem Komponentenmodell eine Gemeinsamkeit haben, ist die Entwicklung danach grundverschieden. Jedes F...

Angebote für Teams

Für Firmen haben wir individuelle Teamlizenzen. Wir erstellen Ihnen gerne ein passendes Angebot.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang