Mapa Conceptual UT01¶

UT01 Arquitectures de Desenvolupament Web¶

mindmap
  root(("Arquitectures Web"))
    id1["1. Introducció"]
      id2["Model client-servidor"]
      id3["Base desenvolupament modern"]
      id4["Decisions tècniques"]

    id5["2. Evolució Històrica"]
      id6["Tim Berners-Lee 1989"]
      id7["W3C estàndards"]
      id8["Tipus pàgines"]
        id9["Estàtiques"]
        id10["Generades servidor"]
        id11["AJAX"]
        id12["SPA"]
        id13["PWA"]

    id14["3. Model Client-Servidor"]
      id15["Client-side"]
        id16["Navegador web"]
        id17["Firefox, Chrome, Edge"]
        id18["Interacció usuari"]
      id19["Server-side"]
        id20["Servidors físics"]
        id21["Apache, NGINX"]
        id22["Bases de dades"]
      id23["Xarxa"]
        id24["Protocol HTTP/HTTPS"]
        id25["Comunicació bidireccional"]

    id26["4. Arquitectura Client"]
      id27["Tecnologies"]
        id28["HTML: estructura"]
        id29["CSS: presentació"]
        id30["JavaScript: comportament"]
      id31["Ecosistema JS"]
        id32["Vanilla JS"]
        id33["Llibreries: jQuery, React"]
        id34["Frameworks: Angular, Vue, Svelte"]
      id35["Limitacions"]
        id36["Sandbox execució"]
        id37["Same-Origin Policy"]
        id38["No accés fitxers locals"]

    id39["5. Arquitectura Servidor"]
      id40["Components"]
        id41["Servidor web"]
        id42["Llenguatges: PHP, Node, Java"]
        id43["Bases de dades"]
      id44["Responsabilitats"]
        id45["Emmagatzematge persistent"]
        id46["Lògica de negoci"]
        id47["Autenticació i seguretat"]

    id48["6. Comparativa"]
      id49["Validació formularis"]
        id50["Client: UX instantània"]
        id51["Servidor: Seguretat"]
      id52["Accés dades"]
        id53["Client: Visualització"]
        id54["Servidor: Persistència"]
      id55["Càlculs"]
        id56["Client: Simples"]
        id57["Servidor: Complexos"]

    id58["7. Navegadors"]
      id59["Principals"]
        id60["Edge: Blink"]
        id61["Firefox: Gecko"]
        id62["Chrome: Blink"]
        id63["Safari: WebKit"]
      id64["Components"]
        id65["Hipervincles"]
        id66["Protocols HTTP/HTTPS"]
        id67["Estàndards HTML"]

    id68["8. Eines Desenvolupament"]
      id69["IDEs"]
        id70["Visual Studio Code"]
        id71["WebStorm: JetBrains"]
        id72["Llicències educatives"]
      id73["Característiques WebStorm"]
        id74["Autocompletat intel·ligent"]
        id75["Depuració integrada"]
        id76["Control versions Git"]
      id77["Consola Web F12"]
        id78["Xarxa: peticions HTTP"]
        id79["CSS: errors"]
        id80["JavaScript: debug"]

    id81["9. Control Versions"]
      id82["Git"]
        id83["Seguiment canvis"]
        id84["Col·laboració equip"]
        id85["Recuperació versions"]
        id86["Branching"]

    id87["10. Millors Pràctiques"]
      id88["Estàndards W3C"]
      id89["Fitxers JS externs"]
      id90["Progressive enhancement"]
      id91["Separació concerns"]

    id92["11. Tecnologies Modernes"]
      id93["PWA"]
        id94["Funcionen offline"]
        id95["Adaptables"]
        id96["Segures HTTPS"]
      id97["Frameworks frontend"]
        id98["React.js: Facebook"]
        id99["Angular: Google"]
        id100["Vue.js"]
        id101["Svelte"]
      id102["Backend modern"]
        id103["Node.js"]
        id104["Express.js"]
        id105["Nest.js"]

    id106["12. Conclusions"]
      id107["Base sòlida"]
      id108["Eines professionals"]
      id109["Evolució constant"]
      id110["Dominar fonaments"]