推薦一些 GitHub 上值得前端學習的開源實戰項目,進階必看!

2020-12-10 jiegiser

最近好多同學問我了解找一些學習的實戰項目；看一個別人寫的優秀的項目，從中可以學到很多；比如代碼的規範，項目的結構；從項目作者每次提交記錄，去學習一些別人的開發思維以及開發整個項目的流程；下面我主要找了一些比較火的一些框架以及 node 項目。

Vue.js

1. vue-element-admin

vue-element-admin 是一個後臺前端解決方案，它基於 vue 和 element-ui 實現。它使用了最新的前端技術棧，內置了 i18n 國際化解決方案，動態路由，權限驗證，提煉了典型的業務模型，提供了豐富的功能組件，它可以幫助你快速搭建企業級中後臺產品原型。相信不管你的需求是什麼，本項目都能幫助到你。項目作者還搭配了一些教程文章，很值得看！

地址：https://github.com/PanJiaChen/vue-element-admin

2. blog-vue-typescript

此項目是基於 Vue 全家桶 + TypeScript + Element-UI 技術棧的簡潔時尚博客網站。TypeScript 具有類型系統，且是 JavaScript 的超集，TypeScript 在 2018年 勢頭迅猛，可謂遍地開花。Vue3.0 將使用 TS 重寫，重寫後的 Vue3.0 將更好的支持 TS。2019 年 TypeScript 將會更加普及，能夠熟練掌握 TS，並使用 TS 開發過項目，將更加成為前端開發者的優勢。

地址：https://github.com/biaochenxuying/blog-vue-typescript

3. Spring Boot 後端 + Vue 管理員前端 + 微信小程序用戶前端 + Vue 用戶移動端

這個項目是一個小商場系統，基本完成一個商場系統必備的功能；全棧進階推薦！

地址：https://github.com/linlinjava/litemall

4. 基於 vue2 + vuex 構建一個具有 45 個頁面的大型單頁面應用

此項目大大小小共 45 個頁面，涉及註冊、登錄、商品展示、購物車、下單等等，是一個完整的流程。一般公司即便是官網的單頁面項目都沒這麼複雜，如果這個項目能駕馭得了，相信大部分公司的其他單頁面應用也就不在話下，即便更複雜，也不會比這個高到哪裡去。

地址：https://github.com/bailicangdu/vue2-elm

5. Vue相關開源項目庫匯總

這個項目匯總了 vue 相關的很多開源項目，star 數相對較多的；包括 UI 組件、框架愛、工具庫等等，推薦看！

地址：https://github.com/opendigg/awesome-github-vue

React.js

1. 網易雲音樂第三方

技術棧：Electron, React, MobX, JSS

地址： https://github.com/trazyn/ieaseMusic

2. 仿知乎日報

該項目使用React Native實現；可以在Android和iOS上運行；這是一個演示項目，展示了如何使用React Native開發完整的應用程式。

地址：https://github.com/race604/ZhiHuDaily-React-Native

3. 使用 react hooks + koa2 + sequelize + mysql 搭建的前後臺的博客

前後臺分離式開發（項目中也包含博客的後臺管理系統），為了方便記錄後端開發過程，筆者將後端也一起放在同個項目文件夾中。

地址：https://github.com/alvin0216/react-blog

4. 基於React Native支持 Android 和 iOS 雙平臺的項目

這是一個用來查看GitHub最受歡迎與最熱項目的App,它基於React Native支持Android和iOS雙平臺。

地址：https://github.com/crazycodeboy/GitHubPopular

Node.js

1. 基於Node.js+MySQL開發的開源微信小程序商城（微信小程序）

界面高仿網易嚴選商城(主要是2016年wap版)測試數據採集自網易嚴選商城功能和資料庫參考ecshop服務端api基於Ｎode.js+ThinkJS+MySQL計劃添加基於Vue.js的後臺管理系統、PC版、Ｗap版地址：https://github.com/tumobi/nideshop-mini-program

2. React技術棧+Express+Mongodb實現個人博客

一個博客項目，技術棧：react + express + Mongodb。

地址：https://github.com/Nealyang/React-Express-Blog-Demo

3. 基於 node.js + Mongodb 構建的後臺系統

整個項目分為兩部分：前臺項目接口、後臺管理接口，共60多個。涉及登陸、註冊、添加商品、商品展示、篩選排序、購物車、下單、用戶中心等，構成一個完整的流程。

