{"id":52348,"date":"2019-11-06T00:00:00","date_gmt":"2019-11-05T21:00:00","guid":{"rendered":"https:\/\/prohoster.info\/blog\/blog_prohoster\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva"},"modified":"2020-02-18T14:00:02","modified_gmt":"2020-02-18T11:00:02","slug":"eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva","status":"publish","type":"post","link":"https:\/\/prohoster.info\/et\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva","title":{"rendered":"Veel 9 projekti Front-End oskuste lihvimiseks","gt_translate_keys":[{"key":"rendered","format":"text"}]},"content":{"rendered":"<p><img decoding=\"async\" alt=\"Veel 9 projekti Front-End oskuste lihvimiseks\" src=\"\/wp-content\/uploads\/2019\/11\/05c3246e5ca620b5ea66c0542b53f08a.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<h3>Sissejuhatus<\/h3>\n<p>\nOlenemata sellest, kas olete programmineerimises algaja v\u00f5i juba kogenud arendaja, on sellel alal uute kontseptsioonide ja keelte\/raamistike \u00f5ppimine h\u00e4davajalik, et trendidega sammu pidada.<\/p>\n<p>V\u00f5tame n\u00e4iteks Reacti \u2014 koodi, mille Facebook avas ainult neli aastat tagasi, on see juba saanud JavaScripti arendajate esimeseks valikuks kogu maailmas.<\/p>\n<p>Vue ja Angularil on loomulikult ka oma seaduslik f\u00e4nnide baas. Lisaks on olemas Svelte ja teised universaalsed raamistikes, nagu Next.js v\u00f5i Nuxt.js. Ja Gatsby, Gridsome, Quasar\u2026 ja veel palju muud.<\/p>\n<p>Kui soovite n\u00e4idata end kui kogenud JavaScripti arendajana, peab teil olema v\u00e4hemalt natuke kogemusi erinevate raamistike ja teekidega \u2014 lisaks sellele, et t\u00f6\u00f6tada hea vanas JS-is.<\/p>\n<p>Kuna aitame teil 2020. aastal saada front-end meistriks, olen koostanud \u00fcheksa erinevat projekti, millest iga\u00fches kasutatakse erinevaid JavaScripti raamistikke ja teeke tehnilise virnana, mille saate luua ja lisada oma portfelli. Pidage meeles, et miski ei aita teid rohkem kui praktiline loomine, seega liikuge edasi, vabastage oma m\u00f5tted ja tehke see teoks.<br \/>\n<noindex><a rel=\"nofollow\" name=\"habracut\"><\/a><\/noindex><\/p>\n<blockquote><p><noindex><a rel=\"nofollow\" href=\"https:\/\/www.edsd.ru\/\" title=\"EDISON Software - veebiarendus\"><img decoding=\"async\" alt=\"Veel 9 projekti Front-End oskuste lihvimiseks\" src=\"\/wp-content\/uploads\/2019\/11\/4f292db7c47eaa9d6e764f5a595d0edf.jpeg\" style=\"display:block;margin: 0 auto;\" \/><\/a><\/noindex><br clear=\"right\"><br \/>\nArtikkel on t\u00f5lgitud ettev\u00f5tte EDISON Software toetusel, mis <noindex><a rel=\"nofollow\" href=\"https:\/\/www.edsd.ru\/virtualnaya-primerochnaya\">loob virtuaalsed proovimisruumid mitme kaubam\u00e4rgi poodide jaoks<\/a><\/noindex>, samuti <noindex><a rel=\"nofollow\" href=\"https:\/\/www.edsd.ru\/ru\/uslugi\/testirovanie_po\">testib tarkvara<\/a><\/noindex>.<\/p><\/blockquote>\n<p><\/p>\n<h3>Filmiotsingu rakendus Reacti abil (hookidega)<\/h3>\n<p>\nEsimene asi, millega v\u00f5iks alustada, on luua filmiotsingu rakendus Reacti abil. Allpool on pilt sellest, kuidas l\u00f5plik rakendus v\u00e4lja n\u00e4eb:<\/p>\n<p><img decoding=\"async\" alt=\"Veel 9 projekti Front-End oskuste lihvimiseks\" src=\"\/wp-content\/uploads\/2019\/11\/de9873700abc86e1ec63e92704f80dcf.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Mida te \u00f5pite<\/b><br \/>\nSeda rakendust luues parandate oma Reacti oskusi, kasutades suhteliselt uut API-d Hooks. Projekti n\u00e4ites kasutatakse Reacti komponente, palju hooke, v\u00e4list API-d ja muidugi m\u00f5ned CSS-i stiilid.<\/p>\n<p><b>Tehniline virn ja funktsioonid<\/b><\/p>\n<ul>\n<li>React koos hook\u2019idega<\/li>\n<li>create-react-app<\/li>\n<li>JSX<\/li>\n<li>CSS<\/li>\n<\/ul>\n<p>\nIlma igasuguste klasside kasutamiseta pakuvad need projektid teile ideaalse sissejuhatuse funktsionaalsesse Reacti ja kindlasti aitavad teid 2020. aastal. Leiate <noindex><a rel=\"nofollow\" href=\"https:\/\/www.freecodecamp.org\/news\/how-to-build-a-movie-search-app-using-react-hooks-24eb72ddfaf7\/\">projekti n\u00e4ite siit<\/a><\/noindex>. J\u00e4rgige juhiseid v\u00f5i tehke k\u00f5ik oma maitse j\u00e4rgi.<\/p>\n<h3>Vestlusrakendus Vue abil<\/h3>\n<p>\nVeel \u00fcks suurep\u00e4rane projekt, mille jaoks saate luua vestlusrakenduse, kasutades minu lemmik JavaScripti teeki: VueJS. Rakendus n\u00e4eb v\u00e4lja umbes nii:<\/p>\n<p><img decoding=\"async\" alt=\"Veel 9 projekti Front-End oskuste lihvimiseks\" src=\"\/wp-content\/uploads\/2019\/11\/3c55136bcf260168f951e923983dc3a0.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Mida te \u00f5pite<\/b><br \/>\nK\u00e4esolevast juhendist saate teada, kuidas luua Vue rakendus nullist - luua komponente, hallata olekuid, luua marsruute, \u00fchendada kolmandate osapoolte teenustega ja isegi hallata autentimist.<\/p>\n<p><b>Tehniline virn ja funktsioonid<\/b><\/p>\n<ul>\n<li>projekt, mis kasutab<\/li>\n<li>Vuex<\/li>\n<li>Vue Router<\/li>\n<li>Vue CLI<\/li>\n<li>Pusher<\/li>\n<li>CSS<\/li>\n<\/ul>\n<p>\nSee on t\u00f5eliselt suurep\u00e4rane projekt, et alustada Vue'ga v\u00f5i t\u00e4iustada oma olemasolevaid oskusi 2020. aastal. Leiate <noindex><a rel=\"nofollow\" href=\"https:\/\/www.sitepoint.com\/pusher-vue-real-time-chat-app\/\">\u00f5petuse siit<\/a><\/noindex>.<\/p>\n<h3>Ilus ilma rakendus Angular 8-ga<\/h3>\n<p>\nSee n\u00e4ide aitab teil luua ilusa ilma rakenduse Angular 8 abil:<\/p>\n<p><img decoding=\"async\" alt=\"Veel 9 projekti Front-End oskuste lihvimiseks\" src=\"\/wp-content\/uploads\/2019\/11\/93575fb69c667f04a00c58bfeb8b9699.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Mida te \u00f5pite<\/b><br \/>\nSee projekt \u00f5petab teile v\u00e4\u00e4rtuslikke oskusi rakenduste loomisel nullist - alates disainist kuni arendamiseni, kuni rakenduse valmimiseni.<\/p>\n<p><b>Tehniline virn ja funktsioonid<\/b><\/p>\n<ul>\n<li>Angular 8<\/li>\n<li>Firebase<\/li>\n<li>Serveripoolne renderdamine<\/li>\n<li>CSS v\u00f5rgustiku ja Flexboxiga<\/li>\n<li>Mobiilis\u00f5bralik ja kohanduv<\/li>\n<li>Tumedat re\u017eiimi<\/li>\n<li>Ilus liides<\/li>\n<\/ul>\n<p>\nMulle meeldib selle p\u00f5hjaliku projekti juures t\u00f5eliselt see, et te ei \u00f5pi asju isoleeritult. Selle asemel \u00f5pite kogu arendusprotsessi - alates disainist kuni l\u00f5pliku deploymiseni.<\/p>\n<h3>To-Do rakendus Svelte abil<\/h3>\n<p>\nSvelte on nagu uus laps komponendip\u00f5hises l\u00e4henemises - v\u00e4hemalt sarnaneb see Reacti, Vue'i ja Angulariga. Ja see on \u00fcks kuumemaid uuendusi 2020. aastaks.<\/p>\n<p>To-Do rakendused pole tingimata k\u00f5ige kuumem teema, kuid see t\u00f5eliselt aitab teil lihvida oma Svelte oskusi. See n\u00e4eb v\u00e4lja j\u00e4rgmiselt:<\/p>\n<p><img decoding=\"async\" alt=\"Veel 9 projekti Front-End oskuste lihvimiseks\" src=\"\/wp-content\/uploads\/2019\/11\/1d2d414f5acbb3cfd0df5bf7ff29befd.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Mida te \u00f5pite<\/b><br \/>\nK\u00e4esolevast \u00f5pikust \u00f5ppite, kuidas luua rakendus Svelte 3 abil, alates algusest kuni l\u00f5puni. Kasutate komponente, stiile ja s\u00fcndmuste k\u00e4sitlejat.<\/p>\n<p><b>Tehniline virn ja funktsioonid<\/b><\/p>\n<ul>\n<li>Svelte 3<\/li>\n<li>Komponendid<\/li>\n<li>Stiilimine CSS kaudu<\/li>\n<li>ES 6 s\u00fcntaks<\/li>\n<\/ul>\n<p>\nHeade alustamisprojektide arv Svelte'ile ei ole kuigi suur, seet\u00f5ttu leidsin <noindex><a rel=\"nofollow\" href=\"https:\/\/medium.com\/codingthesmartway-com-blog\/building-a-svelte-3-todo-app-from-start-to-deployment-1737f72c23a6\">selle hea variandi alguseks<\/a><\/noindex>.<\/p>\n<h3>\u041f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u044d\u043b\u0435\u043a\u0442\u0440\u043e\u043d\u043d\u043e\u0439 \u043a\u043e\u043c\u043c\u0435\u0440\u0446\u0438\u0438 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e Next.js<\/h3>\n<p>\nNext.js on k\u00f5ige populaarsem raamistik React rakenduste loomiseks, mis toetab serveripoolset renderdamist v\u00e4lja pakkumistega.<\/p>\n<p>See projekt n\u00e4itab teile, kuidas luua e-kaubanduse rakendus, mis n\u00e4eb v\u00e4lja j\u00e4rgmiselt:<\/p>\n<p><img decoding=\"async\" alt=\"Veel 9 projekti Front-End oskuste lihvimiseks\" src=\"\/wp-content\/uploads\/2019\/11\/a848293ad9952a3c52bf8d059bf55ab9.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Mida te \u00f5pite<\/b><br \/>\nSelles projektis \u00f5pite arendama Next.js abil - looma uusi lehti ja komponente, andmeid tooma, samuti rakendust stiilima ja deploymentima.<\/p>\n<p><b>Tehniline virn ja funktsioonid<\/b><\/p>\n<ul>\n<li>Next.js<\/li>\n<li>Komponendid ja lehed<\/li>\n<li>Andmete valimine<\/li>\n<li>Stiilimine<\/li>\n<li>Projekti deployimine<\/li>\n<li>SSR ja SPA<\/li>\n<\/ul>\n<p>\nAlati on tore omada reaalset n\u00e4idet, n\u00e4iteks e-kaubanduse rakendust, et uusi asju \u00f5ppida. Sa saad <noindex><a rel=\"nofollow\" href=\"https:\/\/snipcart.com\/blog\/next-js-ecommerce-tutorial\">leida juhendi siit<\/a><\/noindex>.<\/p>\n<h3>\u041f\u043e\u043b\u043d\u043e\u0446\u0435\u043d\u043d\u044b\u0439 \u043c\u0443\u043b\u044c\u0442\u0438\u044f\u0437\u044b\u0447\u043d\u044b\u0439 \u0431\u043b\u043e\u0433 \u0441 Nuxt.js<\/h3>\n<p>\nNuxt.js Vue jaoks, sama mis Next.js React jaoks: suurep\u00e4rane raamistik serveripoolse renderdamise ja \u00fchesuunaliste rakenduste v\u00f5imaluste \u00fchendamiseks<br \/>\nViimane rakendus, mille sa lood, n\u00e4eb v\u00e4lja nii:<\/p>\n<p><img decoding=\"async\" alt=\"Veel 9 projekti Front-End oskuste lihvimiseks\" src=\"\/wp-content\/uploads\/2019\/11\/ba05c24c81705c454c32d363e9a74fe5.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Mida te \u00f5pite<\/b><\/p>\n<p>Selles projekti n\u00e4ites \u00f5pid, kuidas luua t\u00e4ielik veebisait, kasutades Nuxt.js \u2014 alates algsest seadistamisest kuni l\u00f5pliku juurutamiseni.<\/p>\n<p>See kasutab palju huvitavaid funktsioone, mida Nuxt pakub, n\u00e4iteks lehti ja komponente ning stiliseerimist SCSS abil.<\/p>\n<p><b>Tehniline virn ja funktsioonid<\/b><\/p>\n<ul>\n<li>Nuxt.js<\/li>\n<li>Komponendid ja lehed<\/li>\n<li>Storyblock moodul<\/li>\n<li>Mixin'id<\/li>\n<li>Vuex olekuhalduseks<\/li>\n<li>SCSS stiliseerimiseks<\/li>\n<li>Nuxt vahendajad<\/li>\n<\/ul>\n<p>\n<noindex><a rel=\"nofollow\" href=\"https:\/\/www.storyblok.com\/tp\/nuxt-js-multilanguage-website-tutorial\">See on t\u00f5eliselt \u00e4ge projekt<\/a><\/noindex>, mis sisaldab palju h\u00e4mmastavaid Nuxt.js funktsioone. Mulle isiklikult meeldib Nuxtiga t\u00f6\u00f6tada, seega peaksid seda proovima, kuna see teeb sinust ka suurep\u00e4rase Vue arendaja.<\/p>\n<h3>Blogi Gatsby'ga<\/h3>\n<p>\nGatsby on suurep\u00e4rane staatiliste saidite generaator, mis kasutab Reacti ja GraphQL-i. See on projekti tulemus:<\/p>\n<p><img decoding=\"async\" alt=\"Veel 9 projekti Front-End oskuste lihvimiseks\" src=\"\/wp-content\/uploads\/2019\/11\/4a51e59e1983da87d2110f8b06e29e33.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Mida te \u00f5pite<\/b><\/p>\n<p>Selles juhendis \u00f5pid, kuidas kasutada Gatsby't blogi loomiseks, mida kasutad oma artiklite kirjutamiseks, kasutades Reacti ja GraphQL-i.<\/p>\n<p><b>Tehniline virn ja funktsioonid<\/b><\/p>\n<ul>\n<li>Gatsby<\/li>\n<li>React<\/li>\n<li>GraphQL<\/li>\n<li>Pluginad ja teemad<\/li>\n<li>MDX\/Markdown<\/li>\n<li>Bootstrap CSS<\/li>\n<li>\u0160ablonid<\/li>\n<\/ul>\n<p>\nKui oled kunagi tahtnud blogi luua, <noindex><a rel=\"nofollow\" href=\"https:\/\/blog.bitsrc.io\/how-to-build-a-blog-with-gatsby-and-boostrap-d1270212b3dc\">on see suurep\u00e4rane n\u00e4ide<\/a><\/noindex> kuidas seda teha, kasutades Reacti ja GraphQL-i.<\/p>\n<p>Ma ei \u00fctle, et WordPress pole halb valik, kuid Gatsby abil saad luua k\u00f5rgtehnoloogilisi saite, kasutades Reacti \u2014 mis on h\u00e4mmastav kombinatsioon.<\/p>\n<h3>Blogi Gridsome'iga<\/h3>\n<p>\nGridsome Vue' jaoks... Noh, meil on seda juba olnud Next\/Nuxt'i puhul.<br \/>\nKuid sama kehtib ka Gridsome ja Gatsby kohta. M\u00f5lemad kasutavad GraphQL-i andmete kihina, kuid Gridsome kasutab VueJS-i. See on samuti h\u00e4mmastav staatiliste saitide generaator, mis aitab sul luua suurep\u00e4raseid blogisid:<\/p>\n<p><img decoding=\"async\" alt=\"Veel 9 projekti Front-End oskuste lihvimiseks\" src=\"\/wp-content\/uploads\/2019\/11\/3d0162d6aeba8481056f4dee9f25808d.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Mida te \u00f5pite<\/b><\/p>\n<p>See projekt \u00f5petab sind, kuidas luua lihtne blogi, et alustada Gridsome'i, GraphQL'i ja Markdown'iga. Samuti r\u00e4\u00e4gitakse, kuidas rakendust Netlify kaudu juurutada.<\/p>\n<p><b>Tehniline virn ja funktsioonid<\/b><\/p>\n<ul>\n<li>Gridsome<\/li>\n<li>projekt, mis kasutab<\/li>\n<li>GraphQL<\/li>\n<li>Markdown<\/li>\n<li>Netlify<\/li>\n<\/ul>\n<p>\nSee pole kindlasti k\u00f5ige p\u00f5hjalikum juhend, kuid see katab Gridsome'i p\u00f5hikontseptsioonid ja <noindex><a rel=\"nofollow\" href=\"https:\/\/www.telerik.com\/blogs\/building-a-blog-with-vue-and-markdown-using-gridsome\">Markdown ja v\u00f5ib olla hea alguspunkt<\/a><\/noindex>.<\/p>\n<h3>Audio m\u00e4ngija, mis sarnaneb SoundCloudiga, Quasariga<\/h3>\n<p>\nQuasar \u2014 see on Vue raamistik, mida saab kasutada mobiilirakenduste loomisel. Selles projektis loote helim\u00e4ngija rakenduse, n\u00e4iteks:<\/p>\n<p><img decoding=\"async\" alt=\"Veel 9 projekti Front-End oskuste lihvimiseks\" src=\"\/wp-content\/uploads\/2019\/11\/e7acef4f60608d581533c038c61a0752.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Mida te \u00f5pite<\/b><\/p>\n<p>Kui teised projektid keskenduvad peamiselt veebirakendustele, siis see n\u00e4itab teile, kuidas luua mobiilirakendust Vue ja Quasar raamistikuga.<br \/>\nTeil peab olema juba t\u00f6\u00f6le pandud Cordova koos seadistatud Android Studio\/Xcode'iga. Kui ei, siis juhendis on link Quasari veebisaidile, kus nad n\u00e4itavad, kuidas k\u00f5ik seadistada.<\/p>\n<p><b>Tehniline virn ja funktsioonid<\/b><\/p>\n<ul>\n<li>Quasar<\/li>\n<li>projekt, mis kasutab<\/li>\n<li>Cordova<\/li>\n<li>WaveSurfer<\/li>\n<li>Kasutajaliidese komponendid<\/li>\n<\/ul>\n<p>\n<noindex><a rel=\"nofollow\" href=\"https:\/\/www.learningsomethingnew.com\/how-to-build-a-sound-cloud-like-audio-player-app-with-vue-js-quasar-and-wave-surfer\">V\u00e4ike projekt<\/a><\/noindex>, mis tutvustab Quasari v\u00f5imalusi mobiilirakenduste loomisel.<br \/>\n<br \/>Allikas: <a content=\"nofollow\" rel=\"nofollow\" href=\"https:\/\/habr.com\/ru\/company\/edison\/blog\/474230\/\">habr.com<\/a><\/p>","protected":false,"gt_translate_keys":[{"key":"rendered","format":"html"}]},"excerpt":{"rendered":"<p>\u0412\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u041d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u0442\u043e\u0433\u043e, \u044f\u0432\u043b\u044f\u0435\u0442\u0435\u0441\u044c \u043b\u0438 \u0432\u044b \u043d\u043e\u0432\u0438\u0447\u043a\u043e\u043c \u0432 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438 \u0438\u043b\u0438 \u0443\u0436\u0435 \u043e\u043f\u044b\u0442\u043d\u044b\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u043c, \u0432 \u044d\u0442\u043e\u0439 \u043e\u0442\u0440\u0430\u0441\u043b\u0438 \u0438\u0437\u0443\u0447\u0435\u043d\u0438\u0435 \u043d\u043e\u0432\u044b\u0445 \u043a\u043e\u043d\u0446\u0435\u043f\u0446\u0438\u0439 \u0438 \u044f\u0437\u044b\u043a\u043e\u0432\/\u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u043e\u0432 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0447\u0442\u043e\u0431\u044b \u0443\u0441\u043f\u0435\u0432\u0430\u0442\u044c \u0437\u0430 \u0442\u0440\u0435\u043d\u0434\u0430\u043c\u0438. \u0412\u043e\u0437\u044c\u043c\u0435\u043c, \u043a \u043f\u0440\u0438\u043c\u0435\u0440\u0443, React \u2014 \u043a\u043e\u0434 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e, Facebook \u043e\u0442\u043a\u0440\u044b\u043b \u0432\u0441\u0435\u0433\u043e \u0447\u0435\u0442\u044b\u0440\u0435 \u0433\u043e\u0434\u0430 \u043d\u0430\u0437\u0430\u0434, \u043e\u043d \u0443\u0436\u0435 \u0441\u0442\u0430\u043b \u0432\u044b\u0431\u043e\u0440\u043e\u043c \u043d\u043e\u043c\u0435\u0440 \u043e\u0434\u0438\u043d \u0434\u043b\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432 JavaScript \u043f\u043e \u0432\u0441\u0435\u043c\u0443 \u043c\u0438\u0440\u0443. Vue \u0438 [&hellip;]<\/p>\n","protected":false,"gt_translate_keys":[{"key":"rendered","format":"html"}]},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[702],"tags":[],"class_list":["post-52348","post","type-post","status-publish","format-standard","hentry","category-news"],"aioseo_notices":[],"aioseo_head":"\n\t\t<!-- All in One SEO 5.0.1.1 - aioseo.com -->\n\t<meta name=\"description\" content=\"\u0412\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u041d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442.\" \/>\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"Yuri Gagarin\"\/>\n\t<link rel=\"canonical\" href=\"https:\/\/prohoster.info\/et\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva\" \/>\n\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 5.0.1.1\" \/>\n\t\t<meta property=\"og:locale\" content=\"et_EE\" \/>\n\t\t<meta property=\"og:site_name\" content=\"ProHoster | \u041a\u0443\u043f\u0438\u0442\u044c \u043d\u0430\u0434\u0435\u0436\u043d\u044b\u0439 \u0445\u043e\u0441\u0442\u0438\u043d\u0433 \u0434\u043b\u044f \u0441\u0430\u0439\u0442\u043e\u0432 \u0441 \u0437\u0430\u0449\u0438\u0442\u043e\u0439 \u043e\u0442 DDoS, VPS VDS \u0441\u0435\u0440\u0432\u0435\u0440\u044b\" \/>\n\t\t<meta property=\"og:type\" content=\"article\" \/>\n\t\t<meta property=\"og:title\" content=\"\ud83e\udd47\u0415\u0449\u0451 9 \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u0432 \u0434\u043b\u044f \u043e\u0442\u0442\u0430\u0447\u0438\u0432\u0430\u043d\u0438\u044f Front-End \u043c\u0430\u0441\u0442\u0435\u0440\u0441\u0442\u0432\u0430 | ProHoster\" \/>\n\t\t<meta property=\"og:description\" content=\"\u0412\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u041d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442.\" \/>\n\t\t<meta property=\"og:url\" content=\"https:\/\/prohoster.info\/et\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva\" \/>\n\t\t<meta property=\"og:image\" content=\"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg\" \/>\n\t\t<meta property=\"og:image:secure_url\" content=\"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg\" \/>\n\t\t<meta property=\"og:image:width\" content=\"350\" \/>\n\t\t<meta property=\"og:image:height\" content=\"350\" \/>\n\t\t<meta property=\"article:published_time\" content=\"2019-11-05T21:00:00+00:00\" \/>\n\t\t<meta property=\"article:modified_time\" content=\"2020-02-18T11:00:02+00:00\" \/>\n\t\t<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/prohoster\" \/>\n\t\t<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/prohoster\" \/>\n\t\t<!-- All in One SEO -->\n\n","aioseo_head_json":{"title":"\ud83e\udd47Veel 9 projekti Front-End oskuste hiilimiseks | ProHoster","description":"Sissejuhatus. \u00dcksk\u00f5ik, kuidas.","canonical_url":"https:\/\/prohoster.info\/et\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":null,"og:locale":"et_EE","og:site_name":"ProHoster | \u041a\u0443\u043f\u0438\u0442\u044c \u043d\u0430\u0434\u0435\u0436\u043d\u044b\u0439 \u0445\u043e\u0441\u0442\u0438\u043d\u0433 \u0434\u043b\u044f \u0441\u0430\u0439\u0442\u043e\u0432 \u0441 \u0437\u0430\u0449\u0438\u0442\u043e\u0439 \u043e\u0442 DDoS, VPS VDS \u0441\u0435\u0440\u0432\u0435\u0440\u044b","og:type":"article","og:title":"\ud83e\udd47\u0415\u0449\u0451 9 \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u0432 \u0434\u043b\u044f \u043e\u0442\u0442\u0430\u0447\u0438\u0432\u0430\u043d\u0438\u044f Front-End \u043c\u0430\u0441\u0442\u0435\u0440\u0441\u0442\u0432\u0430 | ProHoster","og:description":"\u0412\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u041d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442.","og:url":"https:\/\/prohoster.info\/et\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva","og:image":"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg","og:image:secure_url":"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg","og:image:width":350,"og:image:height":350,"article:published_time":"2019-11-05T21:00:00+00:00","article:modified_time":"2020-02-18T11:00:02+00:00","article:publisher":"https:\/\/www.facebook.com\/prohoster","article:author":"https:\/\/www.facebook.com\/prohoster"},"aioseo_meta_data":{"post_id":"52348","title":null,"description":null,"keywords":null,"keyphrases":null,"primary_term":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_url":null,"og_image_width":null,"og_image_height":null,"og_image_custom_url":null,"og_image_custom_fields":null,"og_video":null,"og_custom_url":null,"og_article_section":null,"og_article_tags":null,"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_url":null,"twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_title":null,"twitter_description":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"","isEnabled":true},"graphs":[]},"schema_type":null,"schema_type_options":null,"pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":null,"robots_max_videopreview":null,"robots_max_imagepreview":"large","priority":null,"frequency":null,"local_seo":null,"seo_analyzer_scan_date":"2026-01-24 03:19:19","breadcrumb_settings":null,"limit_modified_date":false,"reviewed_by":null,"ai":null,"created":"2021-02-28 14:23:14","updated":"2026-01-24 03:19:19","focus_keyword":null,"additional_keywords":null,"truseo_locale":null},"gt_translate_keys":[{"key":"link","format":"url"}],"_links":{"self":[{"href":"https:\/\/prohoster.info\/et\/wp-json\/wp\/v2\/posts\/52348","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prohoster.info\/et\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/prohoster.info\/et\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/prohoster.info\/et\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prohoster.info\/et\/wp-json\/wp\/v2\/comments?post=52348"}],"version-history":[{"count":0,"href":"https:\/\/prohoster.info\/et\/wp-json\/wp\/v2\/posts\/52348\/revisions"}],"wp:attachment":[{"href":"https:\/\/prohoster.info\/et\/wp-json\/wp\/v2\/media?parent=52348"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/prohoster.info\/et\/wp-json\/wp\/v2\/categories?post=52348"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/prohoster.info\/et\/wp-json\/wp\/v2\/tags?post=52348"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}