{"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\/en\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva","title":{"rendered":"9 More Projects to Enhance Your Front-End Skills","gt_translate_keys":[{"key":"rendered","format":"text"}]},"content":{"rendered":"<p><img decoding=\"async\" alt=\"9 More Projects to Enhance Your Front-End Skills\" src=\"\/wp-content\/uploads\/2019\/11\/05c3246e5ca620b5ea66c0542b53f08a.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<\/p>\n<h3>Introduction<\/h3>\n<p>\nWhether you are a beginner in programming or an experienced developer, learning new concepts and languages\/frameworks is essential to keep up with trends in the industry.<\/p>\n<p>Take React, for instance\u2014the code for which Facebook opened just four years ago\u2014it's already the number one choice for JavaScript developers worldwide.<\/p>\n<p>Vue and Angular certainly have their fair share of fans as well. There are also Svelte and other versatile frameworks like Next.js or Nuxt.js. Gatsby, Gridsome, Quasar\u2026 and much more.<\/p>\n<p>If you want to establish yourself as an experienced JavaScript developer, you should have at least some experience with various frameworks and libraries\u2014beyond just working with good old JS.<\/p>\n<p>To help you become a front-end master in 2020, I\u2019ve gathered nine different projects, each dedicated to various JavaScript frameworks and libraries as tech stacks that you can create and add to your portfolio. Remember, nothing helps you more than creating things in practice, so go ahead, engage your mind, and make it happen.<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 - web-development\"><img decoding=\"async\" alt=\"9 More Projects to Enhance Your Front-End Skills\" src=\"\/wp-content\/uploads\/2019\/11\/4f292db7c47eaa9d6e764f5a595d0edf.jpeg\" style=\"display:block;margin: 0 auto;\" \/><\/a><\/noindex><br clear=\"right\"><br \/>\nThis article is translated with support from EDISON Software, which <noindex><a rel=\"nofollow\" href=\"https:\/\/www.edsd.ru\/virtualnaya-primerochnaya\">creates virtual fitting rooms for multi-brand stores<\/a><\/noindex>, as well as <noindex><a rel=\"nofollow\" href=\"https:\/\/www.edsd.ru\/ru\/uslugi\/testirovanie_po\">tests software<\/a><\/noindex>.<\/p><\/blockquote>\n<p><\/p>\n<h3>Movie Search App Using React (With Hooks)<\/h3>\n<p>\nThe first thing you might want to start with is creating a movie search app using React. Below is an image of what the final app will look like:<\/p>\n<p><img decoding=\"async\" alt=\"9 More Projects to Enhance Your Front-End Skills\" src=\"\/wp-content\/uploads\/2019\/11\/de9873700abc86e1ec63e92704f80dcf.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>What You Will Learn<\/b><br \/>\nBy creating this app, you will enhance your React skills using the relatively new Hooks API. The project includes React components, numerous hooks, an external API, and of course, some CSS styles.<\/p>\n<p><b>Tech Stack and Features<\/b><\/p>\n<ul>\n<li>React with Hooks<\/li>\n<li>create-react-app<\/li>\n<li>JSX<\/li>\n<li>CSS<\/li>\n<\/ul>\n<p>\nWithout using any classes, these projects provide you with the perfect entry point into functional React and will definitely help you in 2020. You can find <noindex><a rel=\"nofollow\" href=\"https:\/\/www.freecodecamp.org\/news\/how-to-build-a-movie-search-app-using-react-hooks-24eb72ddfaf7\/\">a sample project here<\/a><\/noindex>. Follow the instructions or make it to your taste.<\/p>\n<h3>Chat App Using Vue<\/h3>\n<p>\nAnother great project for you is to create a chat application using my favorite JavaScript library: VueJS. The app will look something like this:<\/p>\n<p><img decoding=\"async\" alt=\"9 More Projects to Enhance Your Front-End Skills\" src=\"\/wp-content\/uploads\/2019\/11\/3c55136bcf260168f951e923983dc3a0.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>What You Will Learn<\/b><br \/>\nIn this guide, you'll learn how to build a Vue application from scratch \u2014 creating components, managing states, setting up routes, connecting to third-party services, and even handling authentication.<\/p>\n<p><b>Tech Stack and Features<\/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>\nThis is a really great project to start working with Vue or to enhance your existing skills for development in 2020. You can find <noindex><a rel=\"nofollow\" href=\"https:\/\/www.sitepoint.com\/pusher-vue-real-time-chat-app\/\">the tutorial here<\/a><\/noindex>.<\/p>\n<h3>A beautiful weather viewing application with Angular 8<\/h3>\n<p>\nThis example will help you create a beautiful weather viewing application using Angular 8:<\/p>\n<p><img decoding=\"async\" alt=\"9 More Projects to Enhance Your Front-End Skills\" src=\"\/wp-content\/uploads\/2019\/11\/93575fb69c667f04a00c58bfeb8b9699.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>What You Will Learn<\/b><br \/>\nThis project will teach you valuable skills in building applications from scratch \u2014 from design to development, up to a deployable application.<\/p>\n<p><b>Tech Stack and Features<\/b><\/p>\n<ul>\n<li>Angular 8<\/li>\n<li>Firebase<\/li>\n<li>Server-side rendering<\/li>\n<li>CSS with Grid and Flexbox<\/li>\n<li>Mobile-friendly and responsive<\/li>\n<li>Dark mode<\/li>\n<li>Beautiful interface<\/li>\n<\/ul>\n<p>\nWhat I really appreciate about this comprehensive project is that you don't learn things in isolation. Instead, you study the entire development process \u2014 from design to final deployment.<\/p>\n<h3>To-Do application with Svelte<\/h3>\n<p>\nSvelte is like the new kid on the block in the component approach \u2014 at least similar to React, Vue, and Angular. And it\u2019s one of the hottest newcomers for 2020.<\/p>\n<p>To-Do applications may not be the hottest topic, but they will really help you hone your Svelte skills. It will look like this:<\/p>\n<p><img decoding=\"async\" alt=\"9 More Projects to Enhance Your Front-End Skills\" src=\"\/wp-content\/uploads\/2019\/11\/1d2d414f5acbb3cfd0df5bf7ff29befd.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>What You Will Learn<\/b><br \/>\nIn this tutorial, you will learn how to create an application using Svelte 3, from start to finish. You will use components, styling, and event handlers.<\/p>\n<p><b>Tech Stack and Features<\/b><\/p>\n<ul>\n<li>Svelte 3<\/li>\n<li>Components<\/li>\n<li>Styling with CSS<\/li>\n<li>ES 6 syntax<\/li>\n<\/ul>\n<p>\nThere are not many good starter projects for Svelte, so I found <noindex><a rel=\"nofollow\" href=\"https:\/\/medium.com\/codingthesmartway-com-blog\/building-a-svelte-3-todo-app-from-start-to-deployment-1737f72c23a6\">this good option to get started<\/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 the most popular framework for building React applications that support server-side rendering out of the box.<\/p>\n<p>This project will show you how to create an e-commerce application that looks like this:<\/p>\n<p><img decoding=\"async\" alt=\"9 More Projects to Enhance Your Front-End Skills\" src=\"\/wp-content\/uploads\/2019\/11\/a848293ad9952a3c52bf8d059bf55ab9.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>What You Will Learn<\/b><br \/>\nIn this project, you will learn how to develop with Next.js \u2014 creating new pages and components, fetching data, as well as styling and deploying your Next application.<\/p>\n<p><b>Tech Stack and Features<\/b><\/p>\n<ul>\n<li>Next.js<\/li>\n<li>Components and pages<\/li>\n<li>Data Sampling<\/li>\n<li>Styling<\/li>\n<li>Deploying the project<\/li>\n<li>SSR and SPA<\/li>\n<\/ul>\n<p>\nIt's always great to have a real example, such as an e-commerce application, to learn something new. You can <noindex><a rel=\"nofollow\" href=\"https:\/\/snipcart.com\/blog\/next-js-ecommerce-tutorial\">find the tutorial here<\/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 for Vue is like Next.js for React: a great framework that combines server-side rendering and single-page applications.<br \/>\nThe final application you'll create will look like this:<\/p>\n<p><img decoding=\"async\" alt=\"9 More Projects to Enhance Your Front-End Skills\" src=\"\/wp-content\/uploads\/2019\/11\/ba05c24c81705c454c32d363e9a74fe5.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>What You Will Learn<\/b><\/p>\n<p>In this project example, you'll learn how to build a complete website using Nuxt.js \u2014 from initial setup to final deployment.<\/p>\n<p>It utilizes many interesting features that Nuxt has to offer, such as pages and components, as well as styling with SCSS.<\/p>\n<p><b>Tech Stack and Features<\/b><\/p>\n<ul>\n<li>Nuxt.js<\/li>\n<li>Components and pages<\/li>\n<li>Storyblock module<\/li>\n<li>Mixins<\/li>\n<li>Vuex for state management<\/li>\n<li>SCSS for 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\">This is really a cool project<\/a><\/noindex>, which includes many wonderful features of Nuxt.js. I personally love working with Nuxt, so you should give it a try, as it will also make you a great Vue developer.<\/p>\n<h3>Blog with Gatsby<\/h3>\n<p>\nGatsby is an excellent static site generator that uses React and GraphQL. Here\u2019s the result of the project:<\/p>\n<p><img decoding=\"async\" alt=\"9 More Projects to Enhance Your Front-End Skills\" src=\"\/wp-content\/uploads\/2019\/11\/4a51e59e1983da87d2110f8b06e29e33.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>What You Will Learn<\/b><\/p>\n<p>In this guide, you will learn how to use Gatsby to create a blog that you'll use for writing your own articles with React and GraphQL.<\/p>\n<p><b>Tech Stack and Features<\/b><\/p>\n<ul>\n<li>Gatsby<\/li>\n<li>React<\/li>\n<li>GraphQL<\/li>\n<li>Plugins and themes<\/li>\n<li>MDX\/Markdown<\/li>\n<li>Bootstrap CSS<\/li>\n<li>Templates<\/li>\n<\/ul>\n<p>\nIf you've ever wanted to start a blog, <noindex><a rel=\"nofollow\" href=\"https:\/\/blog.bitsrc.io\/how-to-build-a-blog-with-gatsby-and-boostrap-d1270212b3dc\">this is a great example<\/a><\/noindex> of how to create one using React and GraphQL.<\/p>\n<p>I\u2019m not saying that WordPress is a bad choice, but with Gatsby, you can build high-performance sites using React \u2014 which is an amazing combination.<\/p>\n<h3>Blog with Gridsome<\/h3>\n<p>\nGridsome for Vue\u2026 Well, we\u2019ve already had this with Next\/Nuxt.<br \/>\nBut the same is true for Gridsome and Gatsby. Both use GraphQL as a data layer, but Gridsome utilizes VueJS. It's also a fantastic static site generator that will help you create great blogs:<\/p>\n<p><img decoding=\"async\" alt=\"9 More Projects to Enhance Your Front-End Skills\" src=\"\/wp-content\/uploads\/2019\/11\/3d0162d6aeba8481056f4dee9f25808d.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>What You Will Learn<\/b><\/p>\n<p>This project will teach you how to create a simple blog to get started with Gridsome, GraphQL, and Markdown. It also explains how to deploy the application through Netlify.<\/p>\n<p><b>Tech Stack and Features<\/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>\nThis is certainly not the most comprehensive tutorial, but it covers the main concepts of Gridsome and <noindex><a rel=\"nofollow\" href=\"https:\/\/www.telerik.com\/blogs\/building-a-blog-with-vue-and-markdown-using-gridsome\">Markdown and can be a good starting point.<\/a><\/noindex>.<\/p>\n<h3>An audio player similar to SoundCloud using Quasar.<\/h3>\n<p>\nQuasar is another Vue framework that can be used to create mobile applications. In this project, you will create an audio player app, for example:<\/p>\n<p><img decoding=\"async\" alt=\"9 More Projects to Enhance Your Front-End Skills\" src=\"\/wp-content\/uploads\/2019\/11\/e7acef4f60608d581533c038c61a0752.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\n<b>What You Will Learn<\/b><\/p>\n<p>While other projects focus primarily on web applications, this one will show you how to create a mobile application using Vue and the Quasar framework.<br \/>\nYou should already have a working Cordova setup with Android Studio\/Xcode configured. If not, there is a link in the guide to the Quasar website where they show how to set everything up.<\/p>\n<p><b>Tech Stack and Features<\/b><\/p>\n<ul>\n<li>Quasar<\/li>\n<li>Vue<\/li>\n<li>Cordova<\/li>\n<li>WaveSurfer<\/li>\n<li>UI Components<\/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\">A small project<\/a><\/noindex>, demonstrating the capabilities of Quasar for creating mobile applications.<br \/>\n<br \/>Source: <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\/en\/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=\"en_US\" \/>\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\/en\/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\udd47Another 9 projects to sharpen your Front-End skills | ProHoster","description":"Introduction Regardless of.","canonical_url":"https:\/\/prohoster.info\/en\/blog\/news\/eshhyo-9-proektov-dlya-ottachivaniya-front-end-masterstva","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":null,"og:locale":"en_US","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\/en\/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\/en\/wp-json\/wp\/v2\/posts\/52348","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/comments?post=52348"}],"version-history":[{"count":0,"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/posts\/52348\/revisions"}],"wp:attachment":[{"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/media?parent=52348"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/categories?post=52348"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/prohoster.info\/en\/wp-json\/wp\/v2\/tags?post=52348"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}