Idee per gestire le dipendenze in un'architettura web basata su componenti

1

Passo un po 'di tempo a leggere e pensare a modi alternativi per creare applicazioni web. Uno degli approcci che sto sperimentando è strongmente basato su OO, usando TypeScript. L'idea generale è quella di dividere l'applicazione in componenti sempre più piccoli, in modo simile al modo in cui lo fa Angular (e molti altri).

Un aspetto importante di questo è che i componenti definiscono le loro API (come callback da eseguire dopo qualche evento) come parte del loro costruttore. Questo è un buon modo per stabilire la comunicazione tra i componenti.

Un altro aspetto che vale la pena sottolineare è che ogni componente è responsabile del bit di HTML a cui è associato, che viene creato in modo programmatico (l'idea alla base di questa particolarità è quella di fornire un codice HTML più sicuro) dal componente stesso.

Come prova del concetto, ho creato una piccola cosa da fare, disponibile al link .

La mia domanda è: ora che i costruttori di componenti hanno già un buon scopo, quali opzioni devo gestire le dipendenze di quei componenti, come servizi responsabili della comunicazione con il server, oggetti specifici del browser come come location o document , ecc.? L'hard-coding di queste dipendenze renderebbe il test molto difficile, e aspettarsi che facessero parte del costruttore, mescolato con il resto, renderebbe le cose poco chiare, e renderebbe difficile implementare una sorta di funzione di iniezione dipendente da Spring (ad esempio una @Autowired / @Inject decoratore).

Sono interessato anche a qualsiasi altro approfondimento su questo concetto architettonico. Ad esempio, pensi che sia una buona idea usare le classi, o semplici oggetti in stile JavaScript sarebbero sufficienti o anche in forma meglio? Le responsabilità sono ben divise con esso o strutturerebbero le cose in modo diverso?

    
posta DanielM 24.09.2017 - 19:01
fonte

1 risposta

1

Il mio approccio con React è una soluzione a un problema molto simile a quello che stai descrivendo. Con i componenti React il costruttore della classe viene utilizzato dal framework per passare le proprietà degli elementi dal componente principale. Per passare ulteriori dipendenze non di proprietà, introduco una funzione "factory".

export default function(client, location, document) {
    return class LoginComponent extends Component {
        // ...
    }
}

Quindi alla composizione root , invochi la factory sopra per ottenere la classe del componente che essere iniettato ovunque sia usato LoginComponent .

    
risposta data 25.09.2017 - 04:05
fonte

Leggi altre domande sui tag