{"id":229928,"date":"2022-11-30T19:39:00","date_gmt":"2022-11-30T16:39:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=229928"},"modified":"2022-11-09T19:20:02","modified_gmt":"2022-11-09T16:20:02","slug":"obiektowy-sposob-pracy-z-modelami-i-aplikacjami-internetowymi","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/pl\/obiektowy-sposob-pracy-z-modelami-i-aplikacjami-internetowymi\/","title":{"rendered":"Obiektowy spos\u00f3b pracy z modelami i aplikacjami internetowymi"},"content":{"rendered":"\n<p>Kiedy m\u00f3wimy o koncepcji modeli w programowaniu obiektowym, zwykle mamy na my\u015bli klas\u0119, kt\u00f3ra jest reprezentacj\u0105 danych przechowywanych w bazie danych.<\/p>\n<p>Oznacza to, \u017ce gdy informacje s\u0105 przechowywane w wierszach i kolumnach, wype\u0142niamy klas\u0119, jej atrybuty i tak dalej tymi informacjami, aby m\u00f3c przekazywa\u0107 je do aplikacji, manipulowa\u0107 nimi w razie potrzeby, a nast\u0119pnie ewentualnie serializowa\u0107 dane z powrotem do bazy danych.<\/p>\n<p>Ale w aplikacji internetowej mo\u017cna uczciwie za\u0142o\u017cy\u0107, \u017ce model musi by\u0107 mo\u017cliwy do u\u017cycia w interfejsie u\u017cytkownika. Oznacza to, \u017ce wyobra\u017amy sobie \u017c\u0105danie frontonu wywo\u0142uj\u0105ce serwer, \u017c\u0105daj\u0105ce modelu (lub kolekcji modeli), a nast\u0119pnie renderuj\u0105ce je na stronie frontowej.<\/p>\n<p>Chocia\u017c ten konkretny post nie jest zorientowany na kod, nadal uwa\u017cam, \u017ce warto przemy\u015ble\u0107 proces t\u0142umaczenia modelu z serwera, a nast\u0119pnie renderowania go na interfejsie aplikacji internetowej.<\/p>\n<h2>Praca z modelami i aplikacjami internetowymi<\/h2>\n<p>Wyobra\u017a sobie przez chwil\u0119, \u017ce Twoja aplikacja ma model Pracownika. Ten model mo\u017ce zawiera\u0107 r\u00f3\u017cne atrybuty, ale mo\u017cna bezpiecznie za\u0142o\u017cy\u0107, \u017ce wszyscy pracownicy mieliby:<\/p>\n<ul>\n<li>imi\u0119,<\/li>\n<li>nazwisko,<\/li>\n<li>identyfikator pracownika,<\/li>\n<li>i adres e-mail<\/li>\n<\/ul>\n<p>Spos\u00f3b przechowywania tych informacji w bazie danych nie jest ca\u0142kowicie bez znaczenia, ale nie jest tak wa\u017cny dla tej dyskusji.<\/p>\n<p>Na przyk\u0142ad by\u0107 mo\u017ce istnieje pojedynczy rekord, kt\u00f3ry zawiera wszystkie te informacje przechowywane w ci\u0105gu JSON. Z drugiej strony, by\u0107 mo\u017ce istnieje tabela pracownik\u00f3w, w kt\u00f3rej ka\u017cdy wiersz reprezentuje pracownika, a ka\u017cda kolumna reprezentuje atrybut.<\/p>\n<p>Szczeg\u00f3\u0142y, w jaki spos\u00f3b informacje s\u0105 t\u0142umaczone z bazy danych (lub, bardziej og\u00f3lnie, magazynu danych) na klas\u0119, nie s\u0105 tak wa\u017cne.<\/p>\n<p>Zwykle jednak zobaczymy co\u015b takiego:<\/p>\n<ol>\n<li>Istnieje klasa, kt\u00f3ra \u017c\u0105da informacji,<\/li>\n<li>Informacje przekazywane s\u0105 do <strong>Prostej Fabryki<\/strong> ,<\/li>\n<li>Prosta <strong>fabryka<\/strong> tworzy instancj\u0119 <strong>Modelu<\/strong> ,<\/li>\n<li>Model jest nast\u0119pnie przekazywany do klasy innej firmy, kt\u00f3ra go za\u017c\u0105da\u0142a<strong>.<\/strong><\/li>\n<\/ol>\n<p>Z pogl\u0105dowego punktu widzenia mo\u017cesz to zobaczy\u0107 w ten spos\u00f3b:<\/p>\n<p>Od tego momentu <strong>Model<\/strong> jest przekazywany przez aplikacj\u0119. Ale tutaj pojawia si\u0119 pocz\u0105tkowy punkt tego postu: jak przekaza\u0107 instancj\u0119 <strong>Modelu<\/strong> (lub kolekcj\u0119 <strong>Modeli<\/strong>) do frontonu aplikacji?<\/p>\n<h2>Przep\u0142yw aplikacji internetowej<\/h2>\n<p>Aby upro\u015bci\u0107 spraw\u0119, za\u0142\u00f3\u017cmy, \u017ce b\u0119dziemy u\u017cywa\u0107 jednego modelu, a nast\u0119pnie, je\u015bli ponownie przyjrz\u0119 si\u0119 tej koncepcji z punktu widzenia kodu, mo\u017cemy zag\u0142\u0119bi\u0107 si\u0119 nieco dalej.<\/p>\n<p>Og\u00f3lny przep\u0142yw aplikacji internetowej b\u0119dzie jednak wygl\u0105da\u0142 mniej wi\u0119cej tak:<\/p>\n<ol>\n<li>U\u017cytkownik uruchamia akcj\u0119, kt\u00f3ra \u017c\u0105da wyst\u0105pienia modelu,<\/li>\n<li>Front-end wykonuje wywo\u0142anie do punktu ko\u0144cowego na serwerze,<\/li>\n<li>Serwer odczytuje \u017c\u0105dania i weryfikuje ich poprawno\u015b\u0107,<\/li>\n<li>Nast\u0119pnie wysy\u0142a reprezentacj\u0119 modelu do front-endu.<\/li>\n<\/ol>\n<p>Inni programi\u015bci mog\u0105 si\u0119 z tym nie zgodzi\u0107 (co moim zdaniem zawsze jest mile widziane i warte dyskusji), ale odkry\u0142em, \u017ce serializacja instancji modelu do JSON znacznie u\u0142atwia prac\u0119 na interfejsie ze wzgl\u0119du na funkcjonalno\u015b\u0107 JavaScript, poniewa\u017c odnosi si\u0119 do, ahem, JSON.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-163595-61e75570192c9.png\" data-rel=\"lightbox\" ><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-163595-61e75570192c9.png\" alt=\"Obiektowy spos\u00f3b pracy z modelami i aplikacjami internetowymi\" ><\/a><\/p>\n<p>Innymi s\u0142owy:<\/p>\n<ol>\n<li>bierzemy model,<\/li>\n<li>zserializowa\u0107 go do JSON,<\/li>\n<li>wy\u015blij to przez drut,<\/li>\n<li>nast\u0119pnie zdeserializowa\u0107 go w interfejsie do reprezentacji samego siebie w JavaScript.<\/li>\n<\/ol>\n<p>To pozwala nam manipulowa\u0107 nim tak, jak po stronie serwera; jednak mamy do czynienia z obiektem JavaScript. Co wi\u0119cej, pozwala nam r\u00f3wnie\u017c na dokonywanie pewnych zmian i wysy\u0142anie informacji z powrotem na serwer w innym stanie, z kt\u00f3rego zosta\u0142y wys\u0142ane.<\/p>\n<p>Ostatecznie pozwala nam to zapisa\u0107 dane z powrotem do bazy danych.<\/p>\n<h2>Perspektywa wysokiego szczebla<\/h2>\n<p>I to jest cykl \u017cycia wysokiego poziomu, polegaj\u0105cy na przekazywaniu informacji z bazy danych do modelu do interfejsu i z powrotem.<\/p>\n<p>Cz\u0119sto jednak pomaga zobaczy\u0107 to w kodzie, wi\u0119c by\u0107 mo\u017ce w przysz\u0142ym po\u015bcie przedstawi\u0119 seri\u0119 artyku\u0142\u00f3w, w kt\u00f3rych wyja\u015bni\u0119, jak to zrobi\u0107.<\/p>\n<p>W mi\u0119dzyczasie jednak przet\u0142umaczenie implementacji na przep\u0142yw pracy Model-Serialization-Request-Send nie powinno by\u0107 trudne, jak opisano w tym po\u015bcie.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">\u0179r\u00f3d\u0142o nagrywania:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/tommcfarlin.com\" class=\"external external_icon\">tommcfarlin.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Zrozumienie, jak przemy\u015ble\u0107 proces pracy z modelami po stronie serwera i aplikacjami internetowymi za pomoc\u0105 modeli, fabryk i nie tylko.<\/p>\n","protected":false},"author":1,"featured_media":224094,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[721,732],"tags":[1169],"class_list":["post-229928","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-deweloper","category-javascript-7","tag-affiai-pl"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/229928","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/comments?post=229928"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/229928\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media\/224094"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media?parent=229928"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/categories?post=229928"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/tags?post=229928"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}