Prosta architektura aplikacji typu Single Page App

Kod: Arch-simple
Kategoria: Architektura systemów i aplikacji
Forma: 20% wykład / 80% warsztat
Czas trwania: 2 dni
Grupa docelowa: developerzy
architekci
Logistyka: W siedzibie klienta lub w innym dowolnym miejscu.
Data i dokładny zakres do ustalenia podczas analizy przed-szkoleniowej.

Motywem przewodnim tego szkolenia jest “fits in my head” - tworzenie aplikacji typu Single Page App, które mieszczą się w głowie - dają się objąć łatwo i szybko rozumem.

Trzy główne filary na których bazujemy:

  • Architektura inspirowana Elm Architecture: jednokierunkowy przepływ danych, rozdzielenie stanu aplikacji/widoku/logiki oraz myślenie w kategoriach funkcji, a nie komponentów. Będziemy korzystać z minimalistycznych bibliotek np. https://github.com/hyperapp/hyperapp, które mają najwyżej kilkaset linii kodu i które jesteśmy w stanie zrozumieć patrząc na kod źródłowy
  • Budowanie aplikacji wg. filozofii Unixowej - zamiast generować tysiące linii kodu z CLI, krok po kroku automatyzujemy proces budowania za pomocą małych bibliotek, rozwiązując jeden problem naraz. Chcemy rozumieć każdą linijkę kodu, która jest w naszym projekcie.
  • Programowanie w języku zamiast programowania we frameworku - chcemy aby większość naszego kodu była napisana w Vanilla JS. Np. model to zwykły obiekt a nie Backbone.Model.extend(), moduły to ES6 modules a nie angular.module(), a widok to funkcja a nie React.Component.

Wyróżniki szkolenia

  • Szkolenie przeznaczone dla zaawansowanych odbiorców, którzy szukają świeżego podejścia wolnego od inwazyjnych frameworków
  • Budujemy system z prostych i wymienialnych klocków
  • Doświadczony trener

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. Ewolucja architektury frontendowej
    1. DOM spaghetti
    2. Model-View-Presenter (MVP)
    3. Model-View-ViewModel (MVVM)
    4. Elm Architecture
      1. Model scentralizowany w jednym miejscu
      2. Widok jako funkcja stanu
      3. Logika biznesowa
      4. Zdarzenia/Subskrypcje
  2. Budowanie aplikacji
    1. Filozofia Unixowa łączenia małych narzędzi
    2. npm jako narzędzie do budowania
    3. Transpilacja (Babel)
    4. Module bundling (browserify)
    5. Watch mode (watchify)
  3. Wzorce projektowe i receptury
    1. Zapisywanie stanu w local storage i wzorzec Repository
    2. Komunikacja klient-serwer i wzorzec Gateway
    3. Wzorzec Factory
    4. Dependency Injection
    5. History pushState i routing po stronie przeglądarki
    6. Notyfikacje z Server-Sent Events jako lekka alternatywa dla WebSockets
  4. Optymalizacja wydajności
    1. Optymalizacje w czasie ładowania i w czasie działania aplikacji
    2. Virtual DOM, listy z kluczami
    3. Minifikacja
    4. Wizualizacja zawartości paczki
  5. Testy
    1. Wybór narzędzi do testów: mocha/tape/jest
    2. Testowanie logiki biznesowej
    3. Testowanie widoku z użyciem jsdom
    4. Snapshot testing
    5. Symulowanie zdarzeń
  6. Styl kodowania
    1. Clean code
    2. Pure functions, closures, higher order functions
    3. Thisless: programowanie bez this, new, .prototype i class
    4. Podział kodu na moduły
    5. Wydzielanie generycznego kodu jako pluginy
    6. Myślenie w kategoriach funkcji zamiast komponentów


Pobierz program w formacie PDF

Trenerzy

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

Mateusz Kwaśniewski

trener

Nie chcę wypuszczać lepszych szkoleń. Chcę wypuszczać lepszych programistów.

Materiały związane ze szkoleniem

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

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