{"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\/nl\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva","title":{"rendered":"Nog 9 projecten om je Front-End vaardigheden te verfijnen.","gt_translate_keys":[{"key":"rendered","format":"text"}]},"content":{"rendered":"<p><img decoding=\"async\" alt=\"Nog 9 projecten om je Front-End vaardigheden te verfijnen.\" src=\"\/wp-content\/uploads\/2019\/11\/05c3246e5ca620b5ea66c0542b53f08a.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<h3>Inleiding<\/h3>\n<p>\nOngeacht of u een beginner in programmeren bent of al een ervaren ontwikkelaar, het is essentieel om nieuwe concepten en talen\/frameworks te leren om bij te blijven met de trends in deze sector.<\/p>\n<p>Neem bijvoorbeeld React \u2014 de code waarvan Facebook vier jaar geleden heeft vrijgegeven, het is al de nummer \u00e9\u00e9n keuze voor JavaScript-ontwikkelaars over de hele wereld.<\/p>\n<p>Vue en Angular hebben natuurlijk ook hun legitieme aanhang. En dan is er Svelte en andere veelzijdige frameworks zoals Next.js of Nuxt.js. En Gatsby, Gridsome, Quasar\u2026 en nog veel meer.<\/p>\n<p>Als u zich wilt onderscheiden als een ervaren JavaScript-ontwikkelaar, moet u ten minste enige ervaring hebben met verschillende frameworks en bibliotheken \u2014 naast het werken met goed, oud JS.<\/p>\n<p>Om u te helpen een front-end expert te worden in 2020, heb ik negen verschillende projecten samengesteld, elk gewijd aan verschillende JavaScript-frameworks en -bibliotheken als technische stack, die u kunt bouwen en aan uw portfolio kunt toevoegen. Vergeet niet dat niets helpt beter dan dingen praktisch maken, dus ga ervoor, zet uw geest aan het werk en maak het mogelijk.<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 - webontwikkeling\"><img decoding=\"async\" alt=\"Nog 9 projecten om je Front-End vaardigheden te verfijnen.\" src=\"\/wp-content\/uploads\/2019\/11\/4f292db7c47eaa9d6e764f5a595d0edf.jpeg\" style=\"display:block;margin: 0 auto;\" \/><\/a><\/noindex><br clear=\"right\"><br \/>\nDit artikel is vertaald met de ondersteuning van EDISON Software, dat <noindex><a rel=\"nofollow\" href=\"https:\/\/www.edsd.ru\/virtualnaya-primerochnaya\">maakt virtuele paskamers voor multimerken winkels<\/a><\/noindex>, evenals <noindex><a rel=\"nofollow\" href=\"https:\/\/www.edsd.ru\/ru\/uslugi\/testirovanie_po\">test software<\/a><\/noindex>.<\/p><\/blockquote>\n<p><\/p>\n<h3>Filmzoek-app met React (met hooks)<\/h3>\n<p>\nHet eerste waarmee u zou kunnen beginnen, is het cre\u00ebren van een filmzoek-app met React. Hieronder staat een afbeelding van hoe de uiteindelijke app eruit zal zien:<\/p>\n<p><img decoding=\"async\" alt=\"Nog 9 projecten om je Front-End vaardigheden te verfijnen.\" src=\"\/wp-content\/uploads\/2019\/11\/de9873700abc86e1ec63e92704f80dcf.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Wat u zult leren<\/b><br \/>\nDoor deze app te bouwen, zult u uw React-vaardigheden verbeteren door gebruik te maken van de relatief nieuwe Hooks API. Dit projectvoorbeeld gebruikt React-componenten, veel hooks, een externe API en, natuurlijk, een beetje CSS-styling.<\/p>\n<p><b>Technische stack en functies<\/b><\/p>\n<ul>\n<li>React met hooks<\/li>\n<li>create-react-app<\/li>\n<li>JSX<\/li>\n<li>CSS<\/li>\n<\/ul>\n<p>\nZonder het gebruik van enige klassen, geven deze projecten u de perfecte instap in functioneel React en zullen ze u zeker helpen in 2020. U kunt een <noindex><a rel=\"nofollow\" href=\"https:\/\/www.freecodecamp.org\/news\/how-to-build-a-movie-search-app-using-react-hooks-24eb72ddfaf7\/\">voorbeeldproject hier vinden<\/a><\/noindex>. Volg de instructies of maak er uw eigen twist aan.<\/p>\n<h3>Chat-app met Vue<\/h3>\n<p>\nEen ander geweldig project voor u is om een chat-app te cre\u00ebren met mijn favoriete JavaScript-bibliotheek: VueJS. De app zal er ongeveer zo uitzien:<\/p>\n<p><img decoding=\"async\" alt=\"Nog 9 projecten om je Front-End vaardigheden te verfijnen.\" src=\"\/wp-content\/uploads\/2019\/11\/3c55136bcf260168f951e923983dc3a0.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Wat u zult leren<\/b><br \/>\nIn deze handleiding leer je hoe je een Vue-applicatie vanaf nul doet \u2013 componenten maakt, toestanden beheert, routes opzet, verbinding maakt met externe diensten en zelfs authenticatie afhandelt.<\/p>\n<p><b>Technische stack en functies<\/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>\nDit is echt een geweldig project om te beginnen met Vue of om je bestaande vaardigheden te verbeteren voor webontwikkeling in 2020. Je kunt <noindex><a rel=\"nofollow\" href=\"https:\/\/www.sitepoint.com\/pusher-vue-real-time-chat-app\/\">de tutorial hier vinden<\/a><\/noindex>.<\/p>\n<h3>Mooie weersvoorspellingsapplicatie met Angular 8<\/h3>\n<p>\nDit voorbeeld helpt je een mooie weersvoorspellingsapplicatie te maken met Angular 8:<\/p>\n<p><img decoding=\"async\" alt=\"Nog 9 projecten om je Front-End vaardigheden te verfijnen.\" src=\"\/wp-content\/uploads\/2019\/11\/93575fb69c667f04a00c58bfeb8b9699.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Wat u zult leren<\/b><br \/>\nDit project leert je waardevolle vaardigheden bij het maken van applicaties vanaf nul \u2013 van ontwerp tot ontwikkeling, tot een kant-en-klare applicatie.<\/p>\n<p><b>Technische stack en functies<\/b><\/p>\n<ul>\n<li>Angular 8<\/li>\n<li>Firebase<\/li>\n<li>Server-side rendering<\/li>\n<li>CSS met grid en Flexbox<\/li>\n<li>Mobielvriendelijk en responsief<\/li>\n<li>Donkere modus<\/li>\n<li>Prachtige interface<\/li>\n<\/ul>\n<p>\nWat ik echt heel leuk vind aan dit uitgebreide project, is dat je dingen niet in isolatie studeert. In plaats daarvan leer je het hele ontwikkelproces \u2013 van ontwerp tot de uiteindelijke implementatie.<\/p>\n<h3>To-Do-applicatie met Svelte<\/h3>\n<p>\nSvelte is als de nieuwe jongen in de componentbenadering \u2013 op zijn minst vergelijkbaar met React, Vue en Angular. En het is een van de heetste nieuwtjes van 2020.<\/p>\n<p>To-Do-applicaties zijn misschien niet het heetste onderwerp, maar ze helpen je echt om je Svelte-vaardigheden te verfijnen. Het zal er als volgt uitzien:<\/p>\n<p><img decoding=\"async\" alt=\"Nog 9 projecten om je Front-End vaardigheden te verfijnen.\" src=\"\/wp-content\/uploads\/2019\/11\/1d2d414f5acbb3cfd0df5bf7ff29befd.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Wat u zult leren<\/b><br \/>\nIn deze tutorial leer je hoe je een applicatie maakt met Svelte 3, van begin tot eind. Je zult componenten, styling en eventhandlers gebruiken.<\/p>\n<p><b>Technische stack en functies<\/b><\/p>\n<ul>\n<li>Svelte 3<\/li>\n<li>Componenten<\/li>\n<li>Styling met CSS<\/li>\n<li>ES6-syntaxis<\/li>\n<\/ul>\n<p>\nEr zijn niet veel goede startprojecten voor Svelte, dus ik heb <noindex><a rel=\"nofollow\" href=\"https:\/\/medium.com\/codingthesmartway-com-blog\/building-a-svelte-3-todo-app-from-start-to-deployment-1737f72c23a6\">deze goede optie gevonden om te beginnen<\/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 is het populairste framework voor het bouwen van React-applicaties die server-side rendering out of the box ondersteunen.<\/p>\n<p>Dit project laat je zien hoe je een e-commerceapplicatie kunt maken die er als volgt uitziet:<\/p>\n<p><img decoding=\"async\" alt=\"Nog 9 projecten om je Front-End vaardigheden te verfijnen.\" src=\"\/wp-content\/uploads\/2019\/11\/a848293ad9952a3c52bf8d059bf55ab9.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Wat u zult leren<\/b><br \/>\nIn dit project leer je hoe je ontwikkelt met Next.js \u2013 nieuwe pagina's en componenten maakt, gegevens ophaalt en de Next-applicatie stylet en implementeert.<\/p>\n<p><b>Technische stack en functies<\/b><\/p>\n<ul>\n<li>Next.js<\/li>\n<li>Componenten en pagina's<\/li>\n<li>Gegevenssampling<\/li>\n<li>Styling<\/li>\n<li>Project implementeren<\/li>\n<li>SSR en SPA<\/li>\n<\/ul>\n<p>\nHet is altijd geweldig om een echt voorbeeld te hebben, zoals een e-commerce applicatie, om iets nieuws te leren. Je kunt <noindex><a rel=\"nofollow\" href=\"https:\/\/snipcart.com\/blog\/next-js-ecommerce-tutorial\">hier een tutorial vinden<\/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 voor Vue, hetzelfde als Next.js voor React: een geweldige framework voor het combineren van server-side rendering capaciteiten en single-page applicaties<br \/>\nDe laatste applicatie die je kunt maken, ziet er als volgt uit:<\/p>\n<p><img decoding=\"async\" alt=\"Nog 9 projecten om je Front-End vaardigheden te verfijnen.\" src=\"\/wp-content\/uploads\/2019\/11\/ba05c24c81705c454c32d363e9a74fe5.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Wat u zult leren<\/b><\/p>\n<p>In dit projectvoorbeeld leer je hoe je een volledige website kunt maken met Nuxt.js \u2014 van de initi\u00eble opzet tot de uiteindelijke uitvoering.<\/p>\n<p>Het maakt gebruik van veel interessante functies die Nuxt te bieden heeft, zoals pagina's en componenten, evenals styling met SCSS.<\/p>\n<p><b>Technische stack en functies<\/b><\/p>\n<ul>\n<li>Nuxt.js<\/li>\n<li>Componenten en pagina's<\/li>\n<li>Storyblok-module<\/li>\n<li>Mixins<\/li>\n<li>Vuex voor state management<\/li>\n<li>SCSS voor styling<\/li>\n<li>Nuxt middlewares<\/li>\n<\/ul>\n<p>\n<noindex><a rel=\"nofollow\" href=\"https:\/\/www.storyblok.com\/tp\/nuxt-js-multilanguage-website-tutorial\">Dit is echt een gaaf project<\/a><\/noindex>, dat veel geweldige mogelijkheden van Nuxt.js omvat. Persoonlijk hou ik ervan om met Nuxt te werken, dus je moet het zeker proberen, want het zal je ook een geweldige Vue-ontwikkelaar maken.<\/p>\n<h3>Blog met Gatsby<\/h3>\n<p>\nGatsby is een geweldige static site generator die React en GraphQL gebruikt. Dit is het resultaat van het project:<\/p>\n<p><img decoding=\"async\" alt=\"Nog 9 projecten om je Front-End vaardigheden te verfijnen.\" src=\"\/wp-content\/uploads\/2019\/11\/4a51e59e1983da87d2110f8b06e29e33.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Wat u zult leren<\/b><\/p>\n<p>In deze gids leer je hoe je Gatsby kunt gebruiken om een blog te maken dat je zult gebruiken om je eigen artikelen te schrijven, met behulp van React en GraphQL.<\/p>\n<p><b>Technische stack en functies<\/b><\/p>\n<ul>\n<li>Gatsby<\/li>\n<li>React<\/li>\n<li>GraphQL<\/li>\n<li>Plugins en thema's<\/li>\n<li>MDX\/Markdown<\/li>\n<li>Bootstrap CSS<\/li>\n<li>Sjablonen<\/li>\n<\/ul>\n<p>\nAls je ooit een blog hebt willen beginnen, <noindex><a rel=\"nofollow\" href=\"https:\/\/blog.bitsrc.io\/how-to-build-a-blog-with-gatsby-and-boostrap-d1270212b3dc\">is dit een geweldig voorbeeld<\/a><\/noindex> van hoe je dit kunt doen met React en GraphQL.<\/p>\n<p>Ik zeg niet dat WordPress een slechte keuze is, maar met Gatsby kun je high-performance sites bouwen met React \u2014 wat een geweldige combinatie is.<\/p>\n<h3>Blog met Gridsome<\/h3>\n<p>\nGridsome voor Vue\u2026 Goed, we hebben dit al gehad met Next\/Nuxt.<br \/>\nMaar hetzelfde geldt voor Gridsome en Gatsby. Beide gebruiken GraphQL als datalaag, maar Gridsome gebruikt VueJS. Het is ook een geweldige static site generator die je helpt om geweldige blogs te maken:<\/p>\n<p><img decoding=\"async\" alt=\"Nog 9 projecten om je Front-End vaardigheden te verfijnen.\" src=\"\/wp-content\/uploads\/2019\/11\/3d0162d6aeba8481056f4dee9f25808d.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Wat u zult leren<\/b><\/p>\n<p>Dit project leert je hoe je een eenvoudige blog kunt maken om aan de slag te gaan met Gridsome, GraphQL en Markdown. Het legt ook uit hoe je de applicatie kunt implementeren via Netlify.<\/p>\n<p><b>Technische stack en functies<\/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>\nDit is zeker geen complete tutorial, maar het behandelt de basisprincipes van Gridsome en <noindex><a rel=\"nofollow\" href=\"https:\/\/www.telerik.com\/blogs\/building-a-blog-with-vue-and-markdown-using-gridsome\">Markdown en kan een goed vertrekpunt zijn<\/a><\/noindex>.<\/p>\n<h3>Audio speler, vergelijkbaar met SoundCloud, met behulp van Quasar<\/h3>\n<p>\nQuasar is weer een Vue-framework dat gebruikt kan worden voor het maken van mobiele applicaties. In dit project ga je een audioplayer-app maken, bijvoorbeeld:<\/p>\n<p><img decoding=\"async\" alt=\"Nog 9 projecten om je Front-End vaardigheden te verfijnen.\" src=\"\/wp-content\/uploads\/2019\/11\/e7acef4f60608d581533c038c61a0752.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>Wat u zult leren<\/b><\/p>\n<p>Terwijl andere projecten zich voornamelijk richten op webapplicaties, laat dit je zien hoe je een mobiele applicatie kunt maken met Vue en het Quasar-framework.<br \/>\nJe moet al een werkende Cordova met ingestelde Android Studio\/Xcode hebben. Als dat niet het geval is, dan is er in de handleiding een link naar de Quasar-website waar ze uitleggen hoe alles ingesteld kan worden.<\/p>\n<p><b>Technische stack en functies<\/b><\/p>\n<ul>\n<li>Quasar<\/li>\n<li>Vue<\/li>\n<li>Cordova<\/li>\n<li>WaveSurfer<\/li>\n<li>UI Componenten<\/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\">Klein project<\/a><\/noindex>, dat de mogelijkheden van Quasar voor het maken van mobiele applicaties demonstreert.<br \/>\n<br \/>Bron: <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.3 - 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\/nl\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva\" \/>\n\t\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 5.0.3\" \/>\n\t\t<meta property=\"og:locale\" content=\"nl_NL\" \/>\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\/nl\/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\udd47 Nog 9 projecten om je Front-End vaardigheden te verbeteren | ProHoster","description":"Inleiding Ongeacht.","canonical_url":"https:\/\/prohoster.info\/nl\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":null,"og:locale":"nl_NL","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\/nl\/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\/nl\/wp-json\/wp\/v2\/posts\/52348","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prohoster.info\/nl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/prohoster.info\/nl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/prohoster.info\/nl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prohoster.info\/nl\/wp-json\/wp\/v2\/comments?post=52348"}],"version-history":[{"count":0,"href":"https:\/\/prohoster.info\/nl\/wp-json\/wp\/v2\/posts\/52348\/revisions"}],"wp:attachment":[{"href":"https:\/\/prohoster.info\/nl\/wp-json\/wp\/v2\/media?parent=52348"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/prohoster.info\/nl\/wp-json\/wp\/v2\/categories?post=52348"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/prohoster.info\/nl\/wp-json\/wp\/v2\/tags?post=52348"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}