无论您是初学者还是已有经验的开发人员，该行业都需要学习新概念和语言/框架以适应快速变化。 举个例子，Facebook推出的开源框架React在短短四年内成为全球Javascript开发者的首选。 当然，Vue和Angular也有相当多的yjddjm数。 类似的东西有Svelte。 此外，还有通用框架Next.js和Nuxt.js，以及Gatsby、Gastsby、Quasar，还有更多。 如果想成为专业的Javascript开发人员，至少应该对不同的框架和库有一些经验。 ——除了有很好的JS基础外。
为了帮助你成为前端开发mhdcb，我收集了九个不同的项目。 每个都有不同的主题，使用不同的Javascript框架和库。 作为技术堆栈，可以构建它们并将其添加到投资组合中。 请记住。 没有什么比你自己开发项目更有用的了，去吧。 磨练你的内心，让它们成为现实吧。
要使用React(hooks )开发电影搜索的APP，首先要从使用react构建电影搜索APP开始。 下面的照片是应用的最终情况。
学习如何构建此APP应用程序将提高使用最新React的Hooks API技能。 这个样例项目使用React组件、几个hooks函数和外部API。 当然，也有用CSS写的风格。
名为reactwithhookscreate-react-appjsxcss的技术堆栈项目没有使用类。 为完美使用函数react提供了一个起点。 在2020年这也会有帮助。 你可以在这里找到这个简单的项目：
3359 www.freecode camp.org/news/how-to-build-a-movie-search-app-using-react-hooks-24eb 72 DD faf7/
要么跟着教程，要么开发自己风格的APP！
使用Vue开发聊天APP的另一个精彩项目是使用我最喜欢的Javascript框架VueJS开发聊天APP。 此APP应用程序应如下所示：
在本教程中，您将学习如何从头开始创建vue APP应用程序、创建组件、处理状态、创建路由、连接到第三方服务以及处理认证。
堆栈功能vuevuexvueroutervueclipushercss这真是一个很棒的项目，可以开始使用vue，也可以提高现有技术以适应2020年的发展。 教程在这里：
33559 www.site point.com/pusher-vue-real-time-chat-app /
使用Angular 8开发清洁天气APP的例子有助于使用Google的Angular 8构建清洁天气APP :
在这个项目中，我们将教授您宝贵的技能，从零开始创建APP演示，从设计到开发，再到准备在线部署。
技术堆栈功能angular8firebaseserver-siderenderingcss的网格布局和Flexbox布局mobilefriendlyresponsivedarkmode的美丽UI设计我非常喜欢这个综合项目
3359 medium.com/@ hamedbaatour/build-a-real-world-beautiful-we B- app-with-angular-6-a-to-z-ul timimi
用Sevlte开发一个待办事项项目Svelte与React相比，Vue和Angular更像是一个诚心诚意的季节，但仍然是2020年的热点之一。 待办事项不一定是最热门的话题，但可以磨练你的Svelte技能。 项目看起来如下。
本教程介绍如何使用Svelte 3从头到尾构建APP应用。 正在使用组件、样式和事件处理。
技术堆栈功能Svelte 3组件CSS风格ES 6语法好的Svelte入门项目不多，所以我觉得这还可以的入门项目。 谁知道呢，你可能会做一个更全面的Svelte教程，在明年的版本中给大家看？
3359 medium.com/@ hamedbaatour/build-a-real-world-beautiful-we B- app-with-angular-6-a-to-z-ul timimi
在Next.js上开发电子商务购物车Nextjs是支持服务器端呈现并创建开箱即用的react APP演示的最常用框架。 本项目将介绍如何开发电子商务购物车，包括：
在这个项目中，您将了解如何配置Next.js的开发环境，创建新的页面和组件，获取数据、样式以及部署next APP应用程序。
技术堆栈功能n
ext.js组件和页面数据获取样式部署SSR和SPA（服务端渲染和单页应用）通过一个实际的例子学习新的东西总是很好的，比如电子商务展示。你可以在这里找到教程：有一个实际的例子，如电子商务展示，学习新的东西总是很好的。你可以在这里找到教程：
https://medium.com/@hamedbaatour/build-a-real-world-beautiful-web-app-with-angular-6-a-to-z-ultimate-guide-2018-part-i-e121dd1d55e
使用Nuxt.js开发一个完整的多语言博客网站Nuxt.js之于Vue，就像Next.js之于React。这是一个很好的框架，能够将服务端渲染和单页应用的优势结合起来。你创建的最终应用看起来就像是这个样子：
你将学到什么这个示例项目将教你如何使用Nuxt.js建立一个完整的网站，从最初的设置到最后的部署。它利用Nuxt提供的许多酷炫的功能，比如页面和组件，以及SCSS的样式。
技术栈 & 功能 Nuxt.js组件和页面Storyblok moduleMixins（混合）Vuex状态管理SCSSNuxt中间件对你来说这会是一个非常酷的项目，它涵盖了Nuxt.js的许多重要功能。我个人很喜欢用Nuxt工作，你真的应该试试这个，因为它会让你成为一个更好的Vue开发者!
https://medium.com/@hamedbaatour/build-a-real-world-beautiful-web-app-with-angular-6-a-to-z-ultimate-guide-2018-part-i-e121dd1d55e
使用Gatsby开发一个博客Gatsby是非常好的静态网站生成器，它的底层是使用React和GraphQL。这个项目最终的样子就像下面这样：
你将学到什么在本教程中，你将学习如何利用Gatsby建立一个优秀的博客，你可以很好地利用Gatsby写自己的文章，同时可以使用React和GraphQL。
技术栈 & 功能 GatsbyReactGraphQLPlugins & ThemesMDX / MarkdownBootstrap模板如果你曾想开发一个博客，那么这是一个利用React和GraphQL来实现的绝佳范例。我并不是说WordPress是不好的选择，但是利用Gatsby，你还可以使用React开发一个高性能的网站，这是一举两得的选择！
https://medium.com/@hamedbaatour/build-a-real-world-beautiful-web-app-with-angular-6-a-to-z-ultimate-guide-2018-part-i-e121dd1d55e
使用Gridsome开发一个博客Gridsome对于Vue来说…好吧，我们已经有了Next/Nuxt，但对于Gridsome和Gatsby来说也是如此。两者都使用GraphQL作为数据层，但Gridsome利用了VueJS。它也是一个很棒的静态网站生成器，可以帮助你创建很棒的博客：
你将学到什么从这个项目中你将学到如何开始使用Gridsome，GraphQL, 和Markdown开发一个简单的博客。它还包含了如何通过Netlify部署应用。
技术栈 & 功能 GridsomeVueGraphQLMarkdownNetlify这肯定不是最全的教程，但它涵盖了Gridsome和Markdown的基本概念，可以作为一个好的的入门教程。
https://medium.com/@hamedbaatour/build-a-real-world-beautiful-web-app-with-angular-6-a-to-z-ultimate-guide-2018-part-i-e121dd1d55e
使用Quasar开发一个类似于SoundCloud的音频播放器Quasar是另一个Vue框架，它可以用来开发移动应用。在这个项目中，你创建的音乐播放器看起来会是这个样子：
你将学到什么虽然其他项目主要集中在Web应用程序上，但本项目将向您展示如何通过Quasar框架使用Vue创建一个移动应用。你应该已经有一个可以进行开发的Cordova设置和android studio / xcode配置。如果还没有的话，在教程中有一个链接到Quasar网站，在那里他们向你展示如何设置。
技术栈 & 功能 QuasarVueCordovaWavesurferUI Components这是一个小项目，它展示了Quasar在构建移动应用方面的强大功能。
https://medium.com/@hamedbaatour/build-a-real-world-beautiful-web-app-with-angular-6-a-to-z-ultimate-guide-2018-part-i-e121dd1d55e
总结在这篇文章中，我向你展示九个你可以开发的项目，每个项目都使用了不同的Javasript框架或者库。现在是你决定的时候了：你会使用你从未使用过的框架尝试开发项目吗？或者你想通过做一个项目来提升你已有的技能吗？或者你会依赖你最拿手的框架或者库来完成所有项目的开发吗？
我最近开了一个新网站：The Smart Coder，在这里，我将为社区创造免费的内容，比如更加优质的javascript项目
原文链接9 Projects you can do to become a Frontend Master