(node.js) web development - prościej

(node.js ) web development

prościej

plan wycieczki• Intro: Jestem przytłoczony. Pomocy!

• 1 - Architektura UI w stylu ROCA

• 2 - Node.js jako Backend for Frontend

• 3 - Dependency Injection w node.js

• 4 - Stabilny klient HTTP do produkcyjnych zastosowań

• 5 - Asynchroniczność: tresura asynchronicznej bestii

• 6 - Styl kodowania: dlaczego jestem gruby od tego JS

• 7 - Infrastruktura Heroku jako kod JS

wersja prelekcji: 4.4.2

2013 2014 2015 2016

{

node

JAVA

efekt Lindy

MAM nowy framework

mój kontekst

publicznie dostępne serwisy informacyjne

Devs

HTML/JS

500kB of JS

HTML+CSS

curl

wget

bot

1. ARCHITEKTURA APLIKACJIResource-Oriented Client Architecture

Resource-Oriented Client Architecture

• A collection of simple recommendations for decent Web application frontends

http://roca-style.org/

http://roca-style.org/

ROCA =

REST (backend) +

Progressive Enhancement (frontend)

REST

2000

article front page zasoby (Resources)

baza danych stan zasobów (State)


reprezentacja (REpresentation)JSON XML HTML

(hypermedia)



reprezentacja (REpresentation)JSON XML HTML

przeglądarka bot wget/curl


Transfer

stan aplikacji/interakcji

Progressive Enhancement

2003

Unobtrusive JS

2002

HTML CSS JS

http://roca-airways.herokuapp.com/

http://roca-airways.herokuapp.com/

czynnik ludzki

wow! ale

data binding

wow uniflow

ale vdom

flux reflux redux

nie ma thisa!

ale FRP

mercury ? ?

Efekt IKEA

stawka w grze (ang. skin in the game)

2. NODE.js w naszym ekosystemie

Wzorzec: Backends For Frontends

Web

Web

Native

strona główna artykuł WebTV quizy


monolit

HTML


HTML

bounded context


bounded context


bounded context

co z UI?


bounded context

Single Page App

BFF

JSON


bounded context

SPA

JSONBFF BFF BFF

monolith

HTML HTML HTML

moja pierwsza aplikacja w node.js

3. dependency injectionstruktura, testowalność i zastępowalność komponentów w

nietrywialnych aplikacjach

require('third-party-module')

require('./mymodule')

Q: jak nadpisać require w testach? A: użyj modułu rewire/proxyquire ja: proszę nie

Q: jak robić DI w node.js? A: ktoś pracuje nad klonem Springa ja: oby nie!

new A(new B(), new C());

a(b(), c());

ale…

expect(this.style.of.assertions).to.not.be.ok;

4. w poszukiwaniu idealnego klienta HTTPgdy request to za mało

mikroserwisy

APIklient

much starrrssuch popular

maaany forks

ponawianie nieudanych

zapytań

APIklient

odpowiedź API

“śpieszmy się kochać odpowiedzi z API, tak szybko odchodzą”

APIklient

5. AsynCHORNICZNOŚĆtresura aynchronicznej bestii

Java —> JS

sync —> async

var article = articleRepository.getById(“ap1234”);

articleRepository.getById('ap1234', function(err, data) { if(err) handleError(err); else processData(data);});

articleRepository.getById('ap1234', function(err, data) { if(err) handleError(err); else processData(data); });

callbacks async.js

promises

generators

async functions

streams

observables

event emitter

CALLBACKs

bardziej subtelne problemy

Co jeżelidoA i doD

są synchroniczne?

łatwo wymieszać kod synchroniczny i

asynchroniczny

inversion of control trust issues

Hey I just met you

And this is crazy

but here’s my handler

Promisy na ratunekjQuery Deferred

native

bluebirdQ

same ol’ callback hell

not ES7 enough?

http://mcfunley.com/choose-boring-technology-slides












6. STYL PROGRAMOWANIAthis Javascript makes me fat

spójny styl

konwencje nazewnicze

i

formatowanie?

bezframeworków

Asynchroniczność?

Promisy

trucizna

The Annoying Parts

Confusion

var self = this;

fn.bind(this);

new i funkcje

konstruktora

przeciętne książki

przyzwoite książki

świetne książki

Functional programming

academic absurdity

practical stuff

functions as first class

citizens

closures

pure functions

map/filter/reduce

y-combinatorscurrying

partial applicationfn composition

immutability

pointfree

functors

monadscomonads

f-algebras

recursion

look ma no this, new and prototype

Siła woli i aktywność umysłowa korzystają z tej samej puli zasobów

this-full JS makes me fat

7. NODE.JS i AUTOMATYZACJAgdy wszystko nas zawodzi

if [ "$a" -eq 273 ]

WHAAAT!!??

klik klik

“klikanie nie skaluje się, klikanie nie jest audytowalne”


uncle bob


Douglas Crockford

high level infrastructure as code

nie działa

Heroku infrastructure as code

Podsumowanie•efekt Lindy i czarne łabędzie

•styl ROCA alternatywą dla SPA

•node.js do pisania Backend For Frontend

•DI - można bez frameworków

•Klient HTTP - nie tylko “happy path”

•Właściwa abstrakcja do async

•JS bez this

•JS jako język do automatyzacji

JS node.js

https://github.com/kwasniew https://twitter.com/kwasniew http://www.slideshare.net/kwasniew https://www.linkedin.com/pub/mateusz-kwasniewski/6/a97/583

Mateusz Kwaśniewski

https://github.com/kwasniew

https://twitter.com/kwasniew

http://www.slideshare.net/kwasniew

https://www.linkedin.com/pub/mateusz-kwasniewski/6/a97/583

(node.js) web development - prościej

Technology