地址： https://github.com/bailicangdu/node-elm

以上是我整理的一些 github 上開源的比較好的項目；大家可以關注我，後期會寫一些面試相關的題；

相關焦點

  • 【吐血整理】強烈推薦 GitHub 上值得學習的開源實戰項目(持續更新中,萬字長文建議收藏)
    關注 深圳灣碼農，回復「2」加入我們一起學習，天天進步強烈推薦 GitHub 上值得學習的開源實戰項目
  • 6月份Github上熱門的開源項目
    6月份GitHub上熱門的開源項目排行已經出爐啦，一起來看看上榜詳情吧！除此之外，本倉庫拓展了更加深入的源碼分析，多線程並發等的知識，是一個比較全面的 C++ 學習從入門到進階提升的倉庫。
  • 推薦這 10 個 GitHub 上超火的前端面試項目,打造自己的加薪寶庫!
    上超火的 10 個前端面試項目。這項目的問題，很多同學參與回答，內容也很新，作為每日突擊的學習，很適合準備跳槽的同學。https://github.com/Advanced-Frontend/Daily-Interview-Questionfe-interview
  • Github最值一讀開源好書及BAT面試題庫
    對技術人員而言，進階路上似乎一直找不到合適的書籍或者資源可供學習，即便找到了，似乎也沒有合適的題庫可以練習。筆者近日在Github上發現了很多不錯的技術書籍，這其中也包括一些中文譯本，程式設計師可以免費閱讀。同時，還有來自於百度、小米、美團、58、獵豹、360、新浪、搜狐的內部面試題庫可供廣大程式設計師練手，你確定不仔細看看?
  • 【乾貨】深度學習預測比特幣價格;基於神經網絡的自動化前端開發 | Github 項目推薦
    海豚大數據實驗室從 YouTube、知乎以及 Github 官網上搜羅了數個與 AI 相關的開源項目，為 AI 開發者的設計提供參考。這些項目涉及自動化前端開發、中文近義詞處理以及火熱的比特幣等領域，詳細信息和具體代碼實現請閱讀下文。
  • 2019年第一季度GitHub上最熱門的開源項目
    https://github.com/charlax/professional-programming Star 9952這是一個關於全棧工程師的開源項目，該已經創建3年了，但直到最近才在GitHub上大火，目前，該列表裡涵蓋了必讀編程書籍、必讀文章、其他資源清單、主題、概念五大模塊，其中主題又分為40個小節，項目的創建者charlax表示，創建這個項目的目的主要是為了幫助大家成為一個真正的全棧工程師
  • 適合JS 新手學習的開源項目——在 GitHub 學編程
    作者：HelloGitHub-小魚乾這裡是 HelloGitHub 的《GitHub 上適合新手的開源項目》系列的最後一篇，系列文章：C++ 篇Python 篇Go 篇Java 篇那作為一個新手要學習系統化地學習 JS。[手動狗頭]有更快捷的方法嗎？有！在本篇文章中你將從基礎招式學習，了解 HTML、CSS、JS 等基礎概念之後，實踐一把吃豆人遊戲製作，再開啟性能調優之旅，最後闖蕩前端江湖。
  • 2018年11月份GitHub上最熱門的開源項目
    深度學習500問，以問答形式對常用的概率知識、線性代數、機器學習、深度學習、計算機視覺等熱點問題進行闡述，以幫助自己及有需要的讀者。 全書分為18個章節，近30萬字。點擊查閱詳情：《川大優秀畢業生在GitHub上建了一個項目，還未完結就獲贊無數》https://github.com/BcRikko/NES.css Star 5852
  • C++ & Linux 後端進階之:學習開源項目
    進一步，本文講解兩個問題：怎麼學習在介紹具體的C++項目之前，先介紹我自己學習開源項目、閱讀源碼的方式：首先！！！要學會使用這個項目。以STL為例，應該極少有人學習STL是直接從閱讀STL源碼開始的，基本都是從學習std::vector、std::list等容器的使用方式開始。當你能熟練使用了，才有會更好的基礎來對內部實現一探究竟。
  • 推薦 7 個 Github 上近 200k Star 的計算機學習資源,練好前端內功的秘籍!
    超級貓一共精選推薦了 7 個非常不錯的計算機科學學習的 Github 倉庫！希望對大家有幫助！1. computer-scienceGithub 地址：https://github.com/ossu/computer-science
  • 8月份GitHub上熱門的Java開源項目
    8月份GitHub上最熱門的Java開源項目排行已經出爐啦，一起來看看上榜詳情吧：該項目基於成熟的開源產品Quartz和Zookeeper及其客戶端Curator進行二次開發。
  • 200+優秀Github項目精選
    網站: https://gitee.com/SnailClimb/JavaGuidedoocs / advanced-java😮 網際網路 Java 工程師進階知識完全掃盲：涵蓋高並發、分布式、高可用、微服務、海量數據處理等領域知識，後端同學必看，前端同學也可學習。
  • 從零開始學習web前端技術路線圖
    1、Visual Studio Code微軟開源免費產品，受到非常多技術人員的喜愛，基本上成為前端開發者的必備編輯器，強大的插件擴展，可以靈活的打造自己喜歡的風格。給你們送上常用插件列表拿走不謝。廖雪峰的官方網站（https://www.liaoxuefeng.com/）：廖雪峰老師寫過很多優秀的系列教程，值得去學習。張鑫旭（https://www.zhangxinxu.com/）：專注前端技術的大牛之一，出版《css世界》一書。
  • GitHub 上有哪些適合新手跟進的優質項目?
    21個深度學習項目合集git：https://github.com/hzy46/Deep-Learning-21-Examplesstar：3.7k做這些項目，你可以在動手實驗的過程中，比較輕鬆地掌握深度學習和TensorFlow的使用技巧，並且能完整地做出一些有意思的項目。主要包括CNN，GAN，RNN，LSTM，強化學習相關項目等。
  • 009 | 快速入門Web前端開發的正確姿勢
    以下是系列書的github地址：那麼，這麼多學習資源，我們應該如何學習才高效呢？其實，和前面學習 Android 和 iOS 時一樣，我們主要還是為了了解各種核心概念，我們不可能在短期內熟悉所有知識點，因此，我還是和前面的文章一樣，也羅列出一些核心的知識點吧。
  • GitHub上最火的程式設計師簡歷項目與模版下載
    、面試題、簡歷編寫技巧、簡歷模版等資料，所以本文就統一整理一些瓶子君所知道的面試資料。壹題22k star 項目，160+多道前端面試真題含解答，還有一系列基礎進階文章https://muyiy.cn/question/JavaScript-Algorithms2.1k star 項目，130+道前端算法、編程、手寫源碼真題，還有一系列前端算法進階文章，持續更新中https://github.com/sisterAn/JavaScript-Algorithms
  • 12 個 GitHub 上超火的 JavaScript 奇技淫巧項目,找到寫 JavaScript 的靈感!
    大家好，我是你們的 貓哥，一個不喜歡吃魚、又不喜歡喵 的超級貓 ~前言貓哥是一個常年混跡在 GitHub 上的貓星人，所以發現了不少好的前端開源項目、常用技巧，在此分享給大家。公眾號：前端GitHub，專注於挖掘 GitHub 上優秀的前端開源項目，並以專題的形式推薦，每專題大概 10 個好項目，每周會有一到三篇精華文章推送。已經推薦了 面試項目、css奇技淫巧項目、代碼規範項目、數據結構與算法項目、管理後臺模板、前端必備在線工具 等專題的近 100 個優秀項目了。
  • 分享一些開源項目,可以接私活了
    分享一些開源項目，可以接私活了 對於很多程式設計師來說，可以利用自身資源，在業餘時間做一些私活，賺點零花錢，今天推薦幾款開源項目，讓大家做項目上手更快、更方便。
  • 10月份Github上熱門的開源項目
    10月份GitHub上最熱門的Java開源項目排行已經出爐啦，一起來看看上榜詳情吧：1. base-adminhttps://github.com/huanzi-qch/base-adminStar 1499Base Admin一套簡單通用的後臺管理系統
  • 1月份Github上熱門Python開源項目!
    1月份GitHub上最熱門的Python開源項目排行已經出爐啦，一起來看看上榜詳情：1. fastapihttps://github.com/tiangolo/fastapiStar 9051FastAPI 是一個 Rails 庫用來快速查詢相互依存的數據集合併返回時候人類閱讀的