Whatever you do, it’s always beneficial to have the right tools at your disposal. I love working remotely and am a big advocate of doing remote software development. <\/p>\n\n\n\n\n\n\n\n
Therefore, I always strive to have the best equipment available to be as productive as possible. Writing posts like this constantly takes a lot of time. Luckily\u00a0iVanky<\/a>\u00a0helped me out and sponsored this post so that I can concentrate on writing. I recently had the chance to test out one of their hottest products, a\u00a0dual USB-C Docking Station<\/a>\u00a0that allows me to connect both my wide-screen monitors to my MacBook with Dual 4K@60Hz display connectivity. It also supports up to 96W laptop charging, which is awesome. If you are in a situation like me and want to upgrade your equipment, check out this and their other products! And now comes the article:<\/p>\n\n\n\n Whether you are new to programming or already an experienced developer. In this industry, learning new concepts and languages\/frameworks is To help you become Frontend Masters, I have collected 9 different projects, each with a distinct topic and a different JavaScript framework or library as a tech stack that you can build and add to your portfolio. Remember, nothing helps you more than actually building stuff so go ahead, sharpen your mind and make this happen!<\/p>\n\n\n\n The first thing you could start with is building a movie search app using React. Below is an image of how the final app will look like: Building this application you will improve your React Skills using the relatively new Hooks API. The example projects make use of React components, many hooks, an external API, and of course some styling via CSS.<\/p>\n\n\n\n Using no classes this project gives you a perfect entry point into functional react and will definitely help you in 2020. You can find the example project here: https:\/\/www.freecodecamp.org\/news\/how-to-build-a-movie-search-app-using-react-hooks-24eb72ddfaf7\/<\/a> Another great project for you is to build a chat app using my favorite JavaScript library VueJS. The app will look something like this: Following this tutorial, you will learn how to set up a Vue app from scratch, creating components, handling state, creating routes, connecting to a third-party service, and even handling authentication.<\/p>\n\n\n\n This is really a great project to get started with Vue or to improve your existing skills to tackle development in 2020. You can find the tutorial right here: https:\/\/www.sitepoint.com\/pusher-vue-real-time-chat-app\/<\/a><\/p>\n\n\n\n This example will help you to build a beautiful weather app using Google’s Angular 8: This project will teach you valuable skills such while creating an application from scratch, starting with the design over development all the way to a production-ready deployment.<\/p>\n\n\n\n What I really, really like about this comprehensive project is that you do not learn things in isolation but the whole development process from the design to the final deployment. You should really do this one! Svelte kinda is the new kid on the block compared to React, Vue, and Angular but nonetheless one of the hotties for 2020. Okay, To-Do apps are not necessarily the hottest topic out there but this will really help you to sharpen you Svelte skills and look like this: This tutorial will show you how to make an app using Svelte 3 from start to finish. It makes use of components, styling, and event handlers<\/p>\n\n\n\n There aren’t that many good Svelte starter projects out there so I find this one to be kinda good to start with. And who knows, maybe you are the one creating another, more comprehensive Svelte tutorial that will be presented in the next year’s version of this post? Nextjs is the most popular framework for creating React applications that support server-side rendering out of the box. This project will show you how to build an e-commerce shopping cart looking like this: In this project, you will learn how to set up a Next.js development environment, create new pages and components, fetch data, style, and deploy a next application.<\/p>\n\n\n\n It is always great to have a real-world example such as an e-commerce showcase to learn something new. You can find the tutorial here: Nuxt.js is to Vue what Next.js is to react. A great framework to combine the power of server-side rendering and single-page applications. The final app that you could create will look like this: This example project will teach you how to build a full-blown website using Nuxt.js from the initial setup to the final deployment. It makes use of many of the cool features Nuxt has to offer like pages and components as well as styling with SCSS.<\/p>\n\n\n\n This is a really cool project for you and covers many of the great features of Nuxt.js. I personally love working with Nuxt so you should really try this one out as it will also make you a better Vue developer! Gatsby is a great static site generator that uses React and GraphQL under the hood. This is the result of this project: In this tutorial, you will learn how to leverage Gatsby to build an outstanding blog that you could well use for writing your own articles while making use of React and GraphQL.<\/p>\n\n\n\n If you ever wanted to start a blog this is a great example of how to do so leveraging React and GraphQL. I am not saying that WordPress always is a bad choice but with Gatsby you can create highly performant sites while using React which is an awesome combination! Gridsome is to Vue…Okay, we already had that with Next\/Nuxt but the same is true for Gridsome and Gatsby. Both use GraphQL as a data layer but Gridsome makes use of VueJS. It also is an awesome static site generator that will help you create great blogs: This project will teach you how to build a simple blog to get started with Gridsome, GraphQL, and Markdown. It also covers how to deploy the application via Netlify.<\/p>\n\n\n\n This for sure isn’t the most comprehensive tutorial but covers the basic concepts of Gridsome and Markdown and could be a good starting point. Quasar is another Vue framework that can also be used to build mobile applications. In this project you will create an audio player app looking like this: While the other projects focus mainly on web applications this one will show you how to create a mobile app using Vue via the Quasar framework. You should already have a working Cordova setup with android studio \/ xcode configured. If not there is a link in the tutorial to the quasar website where they show you how to set this up.<\/p>\n\n\n\n A small project that shows the power of Quasar for building mobile apps. In this article I showed you 9 projects that you can build, each focusing on another JavaScript framework or library. Now the choice is all yours: Will you try something new by using a framework you haven’t used before? Or do you want to strengthen your skills by doing a project for a technology you already have some knowledge of? Or will you rely on your favorite framework\/library and do all the projects with it?<\/p>\n\n\n\n
mandatory to keep up with the rapid changes. Take for example React – open-sourced by Facebook just a shy 4 years ago it already became the number one choice for JavaScript devs around the globe. But also Vue and Angular, of course, have their legitimate follower-base. And then there is Svelte, and universal frameworks like Next.js or Nuxt.js, and Gatsby, and Gridsome, and Quasar, and and and. If you want to shine as an expert JavaScript developer you should at least have some experience in different frameworks and libraries – besides doing your homework with good, old JS.<\/p>\n\n\n\nBuild a movie search app using React (with hooks)<\/h2>\n\n\n\n
<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\n
Tech Stack & Features<\/h3>\n\n\n\n
Follow along with the tutorial or give it your own flavor!<\/p>\n\n\n\nBuild a chat app with Vue<\/h2>\n\n\n\n
<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\n
Tech Stack & Features<\/h3>\n\n\n\n
Build a beautiful weather app with Angular 8<\/h2>\n\n\n\n
<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\n
Tech Stack & Features<\/h3>\n\n\n\n
https:\/\/medium.com\/@hamedbaatour\/build-a-real-world-beautiful-web-app-with-angular-6-a-to-z-ultimate-guide-2018-part-i-e121dd1d55e<\/a><\/p>\n\n\n\nBuild a to-do app with Svelte<\/h2>\n\n\n\n
<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\n
Tech Stack & Features<\/h3>\n\n\n\n
https:\/\/medium.com\/codingthesmartway-com-blog\/building-a-svelte-3-todo-app-from-start-to-deployment-1737f72c23a6<\/a><\/p>\n\n\n\nBuild an e-commerce shopping cart with Next.js<\/h2>\n\n\n\n
<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\n
Tech Stack & Features<\/h3>\n\n\n\n
https:\/\/snipcart.com\/blog\/next-js-ecommerce-tutorial<\/a><\/p>\n\n\n\nBuild a full-blown multi-language blog website Nuxt.js<\/h2>\n\n\n\n
<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\n
Tech Stack & Features<\/h3>\n\n\n\n
https:\/\/www.storyblok.com\/tp\/nuxt-js-multilanguage-website-tutorial<\/a><\/p>\n\n\n\nBuild a Blog with Gatsby<\/h2>\n\n\n\n
<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\n
Tech Stack & Features<\/h3>\n\n\n\n
https:\/\/blog.bitsrc.io\/how-to-build-a-blog-with-gatsby-and-boostrap-d1270212b3dc<\/a><\/p>\n\n\n\nBuild a Blog with Gridsome<\/h2>\n\n\n\n
<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\n
Tech Stack & Features<\/h3>\n\n\n\n
https:\/\/www.telerik.com\/blogs\/building-a-blog-with-vue-and-markdown-using-gridsome<\/a><\/p>\n\n\n\nBuild a SoundCloud-like audio player app with Quasar<\/h2>\n\n\n\n
<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\n
Tech Stack & Features<\/h3>\n\n\n\n
https:\/\/www.learningsomethingnew.com\/how-to-build-a-sound-cloud-like-audio-player-app-with-vue-js-quasar-and-wave-surfer<\/a><\/p>\n\n\n\nConclusion<\/h1>\n\n\n\n
![<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nFollowing this tutorial, you will learn how to set up a Vue app from scratch, creating components, handling state, creating routes, connecting to a third-party service, and even handling authentication.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nVue<\/li>Vuex<\/li>Vue Router<\/li>Vue CLI<\/li>Pusher<\/li>CSS<\/li><\/ul>\n\n\n\nThis is really a great project to get started with Vue or to improve your existing skills to tackle development in 2020. You can find the tutorial right here: https:\/\/www.sitepoint.com\/pusher-vue-real-time-chat-app\/<\/a><\/p>\n\n\n\nBuild a beautiful weather app with Angular 8<\/h2>\n\n\n\nThis example will help you to build a beautiful weather app using Google’s Angular 8:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis project will teach you valuable skills such while creating an application from scratch, starting with the design over development all the way to a production-ready deployment.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nAngular 8<\/li>Firebase<\/li>Server-Side Rendering<\/li>CSS with Grid Layout and Flexbox<\/li>Mobile friendly & responsive<\/li>Dark Mode<\/li>Beautiful UI<\/li><\/ul>\n\n\n\nWhat I really, really like about this comprehensive project is that you do not learn things in isolation but the whole development process from the design to the final deployment. You should really do this one!https:\/\/medium.com\/@hamedbaatour\/build-a-real-world-beautiful-web-app-with-angular-6-a-to-z-ultimate-guide-2018-part-i-e121dd1d55e<\/a><\/p>\n\n\n\nBuild a to-do app with Svelte<\/h2>\n\n\n\nSvelte kinda is the new kid on the block compared to React, Vue, and Angular but nonetheless one of the hotties for 2020. Okay, To-Do apps are not necessarily the hottest topic out there but this will really help you to sharpen you Svelte skills and look like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis tutorial will show you how to make an app using Svelte 3 from start to finish. It makes use of components, styling, and event handlers<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nSvelte 3<\/li>Components<\/li>Styling via CSS<\/li>ES 6 syntax<\/li><\/ul>\n\n\n\nThere aren’t that many good Svelte starter projects out there so I find this one to be kinda good to start with. And who knows, maybe you are the one creating another, more comprehensive Svelte tutorial that will be presented in the next year’s version of this post?https:\/\/medium.com\/codingthesmartway-com-blog\/building-a-svelte-3-todo-app-from-start-to-deployment-1737f72c23a6<\/a><\/p>\n\n\n\nBuild an e-commerce shopping cart with Next.js<\/h2>\n\n\n\nNextjs is the most popular framework for creating React applications that support server-side rendering out of the box. This project will show you how to build an e-commerce shopping cart looking like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nIn this project, you will learn how to set up a Next.js development environment, create new pages and components, fetch data, style, and deploy a next application.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nNext.js<\/li>Components and Pages<\/li>Data Fetching<\/li>Styling<\/li>Deployment<\/li>SSR and SPA<\/li><\/ul>\n\n\n\nIt is always great to have a real-world example such as an e-commerce showcase to learn something new. You can find the tutorial here:https:\/\/snipcart.com\/blog\/next-js-ecommerce-tutorial<\/a><\/p>\n\n\n\nBuild a full-blown multi-language blog website Nuxt.js<\/h2>\n\n\n\nNuxt.js is to Vue what Next.js is to react. A great framework to combine the power of server-side rendering and single-page applications. The final app that you could create will look like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis example project will teach you how to build a full-blown website using Nuxt.js from the initial setup to the final deployment. It makes use of many of the cool features Nuxt has to offer like pages and components as well as styling with SCSS.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nNuxt.js<\/li>Components and Pages<\/li>Storyblok module<\/li>Mixins<\/li>Vuex for state management<\/li>SCSS for styling<\/li>Nuxt middlewares<\/li><\/ul>\n\n\n\nThis is a really cool project for you and covers many of the great features of Nuxt.js. I personally love working with Nuxt so you should really try this one out as it will also make you a better Vue developer!https:\/\/www.storyblok.com\/tp\/nuxt-js-multilanguage-website-tutorial<\/a><\/p>\n\n\n\nBuild a Blog with Gatsby<\/h2>\n\n\n\nGatsby is a great static site generator that uses React and GraphQL under the hood. This is the result of this project:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nIn this tutorial, you will learn how to leverage Gatsby to build an outstanding blog that you could well use for writing your own articles while making use of React and GraphQL.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGatsby<\/li>React<\/li>GraphQL<\/li>Plugins & Themes<\/li>MDX \/ Markdown<\/li>Bootstrap CSS<\/li>Templates<\/li><\/ul>\n\n\n\nIf you ever wanted to start a blog this is a great example of how to do so leveraging React and GraphQL. I am not saying that WordPress always is a bad choice but with Gatsby you can create highly performant sites while using React which is an awesome combination!https:\/\/blog.bitsrc.io\/how-to-build-a-blog-with-gatsby-and-boostrap-d1270212b3dc<\/a><\/p>\n\n\n\nBuild a Blog with Gridsome<\/h2>\n\n\n\nGridsome is to Vue…Okay, we already had that with Next\/Nuxt but the same is true for Gridsome and Gatsby. Both use GraphQL as a data layer but Gridsome makes use of VueJS. It also is an awesome static site generator that will help you create great blogs:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis project will teach you how to build a simple blog to get started with Gridsome, GraphQL, and Markdown. It also covers how to deploy the application via Netlify.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGridsome<\/li>Vue<\/li>GraphQL<\/li>Markdown<\/li>Netlify<\/li><\/ul>\n\n\n\nThis for sure isn’t the most comprehensive tutorial but covers the basic concepts of Gridsome and Markdown and could be a good starting point.https:\/\/www.telerik.com\/blogs\/building-a-blog-with-vue-and-markdown-using-gridsome<\/a><\/p>\n\n\n\nBuild a SoundCloud-like audio player app with Quasar<\/h2>\n\n\n\nQuasar is another Vue framework that can also be used to build mobile applications. In this project you will create an audio player app looking like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nWhile the other projects focus mainly on web applications this one will show you how to create a mobile app using Vue via the Quasar framework. You should already have a working Cordova setup with android studio \/ xcode configured. If not there is a link in the tutorial to the quasar website where they show you how to set this up.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nQuasar<\/li>Vue<\/li>Cordova<\/li>Wavesurfer<\/li>UI Components<\/li><\/ul>\n\n\n\nA small project that shows the power of Quasar for building mobile apps.https:\/\/www.learningsomethingnew.com\/how-to-build-a-sound-cloud-like-audio-player-app-with-vue-js-quasar-and-wave-surfer<\/a><\/p>\n\n\n\nConclusion<\/h1>\n\n\n\nIn this article I showed you 9 projects that you can build, each focusing on another JavaScript framework or library. Now the choice is all yours: Will you try something new by using a framework you haven’t used before? Or do you want to strengthen your skills by doing a project for a technology you already have some knowledge of? Or will you rely on your favorite framework\/library and do all the projects with it?<\/p>\n\n\n\nI recently started a new site: The Smart Coder where I create free content for the community, such as more posts about javascript projects<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"Whatever you do, it’s always beneficial to have the right tools at your disposal. I love working remotely and am a big advocate of doing remote software development.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[30,25],"tags":[123,65,134],"_links":{"self":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751"}],"collection":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1751"}],"version-history":[{"count":1,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions"}],"predecessor-version":[{"id":1752,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions\/1752"}],"wp:attachment":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1751"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1751"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1751"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}](\"https:\/\/res.cloudinary.com\/practicaldev\/image\/fetch\/s--3aeOOFQq--\/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880\/https:\/\/dab1nmslvvntp.cloudfront.net\/wp-content\/uploads\/2018\/12\/154507977914-chatdashboard.png\"){kind=link}
![<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis project will teach you valuable skills such while creating an application from scratch, starting with the design over development all the way to a production-ready deployment.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nAngular 8<\/li>Firebase<\/li>Server-Side Rendering<\/li>CSS with Grid Layout and Flexbox<\/li>Mobile friendly & responsive<\/li>Dark Mode<\/li>Beautiful UI<\/li><\/ul>\n\n\n\nWhat I really, really like about this comprehensive project is that you do not learn things in isolation but the whole development process from the design to the final deployment. You should really do this one!https:\/\/medium.com\/@hamedbaatour\/build-a-real-world-beautiful-web-app-with-angular-6-a-to-z-ultimate-guide-2018-part-i-e121dd1d55e<\/a><\/p>\n\n\n\nBuild a to-do app with Svelte<\/h2>\n\n\n\nSvelte kinda is the new kid on the block compared to React, Vue, and Angular but nonetheless one of the hotties for 2020. Okay, To-Do apps are not necessarily the hottest topic out there but this will really help you to sharpen you Svelte skills and look like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis tutorial will show you how to make an app using Svelte 3 from start to finish. It makes use of components, styling, and event handlers<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nSvelte 3<\/li>Components<\/li>Styling via CSS<\/li>ES 6 syntax<\/li><\/ul>\n\n\n\nThere aren’t that many good Svelte starter projects out there so I find this one to be kinda good to start with. And who knows, maybe you are the one creating another, more comprehensive Svelte tutorial that will be presented in the next year’s version of this post?https:\/\/medium.com\/codingthesmartway-com-blog\/building-a-svelte-3-todo-app-from-start-to-deployment-1737f72c23a6<\/a><\/p>\n\n\n\nBuild an e-commerce shopping cart with Next.js<\/h2>\n\n\n\nNextjs is the most popular framework for creating React applications that support server-side rendering out of the box. This project will show you how to build an e-commerce shopping cart looking like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nIn this project, you will learn how to set up a Next.js development environment, create new pages and components, fetch data, style, and deploy a next application.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nNext.js<\/li>Components and Pages<\/li>Data Fetching<\/li>Styling<\/li>Deployment<\/li>SSR and SPA<\/li><\/ul>\n\n\n\nIt is always great to have a real-world example such as an e-commerce showcase to learn something new. You can find the tutorial here:https:\/\/snipcart.com\/blog\/next-js-ecommerce-tutorial<\/a><\/p>\n\n\n\nBuild a full-blown multi-language blog website Nuxt.js<\/h2>\n\n\n\nNuxt.js is to Vue what Next.js is to react. A great framework to combine the power of server-side rendering and single-page applications. The final app that you could create will look like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis example project will teach you how to build a full-blown website using Nuxt.js from the initial setup to the final deployment. It makes use of many of the cool features Nuxt has to offer like pages and components as well as styling with SCSS.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nNuxt.js<\/li>Components and Pages<\/li>Storyblok module<\/li>Mixins<\/li>Vuex for state management<\/li>SCSS for styling<\/li>Nuxt middlewares<\/li><\/ul>\n\n\n\nThis is a really cool project for you and covers many of the great features of Nuxt.js. I personally love working with Nuxt so you should really try this one out as it will also make you a better Vue developer!https:\/\/www.storyblok.com\/tp\/nuxt-js-multilanguage-website-tutorial<\/a><\/p>\n\n\n\nBuild a Blog with Gatsby<\/h2>\n\n\n\nGatsby is a great static site generator that uses React and GraphQL under the hood. This is the result of this project:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nIn this tutorial, you will learn how to leverage Gatsby to build an outstanding blog that you could well use for writing your own articles while making use of React and GraphQL.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGatsby<\/li>React<\/li>GraphQL<\/li>Plugins & Themes<\/li>MDX \/ Markdown<\/li>Bootstrap CSS<\/li>Templates<\/li><\/ul>\n\n\n\nIf you ever wanted to start a blog this is a great example of how to do so leveraging React and GraphQL. I am not saying that WordPress always is a bad choice but with Gatsby you can create highly performant sites while using React which is an awesome combination!https:\/\/blog.bitsrc.io\/how-to-build-a-blog-with-gatsby-and-boostrap-d1270212b3dc<\/a><\/p>\n\n\n\nBuild a Blog with Gridsome<\/h2>\n\n\n\nGridsome is to Vue…Okay, we already had that with Next\/Nuxt but the same is true for Gridsome and Gatsby. Both use GraphQL as a data layer but Gridsome makes use of VueJS. It also is an awesome static site generator that will help you create great blogs:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis project will teach you how to build a simple blog to get started with Gridsome, GraphQL, and Markdown. It also covers how to deploy the application via Netlify.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGridsome<\/li>Vue<\/li>GraphQL<\/li>Markdown<\/li>Netlify<\/li><\/ul>\n\n\n\nThis for sure isn’t the most comprehensive tutorial but covers the basic concepts of Gridsome and Markdown and could be a good starting point.https:\/\/www.telerik.com\/blogs\/building-a-blog-with-vue-and-markdown-using-gridsome<\/a><\/p>\n\n\n\nBuild a SoundCloud-like audio player app with Quasar<\/h2>\n\n\n\nQuasar is another Vue framework that can also be used to build mobile applications. In this project you will create an audio player app looking like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nWhile the other projects focus mainly on web applications this one will show you how to create a mobile app using Vue via the Quasar framework. You should already have a working Cordova setup with android studio \/ xcode configured. If not there is a link in the tutorial to the quasar website where they show you how to set this up.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nQuasar<\/li>Vue<\/li>Cordova<\/li>Wavesurfer<\/li>UI Components<\/li><\/ul>\n\n\n\nA small project that shows the power of Quasar for building mobile apps.https:\/\/www.learningsomethingnew.com\/how-to-build-a-sound-cloud-like-audio-player-app-with-vue-js-quasar-and-wave-surfer<\/a><\/p>\n\n\n\nConclusion<\/h1>\n\n\n\nIn this article I showed you 9 projects that you can build, each focusing on another JavaScript framework or library. Now the choice is all yours: Will you try something new by using a framework you haven’t used before? Or do you want to strengthen your skills by doing a project for a technology you already have some knowledge of? Or will you rely on your favorite framework\/library and do all the projects with it?<\/p>\n\n\n\nI recently started a new site: The Smart Coder where I create free content for the community, such as more posts about javascript projects<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"Whatever you do, it’s always beneficial to have the right tools at your disposal. I love working remotely and am a big advocate of doing remote software development.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[30,25],"tags":[123,65,134],"_links":{"self":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751"}],"collection":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1751"}],"version-history":[{"count":1,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions"}],"predecessor-version":[{"id":1752,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions\/1752"}],"wp:attachment":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1751"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1751"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1751"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}](\"https:\/\/res.cloudinary.com\/practicaldev\/image\/fetch\/s--wvB7F1QQ--\/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880\/https:\/\/miro.medium.com\/max\/3840\/1%2Ay3c9ggOkOzdAr8JC7TUrEQ%402x.png\"){kind=link}
![<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis tutorial will show you how to make an app using Svelte 3 from start to finish. It makes use of components, styling, and event handlers<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nSvelte 3<\/li>Components<\/li>Styling via CSS<\/li>ES 6 syntax<\/li><\/ul>\n\n\n\nThere aren’t that many good Svelte starter projects out there so I find this one to be kinda good to start with. And who knows, maybe you are the one creating another, more comprehensive Svelte tutorial that will be presented in the next year’s version of this post?https:\/\/medium.com\/codingthesmartway-com-blog\/building-a-svelte-3-todo-app-from-start-to-deployment-1737f72c23a6<\/a><\/p>\n\n\n\nBuild an e-commerce shopping cart with Next.js<\/h2>\n\n\n\nNextjs is the most popular framework for creating React applications that support server-side rendering out of the box. This project will show you how to build an e-commerce shopping cart looking like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nIn this project, you will learn how to set up a Next.js development environment, create new pages and components, fetch data, style, and deploy a next application.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nNext.js<\/li>Components and Pages<\/li>Data Fetching<\/li>Styling<\/li>Deployment<\/li>SSR and SPA<\/li><\/ul>\n\n\n\nIt is always great to have a real-world example such as an e-commerce showcase to learn something new. You can find the tutorial here:https:\/\/snipcart.com\/blog\/next-js-ecommerce-tutorial<\/a><\/p>\n\n\n\nBuild a full-blown multi-language blog website Nuxt.js<\/h2>\n\n\n\nNuxt.js is to Vue what Next.js is to react. A great framework to combine the power of server-side rendering and single-page applications. The final app that you could create will look like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis example project will teach you how to build a full-blown website using Nuxt.js from the initial setup to the final deployment. It makes use of many of the cool features Nuxt has to offer like pages and components as well as styling with SCSS.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nNuxt.js<\/li>Components and Pages<\/li>Storyblok module<\/li>Mixins<\/li>Vuex for state management<\/li>SCSS for styling<\/li>Nuxt middlewares<\/li><\/ul>\n\n\n\nThis is a really cool project for you and covers many of the great features of Nuxt.js. I personally love working with Nuxt so you should really try this one out as it will also make you a better Vue developer!https:\/\/www.storyblok.com\/tp\/nuxt-js-multilanguage-website-tutorial<\/a><\/p>\n\n\n\nBuild a Blog with Gatsby<\/h2>\n\n\n\nGatsby is a great static site generator that uses React and GraphQL under the hood. This is the result of this project:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nIn this tutorial, you will learn how to leverage Gatsby to build an outstanding blog that you could well use for writing your own articles while making use of React and GraphQL.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGatsby<\/li>React<\/li>GraphQL<\/li>Plugins & Themes<\/li>MDX \/ Markdown<\/li>Bootstrap CSS<\/li>Templates<\/li><\/ul>\n\n\n\nIf you ever wanted to start a blog this is a great example of how to do so leveraging React and GraphQL. I am not saying that WordPress always is a bad choice but with Gatsby you can create highly performant sites while using React which is an awesome combination!https:\/\/blog.bitsrc.io\/how-to-build-a-blog-with-gatsby-and-boostrap-d1270212b3dc<\/a><\/p>\n\n\n\nBuild a Blog with Gridsome<\/h2>\n\n\n\nGridsome is to Vue…Okay, we already had that with Next\/Nuxt but the same is true for Gridsome and Gatsby. Both use GraphQL as a data layer but Gridsome makes use of VueJS. It also is an awesome static site generator that will help you create great blogs:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis project will teach you how to build a simple blog to get started with Gridsome, GraphQL, and Markdown. It also covers how to deploy the application via Netlify.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGridsome<\/li>Vue<\/li>GraphQL<\/li>Markdown<\/li>Netlify<\/li><\/ul>\n\n\n\nThis for sure isn’t the most comprehensive tutorial but covers the basic concepts of Gridsome and Markdown and could be a good starting point.https:\/\/www.telerik.com\/blogs\/building-a-blog-with-vue-and-markdown-using-gridsome<\/a><\/p>\n\n\n\nBuild a SoundCloud-like audio player app with Quasar<\/h2>\n\n\n\nQuasar is another Vue framework that can also be used to build mobile applications. In this project you will create an audio player app looking like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nWhile the other projects focus mainly on web applications this one will show you how to create a mobile app using Vue via the Quasar framework. You should already have a working Cordova setup with android studio \/ xcode configured. If not there is a link in the tutorial to the quasar website where they show you how to set this up.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nQuasar<\/li>Vue<\/li>Cordova<\/li>Wavesurfer<\/li>UI Components<\/li><\/ul>\n\n\n\nA small project that shows the power of Quasar for building mobile apps.https:\/\/www.learningsomethingnew.com\/how-to-build-a-sound-cloud-like-audio-player-app-with-vue-js-quasar-and-wave-surfer<\/a><\/p>\n\n\n\nConclusion<\/h1>\n\n\n\nIn this article I showed you 9 projects that you can build, each focusing on another JavaScript framework or library. Now the choice is all yours: Will you try something new by using a framework you haven’t used before? Or do you want to strengthen your skills by doing a project for a technology you already have some knowledge of? Or will you rely on your favorite framework\/library and do all the projects with it?<\/p>\n\n\n\nI recently started a new site: The Smart Coder where I create free content for the community, such as more posts about javascript projects<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"Whatever you do, it’s always beneficial to have the right tools at your disposal. I love working remotely and am a big advocate of doing remote software development.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[30,25],"tags":[123,65,134],"_links":{"self":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751"}],"collection":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1751"}],"version-history":[{"count":1,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions"}],"predecessor-version":[{"id":1752,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions\/1752"}],"wp:attachment":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1751"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1751"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1751"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}](\"https:\/\/res.cloudinary.com\/practicaldev\/image\/fetch\/s--4RqH3NUX--\/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880\/https:\/\/miro.medium.com\/max\/1024\/0%2A5R-0APqCDcUuQN5e.png\"){kind=link}
![<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nIn this project, you will learn how to set up a Next.js development environment, create new pages and components, fetch data, style, and deploy a next application.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nNext.js<\/li>Components and Pages<\/li>Data Fetching<\/li>Styling<\/li>Deployment<\/li>SSR and SPA<\/li><\/ul>\n\n\n\nIt is always great to have a real-world example such as an e-commerce showcase to learn something new. You can find the tutorial here:https:\/\/snipcart.com\/blog\/next-js-ecommerce-tutorial<\/a><\/p>\n\n\n\nBuild a full-blown multi-language blog website Nuxt.js<\/h2>\n\n\n\nNuxt.js is to Vue what Next.js is to react. A great framework to combine the power of server-side rendering and single-page applications. The final app that you could create will look like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis example project will teach you how to build a full-blown website using Nuxt.js from the initial setup to the final deployment. It makes use of many of the cool features Nuxt has to offer like pages and components as well as styling with SCSS.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nNuxt.js<\/li>Components and Pages<\/li>Storyblok module<\/li>Mixins<\/li>Vuex for state management<\/li>SCSS for styling<\/li>Nuxt middlewares<\/li><\/ul>\n\n\n\nThis is a really cool project for you and covers many of the great features of Nuxt.js. I personally love working with Nuxt so you should really try this one out as it will also make you a better Vue developer!https:\/\/www.storyblok.com\/tp\/nuxt-js-multilanguage-website-tutorial<\/a><\/p>\n\n\n\nBuild a Blog with Gatsby<\/h2>\n\n\n\nGatsby is a great static site generator that uses React and GraphQL under the hood. This is the result of this project:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nIn this tutorial, you will learn how to leverage Gatsby to build an outstanding blog that you could well use for writing your own articles while making use of React and GraphQL.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGatsby<\/li>React<\/li>GraphQL<\/li>Plugins & Themes<\/li>MDX \/ Markdown<\/li>Bootstrap CSS<\/li>Templates<\/li><\/ul>\n\n\n\nIf you ever wanted to start a blog this is a great example of how to do so leveraging React and GraphQL. I am not saying that WordPress always is a bad choice but with Gatsby you can create highly performant sites while using React which is an awesome combination!https:\/\/blog.bitsrc.io\/how-to-build-a-blog-with-gatsby-and-boostrap-d1270212b3dc<\/a><\/p>\n\n\n\nBuild a Blog with Gridsome<\/h2>\n\n\n\nGridsome is to Vue…Okay, we already had that with Next\/Nuxt but the same is true for Gridsome and Gatsby. Both use GraphQL as a data layer but Gridsome makes use of VueJS. It also is an awesome static site generator that will help you create great blogs:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis project will teach you how to build a simple blog to get started with Gridsome, GraphQL, and Markdown. It also covers how to deploy the application via Netlify.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGridsome<\/li>Vue<\/li>GraphQL<\/li>Markdown<\/li>Netlify<\/li><\/ul>\n\n\n\nThis for sure isn’t the most comprehensive tutorial but covers the basic concepts of Gridsome and Markdown and could be a good starting point.https:\/\/www.telerik.com\/blogs\/building-a-blog-with-vue-and-markdown-using-gridsome<\/a><\/p>\n\n\n\nBuild a SoundCloud-like audio player app with Quasar<\/h2>\n\n\n\nQuasar is another Vue framework that can also be used to build mobile applications. In this project you will create an audio player app looking like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nWhile the other projects focus mainly on web applications this one will show you how to create a mobile app using Vue via the Quasar framework. You should already have a working Cordova setup with android studio \/ xcode configured. If not there is a link in the tutorial to the quasar website where they show you how to set this up.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nQuasar<\/li>Vue<\/li>Cordova<\/li>Wavesurfer<\/li>UI Components<\/li><\/ul>\n\n\n\nA small project that shows the power of Quasar for building mobile apps.https:\/\/www.learningsomethingnew.com\/how-to-build-a-sound-cloud-like-audio-player-app-with-vue-js-quasar-and-wave-surfer<\/a><\/p>\n\n\n\nConclusion<\/h1>\n\n\n\nIn this article I showed you 9 projects that you can build, each focusing on another JavaScript framework or library. Now the choice is all yours: Will you try something new by using a framework you haven’t used before? Or do you want to strengthen your skills by doing a project for a technology you already have some knowledge of? Or will you rely on your favorite framework\/library and do all the projects with it?<\/p>\n\n\n\nI recently started a new site: The Smart Coder where I create free content for the community, such as more posts about javascript projects<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"Whatever you do, it’s always beneficial to have the right tools at your disposal. I love working remotely and am a big advocate of doing remote software development.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[30,25],"tags":[123,65,134],"_links":{"self":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751"}],"collection":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1751"}],"version-history":[{"count":1,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions"}],"predecessor-version":[{"id":1752,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions\/1752"}],"wp:attachment":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1751"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1751"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1751"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}](\"https:\/\/res.cloudinary.com\/practicaldev\/image\/fetch\/s--yaCeEvSK--\/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880\/https:\/\/snipcart.com\/media\/204363\/next-js-ecommerce-demo.png%3Fwidth%3D800%26format%3Dwebp%26quality%3D80%26upscale%3Dfalse\"){kind=link}
![<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis example project will teach you how to build a full-blown website using Nuxt.js from the initial setup to the final deployment. It makes use of many of the cool features Nuxt has to offer like pages and components as well as styling with SCSS.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nNuxt.js<\/li>Components and Pages<\/li>Storyblok module<\/li>Mixins<\/li>Vuex for state management<\/li>SCSS for styling<\/li>Nuxt middlewares<\/li><\/ul>\n\n\n\nThis is a really cool project for you and covers many of the great features of Nuxt.js. I personally love working with Nuxt so you should really try this one out as it will also make you a better Vue developer!https:\/\/www.storyblok.com\/tp\/nuxt-js-multilanguage-website-tutorial<\/a><\/p>\n\n\n\nBuild a Blog with Gatsby<\/h2>\n\n\n\nGatsby is a great static site generator that uses React and GraphQL under the hood. This is the result of this project:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nIn this tutorial, you will learn how to leverage Gatsby to build an outstanding blog that you could well use for writing your own articles while making use of React and GraphQL.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGatsby<\/li>React<\/li>GraphQL<\/li>Plugins & Themes<\/li>MDX \/ Markdown<\/li>Bootstrap CSS<\/li>Templates<\/li><\/ul>\n\n\n\nIf you ever wanted to start a blog this is a great example of how to do so leveraging React and GraphQL. I am not saying that WordPress always is a bad choice but with Gatsby you can create highly performant sites while using React which is an awesome combination!https:\/\/blog.bitsrc.io\/how-to-build-a-blog-with-gatsby-and-boostrap-d1270212b3dc<\/a><\/p>\n\n\n\nBuild a Blog with Gridsome<\/h2>\n\n\n\nGridsome is to Vue…Okay, we already had that with Next\/Nuxt but the same is true for Gridsome and Gatsby. Both use GraphQL as a data layer but Gridsome makes use of VueJS. It also is an awesome static site generator that will help you create great blogs:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis project will teach you how to build a simple blog to get started with Gridsome, GraphQL, and Markdown. It also covers how to deploy the application via Netlify.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGridsome<\/li>Vue<\/li>GraphQL<\/li>Markdown<\/li>Netlify<\/li><\/ul>\n\n\n\nThis for sure isn’t the most comprehensive tutorial but covers the basic concepts of Gridsome and Markdown and could be a good starting point.https:\/\/www.telerik.com\/blogs\/building-a-blog-with-vue-and-markdown-using-gridsome<\/a><\/p>\n\n\n\nBuild a SoundCloud-like audio player app with Quasar<\/h2>\n\n\n\nQuasar is another Vue framework that can also be used to build mobile applications. In this project you will create an audio player app looking like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nWhile the other projects focus mainly on web applications this one will show you how to create a mobile app using Vue via the Quasar framework. You should already have a working Cordova setup with android studio \/ xcode configured. If not there is a link in the tutorial to the quasar website where they show you how to set this up.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nQuasar<\/li>Vue<\/li>Cordova<\/li>Wavesurfer<\/li>UI Components<\/li><\/ul>\n\n\n\nA small project that shows the power of Quasar for building mobile apps.https:\/\/www.learningsomethingnew.com\/how-to-build-a-sound-cloud-like-audio-player-app-with-vue-js-quasar-and-wave-surfer<\/a><\/p>\n\n\n\nConclusion<\/h1>\n\n\n\nIn this article I showed you 9 projects that you can build, each focusing on another JavaScript framework or library. Now the choice is all yours: Will you try something new by using a framework you haven’t used before? Or do you want to strengthen your skills by doing a project for a technology you already have some knowledge of? Or will you rely on your favorite framework\/library and do all the projects with it?<\/p>\n\n\n\nI recently started a new site: The Smart Coder where I create free content for the community, such as more posts about javascript projects<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"Whatever you do, it’s always beneficial to have the right tools at your disposal. I love working remotely and am a big advocate of doing remote software development.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[30,25],"tags":[123,65,134],"_links":{"self":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751"}],"collection":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1751"}],"version-history":[{"count":1,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions"}],"predecessor-version":[{"id":1752,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions\/1752"}],"wp:attachment":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1751"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1751"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1751"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}](\"https:\/\/res.cloudinary.com\/practicaldev\/image\/fetch\/s--nlhABKCv--\/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880\/https:\/\/img.storyblok.com\/YhKNuLi_dM03tC3To3X39PyX30c%3D\/840x0\/filters:filters:fill%28FFFFFF%29:filters:format%28jpeg%29\/f\/39898\/2460x1342\/3e5c978586\/storyblok-2018-01-11-11-01-58.jpg\"){kind=link}
![<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nIn this tutorial, you will learn how to leverage Gatsby to build an outstanding blog that you could well use for writing your own articles while making use of React and GraphQL.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGatsby<\/li>React<\/li>GraphQL<\/li>Plugins & Themes<\/li>MDX \/ Markdown<\/li>Bootstrap CSS<\/li>Templates<\/li><\/ul>\n\n\n\nIf you ever wanted to start a blog this is a great example of how to do so leveraging React and GraphQL. I am not saying that WordPress always is a bad choice but with Gatsby you can create highly performant sites while using React which is an awesome combination!https:\/\/blog.bitsrc.io\/how-to-build-a-blog-with-gatsby-and-boostrap-d1270212b3dc<\/a><\/p>\n\n\n\nBuild a Blog with Gridsome<\/h2>\n\n\n\nGridsome is to Vue…Okay, we already had that with Next\/Nuxt but the same is true for Gridsome and Gatsby. Both use GraphQL as a data layer but Gridsome makes use of VueJS. It also is an awesome static site generator that will help you create great blogs:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis project will teach you how to build a simple blog to get started with Gridsome, GraphQL, and Markdown. It also covers how to deploy the application via Netlify.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGridsome<\/li>Vue<\/li>GraphQL<\/li>Markdown<\/li>Netlify<\/li><\/ul>\n\n\n\nThis for sure isn’t the most comprehensive tutorial but covers the basic concepts of Gridsome and Markdown and could be a good starting point.https:\/\/www.telerik.com\/blogs\/building-a-blog-with-vue-and-markdown-using-gridsome<\/a><\/p>\n\n\n\nBuild a SoundCloud-like audio player app with Quasar<\/h2>\n\n\n\nQuasar is another Vue framework that can also be used to build mobile applications. In this project you will create an audio player app looking like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nWhile the other projects focus mainly on web applications this one will show you how to create a mobile app using Vue via the Quasar framework. You should already have a working Cordova setup with android studio \/ xcode configured. If not there is a link in the tutorial to the quasar website where they show you how to set this up.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nQuasar<\/li>Vue<\/li>Cordova<\/li>Wavesurfer<\/li>UI Components<\/li><\/ul>\n\n\n\nA small project that shows the power of Quasar for building mobile apps.https:\/\/www.learningsomethingnew.com\/how-to-build-a-sound-cloud-like-audio-player-app-with-vue-js-quasar-and-wave-surfer<\/a><\/p>\n\n\n\nConclusion<\/h1>\n\n\n\nIn this article I showed you 9 projects that you can build, each focusing on another JavaScript framework or library. Now the choice is all yours: Will you try something new by using a framework you haven’t used before? Or do you want to strengthen your skills by doing a project for a technology you already have some knowledge of? Or will you rely on your favorite framework\/library and do all the projects with it?<\/p>\n\n\n\nI recently started a new site: The Smart Coder where I create free content for the community, such as more posts about javascript projects<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"Whatever you do, it’s always beneficial to have the right tools at your disposal. I love working remotely and am a big advocate of doing remote software development.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[30,25],"tags":[123,65,134],"_links":{"self":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751"}],"collection":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1751"}],"version-history":[{"count":1,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions"}],"predecessor-version":[{"id":1752,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions\/1752"}],"wp:attachment":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1751"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1751"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1751"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}](\"https:\/\/res.cloudinary.com\/practicaldev\/image\/fetch\/s--I9vXmAXA--\/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880\/https:\/\/miro.medium.com\/max\/800\/1%2As0KUfzonlX2HQvHrboAmFw.png\"){kind=link}
![<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nThis project will teach you how to build a simple blog to get started with Gridsome, GraphQL, and Markdown. It also covers how to deploy the application via Netlify.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nGridsome<\/li>Vue<\/li>GraphQL<\/li>Markdown<\/li>Netlify<\/li><\/ul>\n\n\n\nThis for sure isn’t the most comprehensive tutorial but covers the basic concepts of Gridsome and Markdown and could be a good starting point.https:\/\/www.telerik.com\/blogs\/building-a-blog-with-vue-and-markdown-using-gridsome<\/a><\/p>\n\n\n\nBuild a SoundCloud-like audio player app with Quasar<\/h2>\n\n\n\nQuasar is another Vue framework that can also be used to build mobile applications. In this project you will create an audio player app looking like this:<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nWhile the other projects focus mainly on web applications this one will show you how to create a mobile app using Vue via the Quasar framework. You should already have a working Cordova setup with android studio \/ xcode configured. If not there is a link in the tutorial to the quasar website where they show you how to set this up.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nQuasar<\/li>Vue<\/li>Cordova<\/li>Wavesurfer<\/li>UI Components<\/li><\/ul>\n\n\n\nA small project that shows the power of Quasar for building mobile apps.https:\/\/www.learningsomethingnew.com\/how-to-build-a-sound-cloud-like-audio-player-app-with-vue-js-quasar-and-wave-surfer<\/a><\/p>\n\n\n\nConclusion<\/h1>\n\n\n\nIn this article I showed you 9 projects that you can build, each focusing on another JavaScript framework or library. Now the choice is all yours: Will you try something new by using a framework you haven’t used before? Or do you want to strengthen your skills by doing a project for a technology you already have some knowledge of? Or will you rely on your favorite framework\/library and do all the projects with it?<\/p>\n\n\n\nI recently started a new site: The Smart Coder where I create free content for the community, such as more posts about javascript projects<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"Whatever you do, it’s always beneficial to have the right tools at your disposal. I love working remotely and am a big advocate of doing remote software development.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[30,25],"tags":[123,65,134],"_links":{"self":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751"}],"collection":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1751"}],"version-history":[{"count":1,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions"}],"predecessor-version":[{"id":1752,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions\/1752"}],"wp:attachment":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1751"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1751"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1751"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}](\"https:\/\/res.cloudinary.com\/practicaldev\/image\/fetch\/s--O175EQrx--\/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880\/https:\/\/paper-attachments.dropbox.com\/s_591039DD415F66F18804BF2A265ECE66244A5CAA5FFA5AABF40F4660051BE767_1558631464432_Screen%2BShot%2B2019-05-23%2Bat%2B6.10.46%2BPM.png\"){kind=link}
![<\/a><\/p>\n\n\n\nWhat you will learn<\/h3>\n\n\n\nWhile the other projects focus mainly on web applications this one will show you how to create a mobile app using Vue via the Quasar framework. You should already have a working Cordova setup with android studio \/ xcode configured. If not there is a link in the tutorial to the quasar website where they show you how to set this up.<\/p>\n\n\n\nTech Stack & Features<\/h3>\n\n\n\nQuasar<\/li>Vue<\/li>Cordova<\/li>Wavesurfer<\/li>UI Components<\/li><\/ul>\n\n\n\nA small project that shows the power of Quasar for building mobile apps.https:\/\/www.learningsomethingnew.com\/how-to-build-a-sound-cloud-like-audio-player-app-with-vue-js-quasar-and-wave-surfer<\/a><\/p>\n\n\n\nConclusion<\/h1>\n\n\n\nIn this article I showed you 9 projects that you can build, each focusing on another JavaScript framework or library. Now the choice is all yours: Will you try something new by using a framework you haven’t used before? Or do you want to strengthen your skills by doing a project for a technology you already have some knowledge of? Or will you rely on your favorite framework\/library and do all the projects with it?<\/p>\n\n\n\nI recently started a new site: The Smart Coder where I create free content for the community, such as more posts about javascript projects<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"Whatever you do, it’s always beneficial to have the right tools at your disposal. I love working remotely and am a big advocate of doing remote software development.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[30,25],"tags":[123,65,134],"_links":{"self":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751"}],"collection":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1751"}],"version-history":[{"count":1,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions"}],"predecessor-version":[{"id":1752,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=\/wp\/v2\/posts\/1751\/revisions\/1752"}],"wp:attachment":[{"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1751"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1751"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lvboard.infostore.in.ua\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1751"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}](\"https:\/\/res.cloudinary.com\/practicaldev\/image\/fetch\/s--Mtq3sxSD--\/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880\/https:\/\/www.learningsomethingnew.com\/quasar-sc\/device_mockup.png\"){kind=link}