{"id":6580,"date":"2025-01-11T12:34:34","date_gmt":"2025-01-11T12:34:34","guid":{"rendered":"https:\/\/howtogeek.blog\/lt\/?p=6580"},"modified":"2025-01-11T12:34:34","modified_gmt":"2025-01-11T12:34:34","slug":"create-your-first-web-application-a-beginners-guide-to-building-a-simple-notes-app-and-word-counter","status":"publish","type":"post","link":"https:\/\/howtogeek.blog\/lt\/create-your-first-web-application-a-beginners-guide-to-building-a-simple-notes-app-and-word-counter\/","title":{"rendered":"Sukurkite savo pirm\u0105j\u0105 \u017einiatinklio program\u0105: Paprastos u\u017era\u0161\u0173 programos ir \u017eod\u017ei\u0173 skaitiklio k\u016brimo vadovas pradedantiesiems"},"content":{"rendered":"<p>Prad\u0117ti kodavimo kelion\u0119 gali atrodyti bauginanti, nes gausu kalb\u0173 ir sistem\u0173 pasirinkimo. Galb\u016bt net pagalvotum\u0117te, kaip leisti visk\u0105 tvarkyti AI! Nepaisant to, programavimas \u017einiatinklyje gali b\u016bti \u012fdomus, prieinamas ir visi\u0161kai nemokamas!<\/p>\n<h2 id=\"what-youll-build\">K\u0105 pastatysite<\/h2>\n<p>\u0160ioje pamokoje sukursite paprast\u0105 \u017einiatinklio program\u0105, skirt\u0105 saugoti teksto pastabas, skai\u010diuojant tuose u\u017era\u0161uose esan\u010dius simbolius ir \u017eod\u017eius.<\/p>\n<p>\u0160i programa nuolat i\u0161saugo duomenis, tod\u0117l ji gali nuskaityti tekst\u0105 net atnaujinus puslap\u012f arba j\u012f i\u0161 naujo atidarius. Tai prakti\u0161kas sprendimas, leid\u017eiantis greitai pasiekti svarb\u0173 tekst\u0105, nesvarbu, ar tai b\u016bt\u0173 adresai, URL adresai ar bet kas kitas.<\/p>\n<figure class=\"wp-block-image\"><img alt=\"Paprastos tekstin\u0117s \u017einiatinklio programos, rodan\u010dios pastabas, \u012fskaitant kalendoriaus \u012fra\u0161\u0105 ir URL s\u0105ra\u0161\u0105, pavyzdys.\" class=\"wp-image\" decoding=\"async\" height=\"569\" loading=\"lazy\" src=\"https:\/\/cdn.howtogeek.blog\/wp-content\/uploads\/2025\/01\/web-app-example.webp\" title=\"Paprastos tekstin\u0117s \u017einiatinklio programos, rodan\u010dios pastabas, \u012fskaitant kalendoriaus \u012fra\u0161\u0105 ir URL s\u0105ra\u0161\u0105, pavyzdys.\" width=\"960\"\/><\/figure>\n<p>Be to, programa stebi simboli\u0173 ir \u017eod\u017ei\u0173 skai\u010di\u0173, suteikdama puiki\u0105 \u012fvad\u0105 \u012f manipuliavim\u0105 eilut\u0117mis. Nors programos dizainas yra paprastas, \u0161i pamoka suteikia jums pagrindini\u0173 \u017einiatinklio program\u0173 k\u016brimo \u012fg\u016bd\u017ei\u0173 ir atveria did\u017eiules kodavimo galimybes.<\/p>\n<h2 id=\"how-youll-build-it\">Kaip j\u012f pastatysite<\/h2>\n<p>Nors \u017einiatinklio programos gali labai skirtis, jos paprastai integruoja tris pagrindines technologijas: HTML, CSS ir JavaScript. Kiekvienas i\u0161 \u0161i\u0173 komponent\u0173 atlieka esmin\u0119 interneto k\u016brimo funkcij\u0105:<\/p>\n<ul>\n<li><strong>HTML:<\/strong> tai yra j\u016bs\u0173 \u017einiatinklio programos strukt\u016bra, nustatanti, kaip tvarkomas turinys. HTML apibr\u0117\u017eia, ar tekstas yra pastraipa, antra\u0161t\u0117 ar s\u0105ra\u0161o elementas.<\/li>\n<li><strong>CSS:<\/strong> pakopiniai stiliaus lapai prideda stiliaus j\u016bs\u0173 turiniui, tod\u0117l galite keisti spalvas, \u0161riftus ir i\u0161d\u0117stym\u0105. Naudodami CSS galite pary\u0161kinti elementus, koreguoti kra\u0161tines ir pad\u0117ti elementus ekrane.<\/li>\n<li><strong>\u201eJavaScript\u201c:<\/strong> \u0161i programavimo kalba yra neatsiejama funkcionalumo \u012ftraukimo \u012f j\u016bs\u0173 \u017einiatinklio program\u0105 dalis. \u201eJavaScript\u201c gali sukurti interaktyvi\u0105 patirt\u012f, pvz., rodyti \/ sl\u0117pti elementus arba kurti sud\u0117tingas programas, pvz., \u017eaidimus.<\/li>\n<\/ul>\n<figure class=\"wp-block-image\"><img alt=\"Pagrindinis web.dev svetain\u0117s puslapis su mokymosi i\u0161tekliais, skirtais HTML, CSS ir JavaScript.\" class=\"wp-image\" decoding=\"async\" height=\"734\" loading=\"lazy\" src=\"https:\/\/cdn.howtogeek.blog\/wp-content\/uploads\/2025\/01\/web-dev-homepage.webp\" title=\"Pagrindinis web.dev svetain\u0117s puslapis su mokymosi i\u0161tekliais, skirtais HTML, CSS ir JavaScript.\" width=\"1388\"\/><\/figure>\n<h2 id=\"the-app-structure\">Programos strukt\u016bra<\/h2>\n<p>Program\u0105, kuri\u0105 ketinate kurti, sudaro trys nesud\u0117tingi failai: <code>index.html<\/code>, <code>styles.css<\/code>, ir <code>script.js<\/code>.<\/p>\n<p>\u0160iai programai paleisti n\u0117ra joki\u0173 papildom\u0173 reikalavim\u0173 \u2013 pakanka tik \u017einiatinklio nar\u0161ykl\u0117s. Kadangi tai yra priekin\u0117 programa, nereikia naudoti galini\u0173 scenarij\u0173 kalb\u0173, pvz., PHP ar vietini\u0173 serveri\u0173. Baig\u0119 tiesiog atidarykite <code>index.html<\/code>nar\u0161ykl\u0117je, kad pamatytum\u0117te, kaip veikia programa.<\/p>\n<p>\u0160i programa naudoja \u017einiatinklio saugyklos API, kad i\u0161saugot\u0173 tekst\u0105, o tai leid\u017eia i\u0161saugoti informacij\u0105 ir nereikia ra\u0161yti \u012f disko failus, nes \u201eJavaScript\u201c neturi prieigos prie fail\u0173 sistemos.<\/p>\n<h2 id=\"how-to-build-the-note-taker\">Kaip sukurti u\u017era\u0161\u0173 rinkikl\u012f<\/h2>\n<p>Prad\u0117kite kurdami tris reikalingus failus tame pa\u010diame kataloge. Arba galite atsisi\u0173sti failus i\u0161 <a href=\"https:\/\/github.com\/bobbykjack\/text\" target=\"_blank\">\u0161ios \u201eGitHub\u201c saugyklos<\/a> .<\/p>\n<h3 id=\"building-the-structure-with-html\">Strukt\u016bros k\u016brimas naudojant HTML<\/h3>\n<p>Failas <code>index.html<\/code>i\u0161d\u0117sto j\u016bs\u0173 programos turinio strukt\u016br\u0105. Jame yra nuorod\u0173 \u012f CSS ir \u201eJavaScript\u201c failus, tod\u0117l nar\u0161ykl\u0117 gali juos sujungti \u012f vientis\u0105 patirt\u012f.<\/p>\n<p>Kaip ir bet kur\u012f HTML dokument\u0105, pagrindin\u0119 sistem\u0105 sudaro antra\u0161t\u0117 su metaduomenimis ir turinys:<\/p>\n<p> <code><br \/>\n<span>&lt;!DOCTYPE html&gt;<\/span><br \/>\n<span>&lt;html&gt;<\/span><br \/>\n<span>&lt;head&gt;<\/span><br \/>\n<span>...&lt;\/head&gt;<\/span><br \/>\n<span>&lt;body&gt;<\/span><br \/>\n<span>...&lt;\/body&gt;<\/span><br \/>\n<span>&lt;\/html&gt;<\/span><br \/>\n<\/code><\/p>\n<p>Antra\u0161t\u0117s skiltyje yra trumpi metaduomenys, \u012fskaitant puslapio pavadinim\u0105 (matom\u0105 nar\u0161ykl\u0117s pavadinimo juostoje) ir nuorod\u0105 \u012f fail\u0105 <code>styles.css<\/code>:<\/p>\n<p> <code><br \/>\n<span>&lt;title&gt;Text&lt;\/title&gt;<\/span><br \/>\n<span>&lt;link rel=\"stylesheet\"href=\"styles.css\"\/&gt;<\/span><br \/>\n<\/code><\/p>\n<p>K\u016bnas yra i\u0161samesnis, \u012fskaitant pagrindinius komponentus:<\/p>\n<p> <code><br \/>\n<span>&lt;div id=\"counter\"&gt;<\/span><br \/>\n<span>words: &lt;span id=\"words\"&gt;0&lt;\/span&gt;<\/span><br \/>\n<span>\/ characters: &lt;span id=\"chars\"&gt;0&lt;\/span&gt;<\/span><br \/>\n<span>&lt;\/div&gt;<\/span><br \/>\n<span>&lt;textarea id=\"text\"autofocus=\"1\"&gt;&lt;\/textarea&gt;<\/span><br \/>\n<span>&lt;script src=\"script.js\"&gt;&lt;\/script&gt;<\/span><br \/>\n<\/code><\/p>\n<p>Elemente <code>div<\/code>, identifikuojamame kaip \u201eskaitiklis\u201c, yra \u017eod\u017ei\u0173 ir simboli\u0173 skai\u010dius. Jis lieka vir\u0161uje ir dinami\u0161kai atnaujinamas kei\u010diantis tekstui.<\/p>\n<p>Labai svarbu atkreipti d\u0117mes\u012f \u012f atribut\u0173 naudojim\u0105 <code>id<\/code>\u2013 j\u0173 unikalios vert\u0117s padeda formuoti \u0161iuos elementus ir pritaikyti juos funkcionalumui.<\/p>\n<p>Pateikiama <code>textarea<\/code>sritis, kurioje vartotojai gali \u012fvesti tekst\u0105 su <code>autofocus<\/code>atributu, u\u017etikrinant\u012f, kad jis b\u016bt\u0173 paruo\u0161tas \u012fvesti \u012fkeliant puslap\u012f. Galiausiai HTML nurodo <code>script.js<\/code>fail\u0105.<\/p>\n<p>\u0160iuo metu atidarykite <code>index.html<\/code>nar\u0161ykl\u0117je. Jis dar neveiks ir gali atrodyti netinkamai, ta\u010diau kiekviename etape naudinga patikrinti pa\u017eang\u0105.<\/p>\n<figure class=\"wp-block-image\"><img alt=\"U\u017era\u0161\u0173 darymo \u017einiatinklio programos su numatytaisiais nar\u0161ykl\u0117s stiliais vaizdas, kuriame viskas pateikiama vir\u0161utiniame kairiajame kampe.\" class=\"wp-image\" decoding=\"async\" height=\"569\" loading=\"lazy\" src=\"https:\/\/cdn.howtogeek.blog\/wp-content\/uploads\/2025\/01\/web-app-no-style.webp\" title=\"U\u017era\u0161\u0173 darymo \u017einiatinklio programos su numatytaisiais nar\u0161ykl\u0117s stiliais vaizdas, kuriame viskas pateikiama vir\u0161utiniame kairiajame kampe.\" width=\"960\"\/><\/figure>\n<h3 id=\"making-things-look-good-with-css\">Kad viskas atrodyt\u0173 gerai naudojant CSS<\/h3>\n<p>Nors \u0161iai pagrindinei programai nereikia dideli\u0173 dizaino koregavim\u0173, galime patobulinti jos i\u0161d\u0117stym\u0105 naudodami tam tikr\u0105 stili\u0173.<\/p>\n<p>Pirma, mes nustatome k\u016bno stili\u0173, kad apib\u016bdintume bendr\u0105 i\u0161vaizd\u0105:<\/p>\n<p> <code><br \/>\n<span>body {<\/span><br \/>\n<span> margin: 0;<\/span><br \/>\n<span> padding: 0;<\/span><br \/>\n<span> display: grid;<\/span><br \/>\n<span> min-height: 100vh;<\/span><br \/>\n<span> grid-template-rows: min-content 1fr;<\/span><br \/>\n<span>}<\/span><br \/>\n<\/code><\/p>\n<p>\u0160iame CSS naudojamas <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/CSS\/CSS_grid_layout\" target=\"_blank\">tinklelio i\u0161d\u0117stymas<\/a> , kad \u017eod\u017ei\u0173 ir simboli\u0173 skai\u010dius b\u016bt\u0173 i\u0161d\u0117stytas siauroje eilut\u0117je vir\u0161 teksto srities. Savyb\u0117 <code>grid-template-rows<\/code>nustato, kad skai\u010diavimo eilut\u0117 turi u\u017eimti ma\u017eiausi\u0105 \u012fmanom\u0105 viet\u0105 (min-turinys), o teksto sritis u\u017epildo likusi\u0105 erdv\u0119 (1fr).<\/p>\n<p>Skaitiklio eilut\u0117 gauna pagrindin\u012f stili\u0173, kad ji b\u016bt\u0173 atskirta nuo tekstin\u0117s srities, vis\u0173 pirma per fon\u0105:<\/p>\n<p> <code><br \/>\n<span>#counter {<\/span><br \/>\n<span> font-family: sans-serif;<\/span><br \/>\n<span> background-color: #f7f7f7;<\/span><br \/>\n<span> text-align: center;<\/span><br \/>\n<span> width: 100%;<\/span><br \/>\n<span> padding: 0 0.5em 0;<\/span><br \/>\n<span>}<\/span><br \/>\n<\/code><\/p>\n<p>Teksto sritis sukurta taip, kad tekstas b\u016bt\u0173 \u012fskaitomas, kad b\u016bt\u0173 pakankamai vietos:<\/p>\n<p> <code><br \/>\n<span>textarea {<\/span><br \/>\n<span> width: 100%;<\/span><br \/>\n<span> height: 100%;<\/span><br \/>\n<span> font-size: 16pt;<\/span><br \/>\n<span> padding: 1em;<\/span><br \/>\n<span> box-sizing: border-box;<\/span><br \/>\n<span> outline: 0;<\/span><br \/>\n<span> border: none;<\/span><br \/>\n<span> border-top: 1px solid #999;<\/span><br \/>\n<span>}<\/span><br \/>\n<\/code><\/p>\n<figure class=\"wp-block-image\"><img alt=\"U\u017era\u0161\u0173 program\u0117l\u0117 su tinkintais stiliais rodo skaitiklio juost\u0105 vir\u0161uje su viso dyd\u017eio teksto sritimi \u017eemiau.\" class=\"wp-image\" decoding=\"async\" height=\"569\" loading=\"lazy\" src=\"https:\/\/cdn.howtogeek.blog\/wp-content\/uploads\/2025\/01\/web-app-with-style.webp\" title=\"U\u017era\u0161\u0173 program\u0117l\u0117 su tinkintais stiliais rodo skaitiklio juost\u0105 vir\u0161uje su viso dyd\u017eio teksto sritimi \u017eemiau.\" width=\"960\"\/><\/figure>\n<h3 id=\"adding-functionality-with-javascript\">Funkcionalumo prid\u0117jimas naudojant \u201eJavaScript\u201c.<\/h3>\n<p>Atlikus pagrindinius darbus, laikas \u012f savo program\u0105 \u012ftraukti funkcionalum\u0105 \u2013 kod\u0105, kuris j\u0105 atgaivina!<\/p>\n<p>Prie\u0161 pasineriant \u012f kodavim\u0105, b\u016btina apib\u016bdinti numatomas funkcijas. \u0160ioje programoje sutelksite d\u0117mes\u012f \u012f du pagrindinius tikslus:<\/p>\n<ul>\n<li>I\u0161likti ir i\u0161 naujo \u012fkelti \u012fvest\u0105 tekst\u0105.<\/li>\n<li>Dinami\u0161kai atnaujinkite simboli\u0173 ir \u017eod\u017ei\u0173 skai\u010di\u0173.<\/li>\n<\/ul>\n<p>\u0160ioms funkcijoms reikia atnaujinti tam tikrus dokumento elementus. Tod\u0117l prad\u0117kite gaudami nuorodas \u012f \u0161iuos mazgus naudodami <code>getElementById<\/code>metod\u0105:<\/p>\n<p> <code><br \/>\n<span>const words = document.getElementById(\"words\");<\/span><br \/>\n<span>const chars = document.getElementById(\"chars\");<\/span><br \/>\n<span>const textarea = document.getElementById(\"text\");<\/span><br \/>\n<\/code><\/p>\n<p>\u010cia <code>words<\/code>, <code>chars<\/code>, ir <code>textarea<\/code>atitinka atitinkamas j\u0173 dalis dokumente, identifikuojamus pagal j\u0173 ID atributus.<\/p>\n<p>Tada \u012fdiekite interaktyvum\u0105 nustatydami program\u0105, kad ji reaguot\u0173, kai tekstas pakei\u010diamas:<\/p>\n<p> <code><br \/>\n<span>textarea.addEventListener(\"input\", function(ev) {<\/span><br \/>\n<span> localStorage.setItem(\"text\", ev.target.value);<\/span><br \/>\n<span> update_counts(ev.target.value);<\/span><br \/>\n<span>});<\/span><br \/>\n<\/code><\/p>\n<p>Metodas <code>addEventListener<\/code>susieja funkcij\u0105, kad suaktyvint\u0173, kai \u012fvyksta nurodytas \u012fvykis. \u0160iuo atveju, kai vartotojas s\u0105veikauja su teksto sritimi, \u201e\u012fvesties\u201c \u012fvykis suaktyvina funkcij\u0105.<\/p>\n<p>Tada \u017einiatinklio saugyklos API naudojama dabartiniam tekstin\u0117s srities turiniui i\u0161saugoti, pasiekiamam per <code>ev.target.value<\/code>. Metodas <code>setItem<\/code>susieja rakt\u0105 su saugomais duomenimis.<\/p>\n<p>Nor\u0117dami u\u017etikrinti, kad tekstas b\u016bt\u0173 \u012fkeltas, kai programa inicijuojama arba atnaujinama, prid\u0117kite kit\u0105 klausytoj\u0105:<\/p>\n<p> <code><br \/>\n<span>window.addEventListener(\"load\", function(ev) {<\/span><br \/>\n<span> var text = localStorage.getItem(\"text\");<\/span><br \/>\n<span> textarea.value = text;<\/span><br \/>\n<span> update_counts(text);<\/span><br \/>\n<span>});<\/span><br \/>\n<\/code><\/p>\n<p>\u0160is klausytojas reaguoja \u012f lango \u012fk\u0117limo \u012fvyk\u012f. \u012ekeliant lang\u0105, jis nuskaito i\u0161saugot\u0105 tekst\u0105 ir atitinkamai nustato teksto srities reik\u0161m\u0119, tuo pa\u010diu i\u0161kviesdamas <code>update_counts()<\/code>atnaujinti \u017eod\u017ei\u0173 ir simboli\u0173 skai\u010di\u0173.<\/p>\n<p>Likusios funkcijos yra funkcijoje <code>update_counts()<\/code>, kuri atrodo taip:<\/p>\n<p> <code><br \/>\n<span>function update_counts(text) {<\/span><br \/>\n<span> chars.innerHTML = text.length;<\/span><br \/>\n<span> words.innerHTML = text.split(' ').length;<\/span><br \/>\n<span>}<\/span><br \/>\n<\/code><\/p>\n<p>Kitaip nei tekstin\u0117je srityje, paprastam tekstui tr\u016bksta reik\u0161m\u0117s atributo; taigi <code>innerHTML<\/code>turtas naudojamas vietoj. <code>length<\/code>Eilut\u0117s savyb\u0117 nuskaito bendr\u0105 simboli\u0173 skai\u010di\u0173 .<\/p>\n<p>Nor\u0117dami suskaidyti tekst\u0105 \u012f \u017eod\u017eius, naudojame <code>text.split(' ')<\/code>, kuris padalija eilut\u0119 ties kiekvienu tarpo simboliu ir sukuria \u017eod\u017ei\u0173 masyv\u0105. Gauto masyvo ilgio savyb\u0117 suteikia \u017eod\u017ei\u0173 skai\u010di\u0173.<\/p>\n<p>Ta\u010diau naudodami \u0161\u012f kod\u0105 galite susidurti su keliais i\u0161\u0161\u016bkiais:<\/p>\n<ol>\n<li>Jis negali teisingai suskai\u010diuoti atskir\u0173 \u017eod\u017ei\u0173 eilut\u0117je be tarpo simboli\u0173.<\/li>\n<li>Jei teksto n\u0117ra, jis netiksliai prane\u0161 apie vien\u0105 \u017eod\u012f d\u0117l <code>split<\/code>veikimo b\u016bdo.<\/li>\n<\/ol>\n<p>Nor\u0117dami i\u0161spr\u0119sti pirm\u0105j\u0105 problem\u0105, apsvarstykite galimyb\u0119 i\u0161skaidyti \u012fprast\u0105 rei\u0161kin\u012f, kad b\u016bt\u0173 atsi\u017evelgta \u012f tarpo simbolius: <code>\\s<\/code>. Nor\u0117dami i\u0161spr\u0119sti antr\u0105j\u0105 problem\u0105, i\u0161filtruokite visas tu\u0161\u010dias eilutes:<\/p>\n<p> <code><br \/>\n<span> words.innerHTML = text.split(\/\\s\/).filter(function(n) { return n! = ''; }).length;<\/span><br \/>\n<\/code><\/p>\n<figure class=\"wp-block-image\"><img alt=\"\u017diniatinklio programa su pavyzdiniu tekstu, rodan\u010diu tiksl\u0173 simboli\u0173 ir \u017eod\u017ei\u0173 skai\u010di\u0173.\" class=\"wp-image\" decoding=\"async\" height=\"569\" loading=\"lazy\" src=\"https:\/\/cdn.howtogeek.blog\/wp-content\/uploads\/2025\/01\/web-app-final.webp\" title=\"\u017diniatinklio programa su pavyzdiniu tekstu, rodan\u010diu tiksl\u0173 simboli\u0173 ir \u017eod\u017ei\u0173 skai\u010di\u0173.\" width=\"960\"\/><\/figure>\n<p>Sukurti naudingas \u017einiatinklio programas galima naudojant tik kelis pagrindinius failus! Galite i\u0161pl\u0117sti \u0161i\u0105 paprast\u0105 u\u017era\u0161\u0173 program\u0117l\u0119 integruodami papildom\u0173 funkcij\u0173, pvz., naudodami <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Window\/location\" target=\"_blank\">ypatyb\u0119 window.location<\/a> , kad pasiektum\u0117te URL, arba leisdami i\u0161saugoti kelis u\u017era\u0161us kei\u010diant pavadinimus, perduodamus <code>localStorage.setItem<\/code>.<\/p>\n<h3>Papildomos \u012f\u017evalgos<\/h3>\n<h4><strong>1. Kokios yra \u0161ios \u017einiatinklio programos mokymo programos s\u0105lygos?<\/strong><\/h4>\n<p>Viskas, ko jums reikia, yra pagrindinis HTML, CSS ir JavaScript supratimas. Taip pat bus naudingi tokie \u012frankiai kaip teksto rengykl\u0117 (pvz., VSCode) ir \u017einiatinklio nar\u0161ykl\u0117.<\/p>\n<h4><strong>2. Ar galiu modifikuoti \u0161i\u0105 \u017einiatinklio program\u0105, kad prid\u0117\u010diau daugiau funkcij\u0173?<\/strong><\/h4>\n<p>absoliu\u010diai! \u0160i pamoka suteikia pagrind\u0105. Galite prid\u0117ti funkcij\u0173, toki\u0173 kaip keli\u0173 u\u017era\u0161\u0173 i\u0161saugojimas, pastab\u0173 skirstymas \u012f kategorijas ar net paie\u0161kos funkcijos \u012fdiegimas!<\/p>\n<h4><strong>3. Kaip veikia \u017einiatinklio saugyklos API?<\/strong><\/h4>\n<p>Web Storage API leid\u017eia \u017einiatinklio programoms saugoti duomenis nar\u0161ykl\u0117je. Jis saugo duomenis rakt\u0173 ir reik\u0161mi\u0173 poromis, kurios i\u0161lieka net u\u017edarius nar\u0161ykl\u0119, tod\u0117l v\u0117liau juos lengva gauti.<\/p>\n<p><a class=\"xiaomi\" href=\"https:\/\/www.howtogeek.com\/build-your-first-web-app-a-simple-word-counter\/\" rel=\"noopener noreferrer nofollow\" target=\"_blank\">\u0160altinis ir vaizdai<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Prad\u0117ti kodavimo kelion\u0119 gali atrodyti bauginanti, nes gausu kalb\u0173 ir sistem\u0173 pasirinkimo. Galb\u016bt net pagalvotum\u0117te, kaip leisti visk\u0105 tvarkyti AI! Nepaisant to, programavimas \u017einiatinklyje gali b\u016bti \u012fdomus, prieinamas ir visi\u0161kai nemokamas! K\u0105 pastatysite \u0160ioje pamokoje sukursite paprast\u0105 \u017einiatinklio program\u0105, skirt\u0105 saugoti teksto pastabas, skai\u010diuojant tuose u\u017era\u0161uose esan\u010dius simbolius ir \u017eod\u017eius. \u0160i programa nuolat i\u0161saugo duomenis, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[864,199,9],"class_list":["post-6580","post","type-post","status-publish","format-standard","hentry","category-how-to","tag-apps-web-apps","tag-programming","tag-windows"],"acf":[],"_links":{"self":[{"href":"https:\/\/howtogeek.blog\/lt\/wp-json\/wp\/v2\/posts\/6580","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/howtogeek.blog\/lt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/howtogeek.blog\/lt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/howtogeek.blog\/lt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/howtogeek.blog\/lt\/wp-json\/wp\/v2\/comments?post=6580"}],"version-history":[{"count":1,"href":"https:\/\/howtogeek.blog\/lt\/wp-json\/wp\/v2\/posts\/6580\/revisions"}],"predecessor-version":[{"id":6581,"href":"https:\/\/howtogeek.blog\/lt\/wp-json\/wp\/v2\/posts\/6580\/revisions\/6581"}],"wp:attachment":[{"href":"https:\/\/howtogeek.blog\/lt\/wp-json\/wp\/v2\/media?parent=6580"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/howtogeek.blog\/lt\/wp-json\/wp\/v2\/categories?post=6580"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/howtogeek.blog\/lt\/wp-json\/wp\/v2\/tags?post=6580"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}