![\"Przyk\u0142ad](\"https:\/\/mastertrend.info\/wp-content\/uploads\/2025\/01\/Crea-Tu-Primera-Aplicacion-Web-Una-App-de-Notas-Sencilla.png\" "\\"\\"")
<\/picture><\/figure>\nZlicza r\u00f3wnie\u017c znaki i s\u0142owa, co stanowi dobre wprowadzenie do obs\u0142ugi ci\u0105g\u00f3w tekstowych. Oczywi\u015bcie, aplikacja jest bardzo prosta: taki jest jej cel! Dzi\u0119ki temu samouczkowi nauczysz si\u0119 podstaw tworzenia aplikacji internetowych, a potem \u015bwiat b\u0119dzie sta\u0142 przed Tob\u0105 otworem. \ud83e\uddaa\ud83d\udcbb<\/p>\n
Jak zamierzasz to zbudowa\u0107?<\/h2>\n
Mimo \u017ce aplikacje internetowe s\u0105 bardzo zr\u00f3\u017cnicowane, zazwyczaj wykorzystuj\u0105 trzy g\u0142\u00f3wne technologie: HTML, CSS i JavaScript. Zanim zaczniesz, musisz koniecznie zrozumie\u0107 ich rol\u0119. \ud83d\udcda<\/p>\n
- \n
- HTML: Hypertext Markup Language umo\u017cliwia zdefiniowanie struktury tre\u015bci. Za jego pomoc\u0105 mo\u017cna oznaczy\u0107 tekst wed\u0142ug jego znaczenia, wskazuj\u0105c na przyk\u0142ad, czy jest to akapit, nag\u0142\u00f3wek czy element listy.<\/li>\n
- CSS: Kaskadowe arkusze styl\u00f3w pozwalaj\u0105 na stylizowanie tre\u015bci. U\u017cywaj\u0105c tego j\u0119zyka, mo\u017cesz pokolorowa\u0107 akapit na zielono, pogrubi\u0107 wszystkie linki lub umie\u015bci\u0107 pasek boczny obok g\u0142\u00f3wnego artyku\u0142u. \ud83c\udfa8<\/li>\n
- JavaScript: Dzi\u0119ki temu j\u0119zykowi programowania mo\u017cesz doda\u0107 funkcjonalno\u015b\u0107 do swojej witryny internetowej. Mo\u017cesz ustawi\u0107 przyciski, kt\u00f3re po klikni\u0119ciu poka\u017c\u0105 lub ukryj\u0105 cz\u0119\u015bci dokumentu, albo wdro\u017cy\u0107 pe\u0142noprawny edytor tekstu lub gr\u0119 wideo. \ud83c\udfae<\/li>\n<\/ul>\n
On strona internetowa.dev<\/a> (escrito por miembros del equipo de Chrome) y MDN, la Red de Desarrolladores de Mozilla, son dos excelentes fuentes de informaci\u00f3n sobre tecnolog\u00edas web fundamentales.<\/p>\n
![\"Strona](\"https:\/\/mastertrend.info\/wp-content\/uploads\/2025\/01\/1736598858_798_Crea-Tu-Primera-Aplicacion-Web-Una-App-de-Notas-Sencilla.png\" "\\"\\"")
<\/picture><\/figure>\nStruktura aplikacji<\/h2>\n
Aplikacja, kt\u00f3r\u0105 zbudujesz, b\u0119dzie si\u0119 sk\u0142ada\u0107 z trzech prostych plik\u00f3w: index.html, styles.css i script.js. \ud83d\uddc2\ufe0f<\/p>\n
Nie ma \u017cadnych specjalnych wymaga\u0144, aby uruchomi\u0107 aplikacj\u0119, potrzebna jest tylko przegl\u0105darka internetowa. Nie ma \u017cadnych funkcji zaplecza, wi\u0119c nie potrzebujesz j\u0119zyka skryptowego, takiego jak PHP, ani lokalnego serwera WWW. Po zako\u0144czeniu mo\u017cesz otworzy\u0107 plik index.html bezpo\u015brednio w przegl\u0105darce<\/a> i wszystko si\u0119 u\u0142o\u017cy. \ud83d\ude0a<\/p>\n
Nale\u017cy pami\u0119ta\u0107, \u017ce ta aplikacja zapisuje tekst bez zapisywania go w konkretnym pliku na dysku, poniewa\u017c JavaScript nie ma dost\u0119pu do systemu plik\u00f3w. Korzysta z interfejsu API Web Storage, kt\u00f3ry jest skuteczn\u0105 alternatyw\u0105 dla plik\u00f3w cookie. \ud83c\udf6a\ud83d\udcbe<\/p>\n
Jak zbudowa\u0107 notatnik<\/h2>\n
Utw\u00f3rz nast\u0119puj\u0105ce trzy pliki w tym samym katalogu, a nast\u0119pnie otw\u00f3rz index.html w przegl\u0105darce internetowej. Alternatywnie mo\u017cesz pobra\u0107 pliki z to repozytorium GitHub<\/a>. \ud83d\udce5<\/p>\n
Budowanie struktury za pomoc\u0105 HTML<\/h3>\n
Plik index.html definiuje struktur\u0119 zawarto\u015bci Twojej aplikacji w formacie HTML. Dodaj odniesienia do pozosta\u0142ych dw\u00f3ch plik\u00f3w, aby przegl\u0105darka mog\u0142a je po\u0142\u0105czy\u0107 w celu uzyskania produktu ko\u0144cowego.<\/p>\n
Podobnie jak we wszystkich dokumentach HTML, struktura najwy\u017cszego poziomu obejmuje sekcj\u0119 nag\u0142\u00f3wka zawieraj\u0105c\u0105 metadane oraz sekcj\u0119 tre\u015bci zawieraj\u0105c\u0105 faktyczn\u0105 tre\u015b\u0107, kt\u00f3ra pojawi si\u0119 na stronie:<\/p>\n
html<\/span>>\r\n<html<\/span>><\/span>\r\n<g\u0142owa<\/span>><\/span>\r\n ...\r\ng\u0142owa<\/span>><\/span><\/code><\/pre>\n<cia\u0142o<\/span>><\/span>
\n…
\ncia\u0142o<\/span>><\/span>
\nhtml<\/span>><\/span><\/p>\n<\/code><\/pre>\n<\/code><\/pre>\nMetadane w nag\u0142\u00f3wku s\u0105 bardzo kr\u00f3tkie i zawieraj\u0105 tylko tytu\u0142 strony (kt\u00f3ry pojawia si\u0119 na pasku tytu\u0142u przegl\u0105darki) oraz odwo\u0142anie do pliku styles.css:<\/p>\n
<tytu\u0142<\/span>><\/span>Teksttytu\u0142<\/span>><\/span>\r\n <po\u0142\u0105czy\u0107<\/span> rel<\/span>="arkusz styl\u00f3w"<\/span> strona g\u0142\u00f3wna<\/span>=\u201estyle.css\u201d<\/span> \/><\/span>\r\n<\/code><\/pre>\nCia\u0142o jest bardziej skomplikowane, ale sk\u0142ada si\u0119 z zaledwie kilku wa\u017cnych cz\u0119\u015bci:<\/p>\n
<podzia\u0142<\/span> id<\/span>="lada"<\/span>><\/span>\r\n s\u0142owa: <prz\u0119s\u0142o<\/span> id<\/span>="s\u0142owa"<\/span>><\/span>0prz\u0119s\u0142o<\/span>><\/span>\r\n \/ postacie: <prz\u0119s\u0142o<\/span> id<\/span>="znaki"<\/span>><\/span>0prz\u0119s\u0142o<\/span>><\/span>\r\n podzia\u0142<\/span>><\/span><\/code><\/pre>\n<pole tekstowe<\/span> id<\/span>="tekst"<\/span> autofokus<\/span>=\u00ab1\u00bb<\/span>><\/span>pole tekstowe<\/span>><\/span><\/p>\n
<\/code><\/pre>\n<scenariusz<\/span> \u017ar\u00f3d\u0142o<\/span>=\u00abskrypt.js\u00bb<\/span>><\/span>scenariusz<\/span>><\/span><\/p>\n
<\/code><\/pre>\n<\/code><\/pre>\nElement div zawiera liczb\u0119 s\u0142\u00f3w i znak\u00f3w w aplikacji. B\u0119dzie on umieszczony na g\u00f3rze aplikacji internetowej i b\u0119dzie aktualizowany za ka\u017cdym razem, gdy zmieni si\u0119 tekst.<\/p>\n
Nale\u017cy zwr\u00f3ci\u0107 uwag\u0119 na atrybuty id, kt\u00f3re s\u0105 niezb\u0119dne do przeprowadzenia operacji. Warto\u015b\u0107 identyfikatora musi by\u0107 unikatowa, aby aplikacja mog\u0142a jej u\u017cy\u0107 do zidentyfikowania konkretnego elementu. Dzi\u0119ki temu mo\u017cemy nada\u0107 tym elementom odpowiedni styl oraz okre\u015bli\u0107 ich przeznaczenie podczas dodawania funkcjonalno\u015bci.<\/p>\n
Obszar tekstowy to wbudowany element formularza umo\u017cliwiaj\u0105cy wpisywanie prostego tekstu w przegl\u0105darce. Dzi\u0119ki funkcji autofokusa b\u0119dziesz gotowy do pisania od razu po za\u0142adowaniu strony. Na ko\u0144cu strona odwo\u0142uje si\u0119 do pliku JavaScript script.js.<\/p>\n
W tym momencie mo\u017cesz otworzy\u0107 plik index.html w przegl\u0105darce. Na razie nie b\u0119dzie to mia\u0142o \u017cadnego znaczenia i nawet nie b\u0119dzie to wygl\u0105da\u0107 dobrze, ale warto testowa\u0107 aplikacj\u0119 na ka\u017cdym etapie, aby mie\u0107 pewno\u015b\u0107, \u017ce jej podstawowe funkcje dzia\u0142aj\u0105 zgodnie z oczekiwaniami.<\/p>\n
![\"Widok](\"https:\/\/mastertrend.info\/wp-content\/uploads\/2025\/01\/1736598858_678_Crea-Tu-Primera-Aplicacion-Web-Una-App-de-Notas-Sencilla.png\" "\\"\\"")
<\/picture><\/figure>\nSpraw, by wygl\u0105da\u0142y dobrze dzi\u0119ki CSS<\/h3>\n
CSS umo\u017cliwia stylizowanie cz\u0119\u015bci strony internetowej poprzez kierowanie ich na te cz\u0119\u015bci i okre\u015blanie warto\u015bci dla w\u0142a\u015bciwo\u015bci, takich jak rozmiar czcionki i kolor t\u0142a. Ta przyk\u0142adowa aplikacja nie wymaga bardzo wyrafinowanego projektu, poniewa\u017c jej interfejs jest bardzo podstawowy. Mo\u017cemy jednak z\u0142agodzi\u0107 te nier\u00f3wno\u015bci odrobin\u0105 stylu. \ud83c\udfa8\u2728<\/p>\n
Najpierw nadaj styl cia\u0142u, aby okre\u015bli\u0107 og\u00f3lny projekt:<\/p>\n
cia\u0142o<\/span> {\r\n margines<\/span>: 0;\r\n wy\u015bci\u00f3\u0142ka<\/span>: 0;\r\n wy\u015bwietlacz<\/span>: siatka<\/span>;\r\n minimalna wysoko\u015b\u0107<\/span>: 100w.h.<\/span>;\r\n siatka-szablon-wiersze<\/span>: minimalna zawarto\u015b\u0107<\/span> 1z<\/span>;\r\n}\r\n<\/code><\/pre>\nEste CSS utiliza la disposici\u00f3n en cuadr\u00edcula para posicionar los conteos de palabras y caracteres en una fila estrecha sobre el textarea. La propiedad grid-template-rows especifica que la fila del conteo debe ser lo m\u00e1s corta posible (min-content) y el textarea debe llenar el espacio restante (1fr).<\/p>\n
Rz\u0105d licznika ma podstawowy styl, kt\u00f3ry odr\u00f3\u017cnia go od reszty tekstu, g\u0142\u00f3wnie poprzez t\u0142o:<\/p>\n
Licznik #<\/span> {\r\n rodzina czcionek<\/span>: bezszeryfowy<\/span>;\r\n kolor t\u0142a<\/span>: #f7f7f7<\/span>;\r\n wyr\u00f3wnanie tekstu<\/span>: centrum<\/span>;\r\n szeroko\u015b\u0107<\/span>: 100%;\r\n wy\u015bci\u00f3\u0142ka<\/span>: 0.5em<\/span> 0;\r\n}\r\n<\/code><\/pre>\nNa koniec obszar tekstowy jest stylizowany tak, aby wy\u015bwietla\u0142 czytelny tekst, zapewniaj\u0105c jednocze\u015bnie wystarczaj\u0105co du\u017co miejsca. Linia oddzielaj\u0105ca liczby od tekstu stanowi w rzeczywisto\u015bci g\u00f3rn\u0105 granic\u0119 tego obszaru tekstowego.<\/p>\n
pole tekstowe<\/span> {\r\n szeroko\u015b\u0107<\/span>: 100%;\r\n wysoko\u015b\u0107<\/span>: 100%;\r\n rozmiar czcionki<\/span>: 16cz.<\/span>;\r\n wy\u015bci\u00f3\u0142ka<\/span>: 1W<\/span>;\r\n rozmiar pude\u0142ka<\/span>: pole obramowania<\/span>;\r\n zarys<\/span>: 0;\r\n granica<\/span>: nic<\/span>;\r\n granica-g\u00f3ra<\/span>: 1piksel<\/span> solidny<\/span> #999<\/span>;\r\n}<\/code><\/pre>\n![\"Aplikacja](\"https:\/\/mastertrend.info\/wp-content\/uploads\/2025\/01\/1736598859_152_Crea-Tu-Primera-Aplicacion-Web-Una-App-de-Notas-Sencilla.png\" "\\"\\"")
<\/picture><\/figure>\nDodawanie funkcjonalno\u015bci za pomoc\u0105 JavaScript<\/h3>\n
Maj\u0105c ju\u017c struktur\u0119 i styl, mo\u017cesz doda\u0107 funkcjonalno\u015b\u0107, czyli kod, kt\u00f3ry sprawi, \u017ce ta prosta aplikacja faktycznie co\u015b zrobi. \ud83d\udee0\ufe0f<\/p>\n
Zanim zaczniesz pisa\u0107 nawet najprostszy kod, warto zrozumie\u0107, co on b\u0119dzie robi\u0142. W tym przypadku istnieje tylko kilka og\u00f3lnych wymaga\u0144:<\/p>\n
- \n
- Zapisz wprowadzony tekst i w razie potrzeby ponownie go za\u0142aduj.<\/li>\n
- Aktualizuj liczb\u0119 znak\u00f3w i s\u0142\u00f3w, aby uzyska\u0107 statystyki w czasie rzeczywistym. \ud83d\udcca<\/li>\n<\/ul>\n
Oba wymagania wi\u0105\u017c\u0105 si\u0119 z aktualizacj\u0105 element\u00f3w dokumentu. Skrypt rozpoczyna wi\u0119c dzia\u0142anie od pobrania odniesie\u0144 do tych w\u0119z\u0142\u00f3w za pomoc\u0105 metody getElementById:<\/p>\n
sta\u0142a<\/span> s\u0142owa = dokument<\/span>.getElementById("s\u0142owa"<\/span>);\r\nsta\u0142a<\/span> znaki = dokument<\/span>.getElementById("znaki"<\/span>);\r\nsta\u0142a<\/span> pole tekstowe = dokument<\/span>.getElementById("tekst"<\/span>);\r\n<\/code><\/pre>\nNale\u017cy pami\u0119ta\u0107, \u017ce s\u0142owa, znaki i tekst to identyfikatory odpowiednich element\u00f3w w dokumencie, przypisane w pliku HTML za pomoc\u0105 atrybutu id.<\/p>\n
Nast\u0119pnie potrzebujemy, aby aplikacja reagowa\u0142a, gdy tekst zostanie zmieniony:<\/p>\n
textarea.addEventListener("wej\u015bcie"<\/span>, funkcjonowa\u0107<\/span>(yw<\/span>) <\/span>{ localStorage.setItem("tekst"<\/span>, ev.target.value); update_counts(ev.target.value); });\r\n<\/code><\/pre>\nNas\u0142uchiwacz zdarze\u0144 to funkcja, kt\u00f3r\u0105 JavaScript automatycznie uruchamia po wyst\u0105pieniu okre\u015blonego zdarzenia. W tym przypadku do\u0142\u0105czamy obiekt nas\u0142uchuj\u0105cy do w\u0119z\u0142a textarea, kt\u00f3ry jest wykonywany, gdy wyst\u0105pi zdarzenie \u201einput\u201d. Dzieje si\u0119 tak, gdy kto\u015b wchodzi w interakcj\u0119 z polem tekstowym.<\/p>\n
Nast\u0119pnie u\u017cywamy interfejsu API Web Storage, aby zapisa\u0107 bie\u017c\u0105c\u0105 zawarto\u015b\u0107 pola tekstowego pochodz\u0105c\u0105 z ev.target.value. W tej strukturze ev jest obiektem reprezentuj\u0105cym zdarzenie, kt\u00f3re wyzwoli\u0142o obiekt nas\u0142uchuj\u0105cy, ev.target jest w\u0119z\u0142em, kt\u00f3ry odebra\u0142 zdarzenie, a ev.target.value jest tekstem tego pola tekstowego.<\/p>\n
Metoda setItem przyjmuje dwa parametry: nazw\u0119 klucza, kt\u00f3ry ma zosta\u0107 skojarzony z danymi, i faktyczne dane, kt\u00f3re maj\u0105 zosta\u0107 zapisane.<\/p>\n
Nast\u0119pnie wywo\u0142ujemy update_counts(), przekazuj\u0105c ten sam tekst. Wyja\u015bnimy t\u0119 funkcj\u0119 za chwil\u0119.<\/p>\n
Teraz, gdy zapiszemy tekst, b\u0119dziesz chcia\u0142 go ponownie za\u0142adowa\u0107 po otwarciu lub prze\u0142adowaniu aplikacji. Mo\u017cemy si\u0119 tym zaj\u0105\u0107, u\u017cywaj\u0105c innego s\u0142uchacza:<\/p>\n
okno<\/span>.addEventListener("obci\u0105\u017cenie"<\/span>, funkcjonowa\u0107<\/span>(yw<\/span>) <\/span>{\r\n zmienna<\/span> tekst = localStorage.getItem("tekst"<\/span>); textarea.value = tekst; update_counts(tekst); });\r\n<\/code><\/pre>\nTen obiekt nas\u0142uchuj\u0105cy obs\u0142uguje zdarzenie \u0142adowania wyst\u0119puj\u0105ce w obiekcie okna, b\u0119d\u0105cym reprezentacj\u0105 najwy\u017cszego poziomu okna przegl\u0105darki. Po za\u0142adowaniu okna wywo\u0142anie getItem() zwraca zapisan\u0105 warto\u015b\u0107 tekstow\u0105 z pami\u0119ci lokalnej. Nast\u0119pnie ten kod ustawia warto\u015b\u0107 textarea na za\u0142adowany tekst i, podobnie jak powy\u017cszy obiekt nas\u0142uchuj\u0105cy, wywo\u0142uje update_counts() z tym tekstem.<\/p>\n
Pozosta\u0142a praca wykonywana jest w funkcji update_counts(), kt\u00f3ra wygl\u0105da nast\u0119puj\u0105co:<\/p>\n
funkcjonowa\u0107<\/span>\u00a0aktualizacja_liczby<\/span>(tekst<\/span>) <\/span>{ chars.innerHTML = d\u0142ugo\u015b\u0107 tekstu; s\u0142owa.innerHTML = tekst.split(' '<\/span>).d\u0142ugo\u015b\u0107; }\r\n<\/code><\/pre>\nW przeciwie\u0144stwie do pola tekstowego, zwyk\u0142y tekst nie ma w\u0142a\u015bciwo\u015bci warto\u015bci, dlatego zamiast tego ustawiamy w\u0142a\u015bciwo\u015b\u0107 innerHTML. W\u0142a\u015bciwo\u015b\u0107 length ci\u0105gu jest prost\u0105 w\u0142a\u015bciwo\u015bci\u0105 tylko do odczytu, kt\u00f3ra podaje nam liczb\u0119 znak\u00f3w.<\/p>\n
text.split(' ') dzieli ci\u0105g w miejscach spacji i zwraca wynik w postaci tablicy ci\u0105g\u00f3w. Podobnie jak ci\u0105gi znak\u00f3w, tablice maj\u0105 w\u0142a\u015bciwo\u015b\u0107 d\u0142ugo\u015bci, kt\u00f3ra informuje nas o liczbie element\u00f3w w tablicy.<\/p>\n
Je\u015bli jednak przetestujesz ten kod, mo\u017cesz zauwa\u017cy\u0107 kilka b\u0142\u0119d\u00f3w:<\/p>\n
- \n
- Program nie policzy poprawnie \u017cadnego s\u0142owa w wierszu, poniewa\u017c nie ma wok\u00f3\u0142 niego \u017cadnych znak\u00f3w spacji.<\/li>\n
- Je\u015bli nie ma \u017cadnego tekstu, zg\u0142osi tylko jedno s\u0142owo, poniewa\u017c tak dzia\u0142a podzia\u0142.<\/li>\n<\/ol>\n
Aby rozwi\u0105za\u0107 pierwszy problem, mo\u017cesz podzieli\u0107 zadanie u\u017cywaj\u0105c wyra\u017cenia regularnego (\\s oznacza \u201espacj\u0119\u201d) zamiast spacji. Aby rozwi\u0105za\u0107 drugie zadanie, odfiltruj puste ci\u0105gi z wyniku:<\/p>\n
s\u0142owa.innerHTML = tekst.split(\/\\S\/<\/span>).filtr(funkcjonowa\u0107<\/span>(N<\/span>) <\/span>{ powr\u00f3t<\/span> n != ''<\/span>; }).d\u0142ugo\u015b\u0107;\r\n<\/code><\/pre>\nJe\u015bli nie do ko\u0144ca rozumiesz ten wers, sprawd\u017a strony MDN podzia\u0142<\/a> I filtr<\/a>.<\/p>\n
![\"Aplikacja](\"https:\/\/mastertrend.info\/wp-content\/uploads\/2025\/01\/1736598859_129_Crea-Tu-Primera-Aplicacion-Web-Una-App-de-Notas-Sencilla.png\" "\\"\\"")
<\/picture><\/figure>\n
\nMo\u017cna utworzy\u0107 wiele przydatnych aplikacji internetowych, korzystaj\u0105c zaledwie z kilku plik\u00f3w. Mo\u017cesz tak\u017ce rozszerzy\u0107 t\u0119 prost\u0105 aplikacj\u0119 do robienia notatek, dodaj\u0105c wi\u0119cej funkcji. Na przyk\u0142ad mo\u017cesz u\u017cy\u0107 w\u0142a\u015bciwo\u015b\u0107 window.location<\/a> aby pobra\u0107 bie\u017c\u0105cy adres URL i obs\u0142ugiwa\u0107 wiele notatek poprzez zmian\u0119 nazwy przekazywanej do localStorage.setItem. \ud83d\uddd2\ufe0f\ud83c\udf0d<\/p>","protected":false},"excerpt":{"rendered":"
Utw\u00f3rz swoj\u0105 pierwsz\u0105 aplikacj\u0119 internetow\u0105 i zapisuj notatki dzi\u0119ki licznikowi s\u0142\u00f3w. Ucz si\u0119 \u0142atwo, szybko i za darmo! \ud83c\udf10\ud83d\udd8b\ufe0f\u2728<\/p>","protected":false},"author":1,"featured_media":49198,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"ai_generated_summary":"","iawp_total_views":39,"jnews-multi-image_gallery":[],"jnews_single_post":[],"jnews_primary_category":[],"jnews_social_meta":[],"jnews_review":[],"enable_review":"","type":"","name":"","summary":"","brand":"","sku":"","good":[],"bad":[],"score_override":"","override_value":"","rating":[],"price":[],"jnews_override_counter":[],"footnotes":""},"categories":[1435],"tags":[1445,1558],"class_list":["post-32655","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutoriales","tag-evergreencontent","tag-techtips"],"_links":{"self":[{"href":"https:\/\/mastertrend.info\/pl\/wp-json\/wp\/v2\/posts\/32655","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mastertrend.info\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mastertrend.info\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mastertrend.info\/pl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mastertrend.info\/pl\/wp-json\/wp\/v2\/comments?post=32655"}],"version-history":[{"count":0,"href":"https:\/\/mastertrend.info\/pl\/wp-json\/wp\/v2\/posts\/32655\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/mastertrend.info\/pl\/wp-json\/wp\/v2\/media\/49198"}],"wp:attachment":[{"href":"https:\/\/mastertrend.info\/pl\/wp-json\/wp\/v2\/media?parent=32655"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mastertrend.info\/pl\/wp-json\/wp\/v2\/categories?post=32655"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mastertrend.info\/pl\/wp-json\/wp\/v2\/tags?post=32655"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}