Logo React.js

Jako, że w dalszym ciągu nie ma wideo z finału "Daj się poznać", a o tym chciałem napisać kolejny post, zdecydowałem się na coś innego. Od około pół roku mam możliwość tworzenia projektu w Vue.js i często słyszałem o nim jako alternatywie dla Reacta. Przyszedł czas by to sprawdzić. I dziś będzie o moich pierwszych wrażeniach odnośnie frameworku od Facebooka.

Sposób, w jaki działają oba frameworki jest bardzo podobny i łatwo było przełączyć myślenie z Vue na Reacta. Vue wydaje mi się nieco „czystszy”. Możemy tam całkowicie oddzielić html od JavaScriptu i korzystać z Vue podobnie jak z Angulara, używając specjalnych atrybutów html. Natomiast React wykorzystuje obiekty JSX, które są mixem HTML-a i JavaScriptu i najwięcej możemy z niego wycisnąć używając go z ES6. Szerzej będę to pisywał w dalszych postach. 😊  

Przykładowy plik Vue:

  
    <template>
    <div class="example">{{ msg }}</div>
</template>

<script>
  export default {
    data () {
      return {
        msg: 'Hello world!'
      }
    }
  }
</script>

<style>
.example {
  color: red;
}
</style>
  

Przykładowy plik React:

  
    import React, { Component } from 'react';

export default class App extends Component {
  render() {
    return (
      <div>
         <p>Hello From React!</p>
      </div>
    );
  }
}
  

Dużym plusem Vue jest Vuex. Przetrzymuje stan aplikacji w jednym centralnym punkcie i wszystkie komponenty mają ułatwiony dostęp do danych, które są ważne dla całej aplikacji. W React.js używa się do tego osobnego modułu redux (a przynajmniej zauważyłem, że tak właśnie jest), spełnia on dokładnie tą samą rolę co Vuex w Vue.

W obu jest również moduł odpowiedzialny za routy. Jest więc wiele podobieństw, ale przecież diabeł tkwi w szczegółach 😊

Ten post jest niejako zapowiedzią tego, co będzie się działo w najbliższym czasie. Planuję napisać wersję mojego bloga w React.js. Przeniosę buildery do sekcji oraz większość logiki na frontend aplikacji. Umbraco będzie mi jedynie służył jako API do danych. Nie wiem jeszcze czy przejdę z całym blogiem na Reacta, ale chcę zobaczyć jak się w nim pisze i podzielić się z wami moimi spostrzeżeniami oraz porównać go z Vue.

Projekt będę oczywiście wrzucał na GitHub i będzie dostępny dla każdego, kto będzie miał ochotę popatrzeć pod tym linkiem:

https://github.com/Haas360/Webdotnet_React

Aktualnie nic tam nie ma, ale będzie już niebawem 😉

W trakcie developmentu utworzę także podstronę na blogu, na którą będę robił deployment Reacta. 
Jak dla mnie, całość jest dość ekscytująca, więc zapraszam niebawem na cykl o React.js poparty przykładem Bloga webdotnet.pl 😊

Data publikacji: 02.07.2017 Ostatnie z kategorii: