Github上八個優(yōu)秀的React項目
概覽:
- React Tetris:俄羅斯方塊
- Kutt.it:URL 縮短器
- Win11 in React:Web 版 Windows 11
- JoL-player:視頻播放器
- Take Note:筆記應用
- Fiora:聊天應用
- Todoist clone:克隆版 Todoist
- Jira Clone:克隆版 Jira
1、 React Tetris
React Tetris 是一個使用 React、Redux、Immutable 制作的俄羅斯方塊游戲。它是一個非常不錯的 React 練手項目,小小的“方塊”還是有很多的細節(jié)可以優(yōu)化和打磨。項目的官方介紹中還有一些作者開發(fā)這個項目時的一些想法(中文),值得借鑒。
Github:https://github.com/chvin/react-tetris。
2、 Kutt.it
Kutt 是一個現(xiàn)代的 URL 縮短器,支持自定義域??s短網(wǎng)址、管理鏈接并查看點擊率統(tǒng)計信息。支持自定義域名,設置鏈接密碼和描述,縮短URL的私人統(tǒng)計信息,查看、編輯、刪除和管理鏈接,RESTful API等。使用Node.js、Express、Passport、React、TypeScript、Next、Easy Peasy、styled-components、Recharts、PostgreSQL、Redis 等技術(shù)構(gòu)建。
Github:https://github.com/thedevs-network/kutt。
3、Win11 in React
制作這個開源項目的目的是希望使用 React、CSS (SCSS) 和 JS 等標準 Web 技術(shù)在 Web 上復制 Windows 11 桌面體驗。作者大概花了兩周的時間做出了這個網(wǎng)頁版的 Windows 11,在瀏覽器上就可以體驗 Windows 11 系統(tǒng)的操作。
Github:https://github.com/blueedgetechno/win11React。
4、JoL-player
JoL-player 是一個簡潔,美觀,功能強大的 React 播放器。它通過了開箱即用的高質(zhì)量 React 組件,使用 TypeScript 開發(fā),提供完整的類型定義文件,支持國際化語言,強大的API和功能,并且支持React 18+版本。
Github:https://github.com/lgf196/JoL-player。
5、Take Note
TakeNote 是一款 Web 筆記應用,它是一個沒有數(shù)據(jù)庫的靜態(tài)站點,不會將筆記同步到云端。筆記會暫時保存在本地存儲中,可以以 zip 格式下載 markdown 格式的所有筆記。該應用支持搜索筆記、多光標編輯、鏈接筆記、語法高亮、鍵盤快捷鍵、拖放操作、Markdown 預覽等功能。
TakeNote 使用 TypeScript、React、Redux、Node、Express、Codemirror、Webpack、Jest、Cypress、Feather Icons、ESLint 和 Mousetrap 等技術(shù)創(chuàng)建。
Github:https://github.com/taniarascia/takenote。
6、Fiora
Fiora 是一個有趣的開源聊天應用程序。它是基于Node.js、React和socket.io技術(shù)開發(fā)的。它包含了后端、前端、Android 和 iOS 應用程序,支持 Windows / Linux / macOS 系統(tǒng)。該應用支持添加好友、群聊、設置主題、消息提醒、多種消息類型等。
Github:https://github.com/yinxin630/fiora。
7、Todoist clone
Todoist clone 使用 create-react-app 作為基礎構(gòu)建,使用的技術(shù)是 React(自定義 Hooks、context)、Firebase 和 React 測試庫。除此之外,還使用 SCSS (CSS) 并遵循 BEM 命名方法來設置應用程序的樣式。作者希望通過這個項目讓人們更好地理解React。
Github:https://github.com/karlhadwen/todoist。
8、Jira Clone
JIRA 是一個項目與事務跟蹤工具,被廣泛應用于缺陷跟蹤、客戶服務、需求收集、流程審批、任務跟蹤、項目跟蹤和敏捷管理等工作領域。而 Jira Clone 是使用 React 開發(fā)的 Jira 的簡化版。與 Jira 一樣,該項目也提供交互式用戶界面,但代碼更簡單。該項目是使用 React 以及 webpack、Node.js、ESLint、styled-components 和 cypress 構(gòu)建的。該應用使用最新的 React 特性,例如帶有Hooks的函數(shù)組件。此外,該項目還使用了幾個自定義的輕量級 UI 組件,包括模態(tài)框和日期選擇器等。
Github:https://github.com/oldboyxx/jira_clone。