Architektura Flux i React.js

Kod: arch-react
Kategoria: Architektura
Forma: 40% wykłady / 60% warsztaty
Czas trwania: 3 dni
Grupa docelowa: architekci
Logistyka: W siedzibie klienta lub w innym dowolnym miejscu.
Data i dokładny zakres do ustalenia podczas analizy przed-szkoleniowej.

Celem szkolenia jest nabycie konkretnych umiejętności projektowania aplikacji po stronie klienta, których złożoność odpowiada realnym problemom typowych projektów.

Szkolenie odpowiada na pytania: jaką strukturę i porządek wyższego rzędu powinna mieć aplikacja, która będzie żyć kilka lat i która ma być testowalna oraz relatywnie łatwa w utrzymaniu.

Wyróżniki szkolenia

  • Nastawienie na testowalność
  • Całościowe podejście do architektury
  • Najlepsze praktyki bazujące na doświadczeniu trenera

Program Szkolenia

Program jest ramą w jakiej możemy się poruszać merytorycznie - program dla konkretnego szkolenia dedykowanego ustalamy z grupą na podstawie analizy przed-szkoleniowej.

  1. React
    1. Why React, what problems does it solve
    2. React philosophy
      1. Re-rendering whole page
      2. Shadow DOM
      3. Immutability
    3. Components
      1. Component basics
      2. Component composition
      3. Passing data between components
      4. Keeping and modifying state
      5. Inter-component communication
      6. JSX tags
      7. Functional stateless components
      8. Component lifecycle
      9. Integration with non react libraries
      10. Mixins
      11. Higher order components
    4. User interaction
      1. Event handlers
      2. Managed unmanaged components
      3. Forms and inputs
    5. External libraries
      1. Routing
      2. Component libraries
      3. Internationalization
    6. Unit testing
      1. How to unit test components
      2. Making components easy to test
      3. Using mocks
      4. Using Jest for testing
      5. Using Jasmine/Karma for testing
    7. Code coverage
      1. UI testing
      2. How to test components using Selenium
      3. Selenium setup
      4. Understanding asynchronous Selenium tests
      5. How to create Selenium tests so UI changes won’t break them
    8. Best practices
  2. Flux
    1. What is Flux app architecture
    2. How data flows in Flux application
    3. Keeping and changing application state
    4. Immutability in application state
      1. Solutions
      2. Performance implications
    5. Asynchronous data loads and Flux
    6. Actions and events
    7. Testing Flux components
    8. Best practices
  3. Environment and process:
    1. Project setup
      1. How to structure project
      2. Where to keep tests
    2. Tools
      1. Bundlers
      2. Transpilers
      3. Test runners
      4. Production and development builds


Pobierz program w formacie PDF

Trenerzy

Poznaj ekspertów, którzy mogą poprowadzić Twoje szkolenie.

Materiały związane ze szkoleniem

Idea renesansowej pracowni - Bottegi zakłada nieustanną pracę jej członków i dzielenie się jej wynikami.

  • Looking for the Holy Grail of Mobile Web Performance
    KATEGORIE: JavaScript

    W świecie mobilnym Istnieje przeświadczenie, że jedynie aplikacje natywne są w stanie sprostać oczekiwaniom użytkowników. Wraz z pojawieniem się Progresywnych Aplikacji Webowych, które mają przenieść na platformę webową wiele cech zarezerwowanych dotąd tylko dla rozwiązań natywnych, oczekiwania dotyczące wydajności są silniejsze niż kiedykolwiek wcześniej. Czy Web jest w stanie im sprostać?

    Autor Bottega:

    Adam Bar

  • JSON taki albo owaki... czyli kontrolowanie struktur z JSON Schema
    KATEGORIE: JavaScript

    Slides

    JSON jest najpopularniejszym formatem definiowania/wymiany danych w sieci. Jest elastyczny niczym XML oraz zwięzły, jak to tylko możliwe. Nie mniej, rozwiązłość strukturalna JSONów powoduje utratę kontroli nad tym, jakie dane są przechowywane. Jeśli chcesz kontrolować, co może być przechowywane w formacie JSON, zerknijmy na JSON Schema.

    Autor Bottega:

    Tomasz Ducin

  • 5 Architectures of Asynchronous JavaScript
    KATEGORIE: Architektura

    Slides

    In this talk we'll discuss 5 alternative approaches to handle async operations: callbacks, events, promises, coroutines and reactive streams. None of them is either legacy or a silver bullet - a good dev needs to pick the right tool for the job.

    However, in order to understand them, we must step back to fundamentals all these rely on: the mechanics of event loop and run to completion rule, as well as learn to distinguish between sync and async flow. Then we proceed to design patterns built on top of each of the 5 approaches, discussing their strengths and limitations. Funfacts, such as famous Promise.race() included!

    Come and listen!

  • Enterprise Interface Architecture: JSON Schema
    KATEGORIE: Architektura

    Slides

    JSON is the most widely used data exchange/definition language in the web. It's as flexible as XML and as concise as possible. However, the structure flexibility of JSONs comes with a price of losing control of what data is being stored. If you want to have your JSON under control, let's dive into JSON Schema. It made my work easier, hope it makes yours too!

  • Enterprise Interface Architecture: Seeking Scalable Design
    KATEGORIE: Architektura

    Slides

    Single-Page App architecture is still being adapted into huge enterprise systems. Each design mistake costs a lot and is very difficult to refactor, if possible at all. The good and bad parts of growing JavaScript code.

  • Backend-less Development Revisited
    KATEGORIE: Architektura

    Slides

    “It’s obvious that SPA interfaces rely on RESTful APIs”. But does it have to be like this always? Tight-coupling between interfaces and APIs result in great development issues. Backend-less development is an emerging approach of decoupling the two sides, enabling them to be developed independently.

    The costs and the benefits of mocking the entire API. The three possible architectural approaches in doing so. Simulating business logic in mocks using plain JavaScript and JSONs. Mock engine Examples in Angular.js and sinon.js. The technical and business aspects of separating frontend and backend - these are the topics I will cover, basing on my banking software development experience.

    Mock your API and make your frontend truly independent!

Zapytaj o szkolenie

Imię i nazwisko:
Firma:
E-mail:
Nr tel:
Temat:
Wiadomość:

Jeżeli preferujesz osobisty kontakt to zawsze możesz zadzwonić.

Iwona Sobótka

Koordynatorka szkoleń


Wyrażam zgodę na przetwarzania danych osobowych zgodnie z ustawą o ochronie danych osobowych w związku z wysłaniem zapytania przez formularz kontaktowy.

Podanie danych jest dobrowolne ale niezbędne do przetworzenia zapytania. Zastałem/am poinformowany/na, że przysługuje mi prawo dostępu do swoich danych, możliwości ich poprawienia, żądania zaprzestania ich przetwarzania.

Administratorem danych osobowych jest Bottega IT Minds, ul. Jana Sawy 2, 20-632 Lublin.


Klauzula informacyjna