9个不错的前端开源项目(1)

• Svelte 3

• Components

• Styling via CSS

• ES 6 语法

市面上并没有那么多好的的Svelte入门项目，所以我觉得这是一个不错的开始。

https://medium.com/codingthesmartway-com-blog/building-a-svelte-3-todo-app-from-start-to-deployment-1737f72c23a6

5.使用Next.js构建电商购物车

---

Next.js是最流行的框架，用于创建支持应用程序开箱即用的React应用程序。

该项目将向您展示如何构建一个如下所示的电子商务购物车：

您将学到什么

在这个项目中，您将学习如何设置一个Next.js开发环境——创建新页面和组件、获取数据、设置样式并部署下一个应用程序。

技术栈和功能

• Next.js

• Components and pages

• Data fetching

• Styling

• Deployment

• SSR and SPA

有一个真实的例子（例如电子商务展示柜）来学习新的东西总是很高兴。您可以在此处找到该教程。

https://snipcart.com/blog/next-js-ecommerce-tutorial

6.使用Nuxt.js构建功能完善的多语言博客网站

---

Nuxt.js代表Vue，Next.js代表React：一个很好的框架，结合了服务器端渲染和单页面应用程序的功能。

您可以创建的最终应用程序将如下所示：

您将学到什么

这个示例项目将教您如何使用Nuxt.js构建完整的网站——从初始设置到最终部署。

它利用了Nuxt必须提供的许多很酷的功能，例如页面和组件以及SCSS的样式。

技术栈和功能

• Nuxt.js

• Components and pages

• Storyblok module

• Mixins

• Vuex for state management

• SCSS for styling

• Nuxt middlewares

这对您来说是一个非常酷的项目，涵盖了Nuxt.js的许多出色功能。我个人很喜欢与Nuxt合作，因此您应该真正尝试使用它，因为它也会使您成为更好的Vue开发人员。

https://www.storyblok.com/tp/nuxt-js-multilanguage-website-tutorial

7.用盖茨比(Gatsby)建立博客

---

Gatsby是一个很棒的静态站点生成器，它在后台使用React和GraphQL。这是该项目的结果：

您将学到什么

在本教程中，您将学习如何利用Gatsby构建出色的博客，以便在使用React和GraphQL的同时编写自己的文章。

技术栈和功能

• Gatsby

• React

• GraphQL

• Plugins and themes

• MDX/Markdown

• Bootstrap CSS

• Templates

如果您想创建博客，这是一个很好的示例，说明如何利用React和GraphQL做到这一点。

https://blog.bitsrc.io/how-to-build-a-blog-with-gatsby-and-boostrap-d1270212b3dc

我并不是说WordPress总是一个不好的选择，但是使用Gatsby，您可以在使用React的同时创建高性能网站——这是一个了不起的组合。

8.用Gridsome建立博客

---

Gridsome是Vue的……好吧，我们已经在Next/Nuxt中有了它。

但是对于Gridsome和Gatsby也是如此。两者都使用GraphQL作为数据层，但是Gridsome使用VueJS。这也是一个很棒的静态网站生成器，可帮助您创建出色的博客：

您将学到什么

该项目将教您如何构建一个简单的博客，以开始使用Gridsome，GraphQL和Markdown。

它还介绍了如何通过Netlify部署应用程序。

技术栈和功能

• Gridsome

• Vue

• GraphQL

• Markdown

• Netlify

当然，这不是最全面的教程，但它确实涵盖了Gridsome和Markdown的基本概念，并且可能是一个很好的起点。

https://www.telerik.com/blogs/building-a-blog-with-vue-and-markdown-using-gridsome

9.使用Quasar构建类似SoundCloud的音频播放器应用

---

Quasar是另一个Vue框架，也可以用于构建移动应用程序。

在此项目中，您将创建一个音频播放器应用，如下所示：

您将学到什么

虽然其他项目主要关注Web应用程序，但本项目将向您展示如何通过Quasar框架使用Vue创建移动应用程序。

您应该已经配置了可运行Android Studio / Xcode的Cordova设置。如果没有，该教程中将有一个指向Quasar网站的链接，在那里他们向您展示了如何进行设置。

技术栈和功能

• Quasar

• Vue

• Cordova

• WaveSurfer

• UI Components

一个小项目，展示了Quasar在构建移动应用程序方面的强大功能。

总结

–
在本文中，我向您展示了可以构建的9个项目，每个项目都专注于另一个JavaScript框架或库。
现在，选择权全由您自己决定：您是否会使用以前未使用的框架来尝试一些新的东西？还是要通过为已经具备一定知识的技术进行项目来增强技能？还是您会依赖自己喜欢的框架/库，并在2020年完成所有项目？

文末

我一直觉得技术面试不是考试，考前背背题，发给你一张考卷，答完交卷等通知。

首先，技术面试是一个 认识自己 的过程，知道自己和外面世界的差距。

更重要的是，技术面试是一个双向了解的过程，要让对方发现你的闪光点，同时也要 试图去找到对方的闪光点，因为他以后可能就是你的同事或者领导，所以，面试官问你有什么问题的时候，不要说没有了，要去试图了解他的工作内容、了解这个团队的氛围。

前端面试题汇总

JavaScript

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

性能

linux

前端资料汇总