Komponenty w React i Angular

Każdy system ma inne podejście do tworzenia komponentów i obydwa mają swoje zalety i wady.

Twórcy języków programowania starają się oddzielić widok od kodu, aby ułatwić współdzielenie projektu. Z drugiej strony Facebook uważał, że utrzymanie wszystkiego razem jest bardziej właściwym podejściem do rozwoju komponentowego.

 

Zwolennicy React mają ambiwalentną wizję takiego podejścia. Niektórzy z nich próbują ograniczyć JSX do minimum. Inni programiści aktywnie korzystają z JSX, nie widząc powodów aby go odrzucać. Składnia JSX pozwala opracowywać i dodawać komponenty w prosty sposób, napotykając jednak na nieistotne choć uciążliwe problemy zarówno przy tworzeniu szablonów HTML, jak i dalszej integracji z React. Mniej lub bardziej poprawne rozwiązanie w przypadku projektu opartego na React polega, więc na natychmiastowej integracji części logicznej z wizualną.

 

Angular stosuje bardziej tradycyjne podejście, gdzie logika jest oddzielona od widoku. Rozwiązanie Angulara jest oparte na tzw. two-way data binding, a także na własnym silniku szablonów, co pozwala na łatwe zintegrowanie szablonu HTML z komponentami logicznymi.

 

Rzućmy okiem na kilka przykładów z Angular i React. Tworzenie komponentu w Angular oznacza kilka plików:

 

component.ts

 

component.html

 

W podanym przykładzie komponent wyświetla „Hello world”. Praca z React jest prostsza: wystarczy jeden plik, aby utworzyć nowy komponent.

 

component.js

 

Każdy system ma inne podejście do tworzenia komponentów i obydwa mają swoje zalety i wady. Każdy programista musi zdecydować, które podejście jest bardziej odpowiednie dla rozwoju projektu.

 

Autor: Dorota Zielińska


Opublikowano:

Mentax na Facebook'u