{"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\/sq\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva","title":{"rendered":"Disa 9 projekte p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar mjesht\u00ebrin\u00eb n\u00eb Front-End","gt_translate_keys":[{"key":"rendered","format":"text"}]},"content":{"rendered":"<p><img decoding=\"async\" alt=\"Disa 9 projekte p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar mjesht\u00ebrin\u00eb n\u00eb Front-End\" src=\"\/wp-content\/uploads\/2019\/11\/05c3246e5ca620b5ea66c0542b53f08a.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<h3>Hyrje<\/h3>\n<p>\nPavar\u00ebsisht n\u00ebse jeni fillestar n\u00eb programim ose nj\u00eb programues me p\u00ebrvoj\u00eb, n\u00eb k\u00ebt\u00eb industri \u00ebsht\u00eb e domosdoshme t\u00eb m\u00ebsoni koncepte t\u00eb reja dhe gjuh\u00eb\/framework-e p\u00ebr t\u00eb q\u00ebndruar n\u00eb trend.<\/p>\n<p>Merrni p\u00ebr shembull React - kodi i t\u00eb cilit, Facebook e kreu vet\u00ebm kat\u00ebr vjet m\u00eb par\u00eb, tashm\u00eb \u00ebsht\u00eb zgjedhja num\u00ebr nj\u00eb p\u00ebr zhvilluesit e JavaScript n\u00eb mbar\u00eb bot\u00ebn.<\/p>\n<p>Sigurisht, Vue dhe Angular gjithashtu kan\u00eb baz\u00ebn e tyre t\u00eb merituar t\u00eb adhuruesve. Dhe ka gjithashtu Svelte dhe frameworke t\u00eb tjera universale, si Next.js ose Nuxt.js. Edhe Gatsby, Gridsome, dhe Quasar\u2026 dhe shum\u00eb m\u00eb tep\u00ebr.<\/p>\n<p>N\u00ebse d\u00ebshironi t\u00eb shfaqeni si nj\u00eb zhvillues i p\u00ebrvoj\u00ebs n\u00eb JavaScript, duhet t\u00eb keni t\u00eb pakt\u00ebn ndonj\u00eb p\u00ebrvoj\u00eb me frameworke dhe biblioteka t\u00eb ndryshme - p\u00ebrve\u00e7 se t\u00eb punoni me JS t\u00eb mir\u00eb t\u00eb vjet\u00ebr.<\/p>\n<p>P\u00ebr t'ju ndihmuar t\u00eb b\u00ebheni mjesht\u00ebr i frontend-it n\u00eb vitin 2020, kam mbledhur n\u00ebnt\u00eb projekte t\u00eb ndryshme, secili dedikuar frameworkeve dhe biblioteko JavaScript si nj\u00eb grumbull teknologjik q\u00eb mund t\u00eb krijoni dhe shtoni n\u00eb portofolin tuaj. Mos e harroni, asgj\u00eb nuk ju ndihmon m\u00eb shum\u00eb sesa t\u00eb krijoni gj\u00ebra n\u00eb praktik\u00eb, k\u00ebshtu q\u00eb shkoni p\u00ebrpara, aktivizoni mendjen tuaj dhe b\u00ebjeni t\u00eb mundur.<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 - zhvillim webi\"><img decoding=\"async\" alt=\"Disa 9 projekte p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar mjesht\u00ebrin\u00eb n\u00eb Front-End\" src=\"\/wp-content\/uploads\/2019\/11\/4f292db7c47eaa9d6e764f5a595d0edf.jpeg\" style=\"display:block;margin: 0 auto;\" \/><\/a><\/noindex><br clear=\"right\"><br \/>\nArtikulli \u00ebsht\u00eb p\u00ebrkthyer me mb\u00ebshtetje nga kompania EDISON Software, e cila <noindex><a rel=\"nofollow\" href=\"https:\/\/www.edsd.ru\/virtualnaya-primerochnaya\">krijon kabina virtuale p\u00ebr dyqanet me shum\u00eb marka<\/a><\/noindex>, si dhe <noindex><a rel=\"nofollow\" href=\"https:\/\/www.edsd.ru\/ru\/uslugi\/testirovanie_po\">teston softuerin<\/a><\/noindex>.<\/p><\/blockquote>\n<p><\/p>\n<h3>Aplikacion p\u00ebr k\u00ebrkimin e filmave me React (me hooks)<\/h3>\n<p>\nE para nga \u00e7far\u00eb mund t\u00eb filloni, \u00ebsht\u00eb t\u00eb krijoni nj\u00eb aplikacion p\u00ebr k\u00ebrkimin e filmave me React. M\u00eb posht\u00eb \u00ebsht\u00eb nj\u00eb imazh se si do t\u00eb duket aplikacioni p\u00ebrfundimtar:<\/p>\n<p><img decoding=\"async\" alt=\"Disa 9 projekte p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar mjesht\u00ebrin\u00eb n\u00eb Front-End\" src=\"\/wp-content\/uploads\/2019\/11\/de9873700abc86e1ec63e92704f80dcf.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>\u00c7far\u00eb do t\u00eb m\u00ebsoni<\/b><br \/>\nDuke krijuar k\u00ebt\u00eb aplikacion, do t\u00eb p\u00ebrmir\u00ebsoni aft\u00ebsit\u00eb tuaja n\u00eb React, duke p\u00ebrdorur nj\u00eb API mjaft t\u00eb ri, Hook. N\u00eb shembullin e projektit p\u00ebrdoren komponent\u00eb React, shum\u00eb hooks, nj\u00eb API jasht\u00eb dhe, sigurisht, disa stile CSS.<\/p>\n<p><b>Grumbulli teknik dhe ve\u00e7orit\u00eb<\/b><\/p>\n<ul>\n<li>React me hooks<\/li>\n<li>create-react-app<\/li>\n<li>JSX<\/li>\n<li>CSS<\/li>\n<\/ul>\n<p>\nPa p\u00ebrdorimin e klasave, k\u00ebto projekte ju japin nj\u00eb pik\u00eb t\u00eb shk\u00eblqyer hyr\u00ebse n\u00eb React-in funksional dhe me siguri do t'ju ndihmojn\u00eb n\u00eb vitin 2020. Mund t\u00eb gjeni <noindex><a rel=\"nofollow\" href=\"https:\/\/www.freecodecamp.org\/news\/how-to-build-a-movie-search-app-using-react-hooks-24eb72ddfaf7\/\">nj\u00eb shembull projekti k\u00ebtu<\/a><\/noindex>. Ndiqni udh\u00ebzimet ose b\u00ebni gjith\u00e7ka sipas d\u00ebshir\u00ebs tuaj.<\/p>\n<h3>Aplikacioni i bised\u00ebs me Vue<\/h3>\n<p>\nNj\u00eb tjet\u00ebr projekt i shk\u00eblqyer p\u00ebr ju \u00ebsht\u00eb t\u00eb krijoni nj\u00eb aplikacion bisedash, duke p\u00ebrdorur bibliotek\u00ebn time t\u00eb preferuar JavaScript: VueJS. Aplikacioni do t\u00eb duket k\u00ebshtu:<\/p>\n<p><img decoding=\"async\" alt=\"Disa 9 projekte p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar mjesht\u00ebrin\u00eb n\u00eb Front-End\" src=\"\/wp-content\/uploads\/2019\/11\/3c55136bcf260168f951e923983dc3a0.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>\u00c7far\u00eb do t\u00eb m\u00ebsoni<\/b><br \/>\nNga nga udh\u00ebzimi, do t\u00eb m\u00ebsoni se si t\u00eb krijoni nj\u00eb aplikacion Vue nga zero \u2014 p\u00ebr t\u00eb krijuar komponent\u00eb, p\u00ebr t\u00eb trajtuar gjendjet, p\u00ebr t\u00eb krijuar ruta, p\u00ebr t'u lidhur me sh\u00ebrbime t\u00eb jashtme dhe madje p\u00ebr t\u00eb trajtuar autentifikimin.<\/p>\n<p><b>Grumbulli teknik dhe ve\u00e7orit\u00eb<\/b><\/p>\n<ul>\n<li>Vue<\/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>\nKy \u00ebsht\u00eb v\u00ebrtet nj\u00eb projekt i shk\u00eblqyer p\u00ebr t\u00eb filluar t\u00eb punoni me Vue ose p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar aft\u00ebsit\u00eb tuaja ekzistuese p\u00ebr zhvillimin n\u00eb vitin 2020. Mund t\u00eb gjeni <noindex><a rel=\"nofollow\" href=\"https:\/\/www.sitepoint.com\/pusher-vue-real-time-chat-app\/\">udh\u00ebzimin k\u00ebtu<\/a><\/noindex>.<\/p>\n<h3>Nj\u00eb aplikacion i bukur p\u00ebr parashikimin e motit me Angular 8<\/h3>\n<p>\nKy shembull do t'ju ndihmoj\u00eb t\u00eb krijoni nj\u00eb aplikacion t\u00eb bukur p\u00ebr parashikimin e motit me Angular 8:<\/p>\n<p><img decoding=\"async\" alt=\"Disa 9 projekte p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar mjesht\u00ebrin\u00eb n\u00eb Front-End\" src=\"\/wp-content\/uploads\/2019\/11\/93575fb69c667f04a00c58bfeb8b9699.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>\u00c7far\u00eb do t\u00eb m\u00ebsoni<\/b><br \/>\nKy projekt do t'ju m\u00ebsoj\u00eb aft\u00ebsi t\u00eb vlefshme n\u00eb krijimin e aplikacioneve nga zero \u2014 duke filluar nga dizajni dhe duke p\u00ebrfunduar me zhvillimin, deri n\u00eb aplikacionin e gatsh\u00ebm p\u00ebr t\u00eb u deploy.<\/p>\n<p><b>Grumbulli teknik dhe ve\u00e7orit\u00eb<\/b><\/p>\n<ul>\n<li>Angular 8<\/li>\n<li>Firebase<\/li>\n<li>Renderimi n\u00eb server<\/li>\n<li>CSS me grid dhe Flexbox<\/li>\n<li>Mik p\u00ebr celular dhe responsivitet<\/li>\n<li>Regjimi i err\u00ebt<\/li>\n<li>Interfejs i bukur<\/li>\n<\/ul>\n<p>\nAjo q\u00eb m\u00eb p\u00eblqen v\u00ebrtet shum\u00eb n\u00eb k\u00ebt\u00eb projekt gjith\u00ebp\u00ebrfshir\u00ebs \u00ebsht\u00eb se nuk m\u00ebsoni gj\u00ebrat n\u00eb m\u00ebnyr\u00eb izoluese. N\u00eb vend t\u00eb k\u00ebsaj, ju m\u00ebsoni t\u00eb gjith\u00eb procesin e zhvillimit \u2014 nga dizajni deri te deploy final.<\/p>\n<h3>Aplikacion To-Do me Svelte<\/h3>\n<p>\nSvelte \u00ebsht\u00eb si nj\u00eb f\u00ebmij\u00eb i ri n\u00eb qasjen komponent, t\u00eb pakt\u00ebn e ngjashme me React, Vue dhe Angular. Dhe kjo \u00ebsht\u00eb nj\u00eb nga risit\u00eb m\u00eb t\u00eb nxehta p\u00ebr vitin 2020.<\/p>\n<p>Aplikacionet To-Do nuk jan\u00eb domosdoshm\u00ebrisht tema m\u00eb e nxeht\u00eb, por kjo do t'ju ndihmoj\u00eb v\u00ebrtet t\u00eb rafinoni aft\u00ebsit\u00eb tuaja n\u00eb Svelte. Kjo do t\u00eb duket k\u00ebshtu:<\/p>\n<p><img decoding=\"async\" alt=\"Disa 9 projekte p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar mjesht\u00ebrin\u00eb n\u00eb Front-End\" src=\"\/wp-content\/uploads\/2019\/11\/1d2d414f5acbb3cfd0df5bf7ff29befd.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>\u00c7far\u00eb do t\u00eb m\u00ebsoni<\/b><br \/>\nNga ky udh\u00ebzim do t\u00eb m\u00ebsoni se si t\u00eb krijoni nj\u00eb aplikacion me Svelte 3, nga fillimi n\u00eb fund. Do t\u00eb p\u00ebrdorni komponent\u00eb, stilizim dhe trajtues t\u00eb ngjarjeve.<\/p>\n<p><b>Grumbulli teknik dhe ve\u00e7orit\u00eb<\/b><\/p>\n<ul>\n<li>Svelte 3<\/li>\n<li>Komponent\u00ebt<\/li>\n<li>Stilizimi me CSS<\/li>\n<li>Sintaksa ES 6<\/li>\n<\/ul>\n<p>\nNuk ka shum\u00eb projekte t\u00eb mira fillestare p\u00ebr Svelte, prandaj une gjeta <noindex><a rel=\"nofollow\" href=\"https:\/\/medium.com\/codingthesmartway-com-blog\/building-a-svelte-3-todo-app-from-start-to-deployment-1737f72c23a6\">k\u00ebt\u00eb variant t\u00eb mir\u00eb p\u00ebr t\u00eb filluar<\/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 \u00ebsht\u00eb framework-u m\u00eb popullor p\u00ebr krijimin e aplikacioneve React, t\u00eb cilat mb\u00ebshtesin renderimin n\u00eb server nga kutia.<\/p>\n<p>Ky projekt do t'ju tregoj\u00eb se si t\u00eb krijoni nj\u00eb aplikacion p\u00ebr tregtin\u00eb elektronike, i cili duket si kjo:<\/p>\n<p><img decoding=\"async\" alt=\"Disa 9 projekte p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar mjesht\u00ebrin\u00eb n\u00eb Front-End\" src=\"\/wp-content\/uploads\/2019\/11\/a848293ad9952a3c52bf8d059bf55ab9.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>\u00c7far\u00eb do t\u00eb m\u00ebsoni<\/b><br \/>\nN\u00eb k\u00ebt\u00eb projekt do t\u00eb m\u00ebsoni si t\u00eb zhvilloni me Next.js \u2014 krijimi i faqeve dhe komponent\u00ebve t\u00eb rinj, nxjerrja e t\u00eb dh\u00ebnave, si dhe stilizimi dhe deploy i aplikacionit Next.<\/p>\n<p><b>Grumbulli teknik dhe ve\u00e7orit\u00eb<\/b><\/p>\n<ul>\n<li>Next.js<\/li>\n<li>Komponent\u00ebt dhe faqet<\/li>\n<li>P\u00ebrzgjedhja e t\u00eb dh\u00ebnave<\/li>\n<li>Stilizimi<\/li>\n<li>Deployimi i projektit<\/li>\n<li>SSR dhe SPA<\/li>\n<\/ul>\n<p>\n\u00cbsht\u00eb gjithmon\u00eb e shk\u00eblqyer t\u00eb kesh nj\u00eb shembull t\u00eb v\u00ebrtet\u00eb, si\u00e7 \u00ebsht\u00eb nj\u00eb aplikacion p\u00ebr tregtin\u00eb elektronike, p\u00ebr t\u00eb m\u00ebsuar di\u00e7ka t\u00eb re. Ju mund t\u00eb <noindex><a rel=\"nofollow\" href=\"https:\/\/snipcart.com\/blog\/next-js-ecommerce-tutorial\">gjeni nj\u00eb udh\u00ebzues k\u00ebtu<\/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 p\u00ebr Vue, \u00ebsht\u00eb e nj\u00ebjta gj\u00eb si Next.js p\u00ebr React: nj\u00eb framework i shk\u00eblqyer p\u00ebr t\u00eb bashkuar mund\u00ebsit\u00eb e renderimit n\u00eb an\u00ebn e serverit dhe aplikacioneve nj\u00ebfa\u00e7\u00ebshe<br \/>\nAplikacioni i fundit q\u00eb mund t\u00eb krijoni do t\u00eb duket k\u00ebshtu:<\/p>\n<p><img decoding=\"async\" alt=\"Disa 9 projekte p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar mjesht\u00ebrin\u00eb n\u00eb Front-End\" src=\"\/wp-content\/uploads\/2019\/11\/ba05c24c81705c454c32d363e9a74fe5.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>\u00c7far\u00eb do t\u00eb m\u00ebsoni<\/b><\/p>\n<p>N\u00eb k\u00ebt\u00eb shembull projekti do t\u00eb m\u00ebsoni si t\u00eb krijoni nj\u00eb uebfaqe t\u00eb plot\u00eb duke p\u00ebrdorur Nuxt.js \u2014 nga konfigurimi fillestar deri te implementimi p\u00ebrfundimtar.<\/p>\n<p>Ai p\u00ebrdor shum\u00eb funksione interesante q\u00eb ofron Nuxt, si\u00e7 jan\u00eb faqet dhe komponent\u00ebt, si dhe stilizimi me SCSS.<\/p>\n<p><b>Grumbulli teknik dhe ve\u00e7orit\u00eb<\/b><\/p>\n<ul>\n<li>Nuxt.js<\/li>\n<li>Komponent\u00ebt dhe faqet<\/li>\n<li>Moduli Storyblock<\/li>\n<li>Mikser\u00ebt<\/li>\n<li>Vuex p\u00ebr menaxhimin e gjendjes<\/li>\n<li>SCSS p\u00ebr stilizimin<\/li>\n<li>Middleware-t e Nuxt<\/li>\n<\/ul>\n<p>\n<noindex><a rel=\"nofollow\" href=\"https:\/\/www.storyblok.com\/tp\/nuxt-js-multilanguage-website-tutorial\">Ky \u00ebsht\u00eb nj\u00eb projekt v\u00ebrtet i shk\u00eblqyer<\/a><\/noindex>, i cili p\u00ebrfshin shum\u00eb mund\u00ebsi t\u00eb shk\u00eblqyera t\u00eb Nuxt.js. Un\u00eb personalisht e dua t\u00eb punoj me Nuxt, k\u00ebshtu q\u00eb ju duhet ta provoni, sepse gjithashtu do t'ju b\u00ebj\u00eb nj\u00eb zhvillues t\u00eb shk\u00eblqyer Vue.<\/p>\n<h3>Blog me Gatsby<\/h3>\n<p>\nGatsby \u00ebsht\u00eb nj\u00eb gjenerator i shk\u00eblqyer i faqeve statike, q\u00eb p\u00ebrdor React dhe GraphQL. Ky \u00ebsht\u00eb rezultati i projektit:<\/p>\n<p><img decoding=\"async\" alt=\"Disa 9 projekte p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar mjesht\u00ebrin\u00eb n\u00eb Front-End\" src=\"\/wp-content\/uploads\/2019\/11\/4a51e59e1983da87d2110f8b06e29e33.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>\u00c7far\u00eb do t\u00eb m\u00ebsoni<\/b><\/p>\n<p>N\u00eb k\u00ebt\u00eb udh\u00ebzues do t\u00eb m\u00ebsoni si t\u00eb p\u00ebrdorni Gatsby p\u00ebr t\u00eb krijuar nj\u00eb blog, q\u00eb do t\u00eb p\u00ebrdorni p\u00ebr t\u00eb shkruar artikujt tuaj, duke p\u00ebrdorur React dhe GraphQL.<\/p>\n<p><b>Grumbulli teknik dhe ve\u00e7orit\u00eb<\/b><\/p>\n<ul>\n<li>Gatsby<\/li>\n<li>React<\/li>\n<li>GraphQL<\/li>\n<li>Plugins dhe tema<\/li>\n<li>MDX\/Markdown<\/li>\n<li>Bootstrap CSS<\/li>\n<li>Shabllonat<\/li>\n<\/ul>\n<p>\nN\u00ebse ndonj\u00ebher\u00eb keni d\u00ebshiruar t\u00eb krijoni nj\u00eb blog, <noindex><a rel=\"nofollow\" href=\"https:\/\/blog.bitsrc.io\/how-to-build-a-blog-with-gatsby-and-boostrap-d1270212b3dc\">kjo \u00ebsht\u00eb nj\u00eb shembull i shk\u00eblqyer<\/a><\/noindex> se si ta b\u00ebni at\u00eb, duke p\u00ebrdorur React dhe GraphQL.<\/p>\n<p>Nuk po them se WordPress \u00ebsht\u00eb nj\u00eb zgjedhje e keqe, por me Gatsby mund t\u00eb krijoni faqe me performanc\u00eb t\u00eb lart\u00eb, duke p\u00ebrdorur React \u2014 q\u00eb \u00ebsht\u00eb nj\u00eb kombinim befasues.<\/p>\n<h3>Blog me Gridsome<\/h3>\n<p>\nGridsome p\u00ebr Vue... Mir\u00eb, ne e kemi pasur k\u00ebt\u00eb tashm\u00eb me Next\/Nuxt.<br \/>\nPor e nj\u00ebjta vlen p\u00ebr Gridsome dhe Gatsby. T\u00eb dyja p\u00ebrdorin GraphQL si nj\u00eb shtres\u00eb t\u00eb dh\u00ebnash, por Gridsome p\u00ebrdor VueJS. Ky \u00ebsht\u00eb gjithashtu nj\u00eb gjenerator i mrekulluesh\u00ebm i faqeve statike q\u00eb do t'ju ndihmoj\u00eb t\u00eb krijoni bloge t\u00eb shk\u00eblqyera:<\/p>\n<p><img decoding=\"async\" alt=\"Disa 9 projekte p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar mjesht\u00ebrin\u00eb n\u00eb Front-End\" src=\"\/wp-content\/uploads\/2019\/11\/3d0162d6aeba8481056f4dee9f25808d.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>\u00c7far\u00eb do t\u00eb m\u00ebsoni<\/b><\/p>\n<p>Ky projekt do t'ju m\u00ebsoj\u00eb si t\u00eb krijoni nj\u00eb blog t\u00eb thjesht\u00eb p\u00ebr t\u00eb filluar me Gridsome, GraphQL dhe Markdown. Ai gjithashtu shqyrton si t\u00eb implementoni aplikacionin p\u00ebrmes Netlify.<\/p>\n<p><b>Grumbulli teknik dhe ve\u00e7orit\u00eb<\/b><\/p>\n<ul>\n<li>Gridsome<\/li>\n<li>Vue<\/li>\n<li>GraphQL<\/li>\n<li>Markdown<\/li>\n<li>Netlify<\/li>\n<\/ul>\n<p>\nSigurisht, ky nuk \u00ebsht\u00eb udh\u00ebzuesi m\u00eb i plot\u00eb, por ai mbulon konceptet kryesore t\u00eb Gridsome dhe <noindex><a rel=\"nofollow\" href=\"https:\/\/www.telerik.com\/blogs\/building-a-blog-with-vue-and-markdown-using-gridsome\">Markdown dhe mund t\u00eb jet\u00eb nj\u00eb pik\u00eb e mir\u00eb fillestare<\/a><\/noindex>.<\/p>\n<h3>Nj\u00eb lojtar audio, i ngjash\u00ebm me SoundCloud, me Quasar<\/h3>\n<p>\nQuasar \u2014 \u00ebsht\u00eb nj\u00eb tjet\u00ebr korniz\u00eb Vue q\u00eb mund t\u00eb p\u00ebrdoret p\u00ebr krijimin e aplikacioneve mobile. N\u00eb k\u00ebt\u00eb projekt do t\u00eb krijoni nj\u00eb aplikacion p\u00ebr player audio, p\u00ebr shembull:<\/p>\n<p><img decoding=\"async\" alt=\"Disa 9 projekte p\u00ebr t\u00eb p\u00ebrmir\u00ebsuar mjesht\u00ebrin\u00eb n\u00eb Front-End\" src=\"\/wp-content\/uploads\/2019\/11\/e7acef4f60608d581533c038c61a0752.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>\u00c7far\u00eb do t\u00eb m\u00ebsoni<\/b><\/p>\n<p>Nd\u00ebrsa projekte t\u00eb tjera p\u00ebrqendrohen kryesisht n\u00eb aplikacionet web, ky do t'ju tregoj\u00eb se si t\u00eb krijoni nj\u00eb aplikacion mobil duke p\u00ebrdorur Vue dhe korniz\u00ebn Quasar.<br \/>\nT\u00eb keni tashm\u00eb nj\u00eb Cordova funksional me Android Studio\/Xcode t\u00eb konfiguruar. N\u00ebse jo, udh\u00ebzimi p\u00ebrmban nj\u00eb lidhje n\u00eb faqen e internetit t\u00eb Quasar, ku ata tregojn\u00eb si t\u00eb konfiguroni gjith\u00e7ka.<\/p>\n<p><b>Grumbulli teknik dhe ve\u00e7orit\u00eb<\/b><\/p>\n<ul>\n<li>Quasar<\/li>\n<li>Vue<\/li>\n<li>Cordova<\/li>\n<li>WaveSurfer<\/li>\n<li>Komponentet UI<\/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\">Nj\u00eb projekt i vog\u00ebl<\/a><\/noindex>, q\u00eb demonstrojn\u00eb mund\u00ebsit\u00eb e Quasar p\u00ebr krijimin e aplikacioneve mobile.<br \/>\n<br \/>Burimi: <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.2 - 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\/sq\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva\" \/>\n\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 5.0.2\" \/>\n\t\t<meta property=\"og:locale\" content=\"sq_AL\" \/>\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\/sq\/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\udd479 projekte t\u00eb tjera p\u00ebr rafinimin e aft\u00ebsive Front-End | ProHoster","description":"Hyrje Pavar\u00ebsisht nga.","canonical_url":"https:\/\/prohoster.info\/sq\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":null,"og:locale":"sq_AL","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\/sq\/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\/sq\/wp-json\/wp\/v2\/posts\/52348","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prohoster.info\/sq\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/prohoster.info\/sq\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/prohoster.info\/sq\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prohoster.info\/sq\/wp-json\/wp\/v2\/comments?post=52348"}],"version-history":[{"count":0,"href":"https:\/\/prohoster.info\/sq\/wp-json\/wp\/v2\/posts\/52348\/revisions"}],"wp:attachment":[{"href":"https:\/\/prohoster.info\/sq\/wp-json\/wp\/v2\/media?parent=52348"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/prohoster.info\/sq\/wp-json\/wp\/v2\/categories?post=52348"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/prohoster.info\/sq\/wp-json\/wp\/v2\/tags?post=52348"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}