TE
科技回声
首页24小时热榜最新最佳问答展示工作
GitHubTwitter
首页

科技回声

基于 Next.js 构建的科技新闻平台,提供全球科技新闻和讨论内容。

GitHubTwitter

首页

首页最新最佳问答展示工作

资源链接

HackerNews API原版 HackerNewsNext.js

© 2025 科技回声. 版权所有。

Ask HN: What good open source projects written in React that I can learn from?

270 点作者 GutenYe超过 8 年前

48 条评论

rarrrrrr超过 8 年前
Not sure just what you&#x27;re looking for, but SpiderOak&#x27;s Semaphor is a desktop&#x2F;mobile end-to-end-encrypted Slack alternative where the presentation layer is React, and the client side app backend (networking, crypto, database) is Go. That keeps the React code focused and easy to follow.<p>Source is here: <a href="https:&#x2F;&#x2F;spideroak.com&#x2F;solutions&#x2F;semaphor&#x2F;source" rel="nofollow">https:&#x2F;&#x2F;spideroak.com&#x2F;solutions&#x2F;semaphor&#x2F;source</a>
评论 #12802639 未加载
emilong超过 8 年前
This is a nice, non-trivial, but not too big project in react and redux:<p><a href="https:&#x2F;&#x2F;github.com&#x2F;andrewngu&#x2F;sound-redux" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;andrewngu&#x2F;sound-redux</a>
评论 #12802230 未加载
scrollaway超过 8 年前
Plugging in our own :) A Hearthstone replay engine<p><a href="https:&#x2F;&#x2F;github.com&#x2F;HearthSim&#x2F;Joust" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;HearthSim&#x2F;Joust</a><p>Example: <a href="https:&#x2F;&#x2F;hsreplay.net&#x2F;replay&#x2F;rjUdp6iC5FcQmKGmLX35RA" rel="nofollow">https:&#x2F;&#x2F;hsreplay.net&#x2F;replay&#x2F;rjUdp6iC5FcQmKGmLX35RA</a>
评论 #12803669 未加载
评论 #12804368 未加载
praveenster超过 8 年前
The new Wordpress frontend code seems to be utilizing React:<p><a href="https:&#x2F;&#x2F;developer.wordpress.com&#x2F;calypso&#x2F;" rel="nofollow">https:&#x2F;&#x2F;developer.wordpress.com&#x2F;calypso&#x2F;</a><p><a href="https:&#x2F;&#x2F;github.com&#x2F;Automattic&#x2F;wp-calypso" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;Automattic&#x2F;wp-calypso</a>
评论 #12803293 未加载
评论 #12804741 未加载
jacobjzhang超过 8 年前
My buddy Jason and the Mozilla devtools team have been working on the next version of the Firefox debugger, written in React and Redux:<p><a href="https:&#x2F;&#x2F;github.com&#x2F;devtools-html&#x2F;debugger.html" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;devtools-html&#x2F;debugger.html</a><p>Open source FTW
评论 #12804897 未加载
评论 #12805901 未加载
activatedgeek超过 8 年前
FormidableLabs (<a href="https:&#x2F;&#x2F;github.com&#x2F;FormidableLabs" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;FormidableLabs</a>) is doing some very good work in the React ecosystem. Here are projects that I&#x27;m particularly excited about:<p>1. Spectacle (<a href="https:&#x2F;&#x2F;github.com&#x2F;FormidableLabs&#x2F;spectacle" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;FormidableLabs&#x2F;spectacle</a>), Presentation Library<p>2. Victory (<a href="https:&#x2F;&#x2F;github.com&#x2F;FormidableLabs&#x2F;victory" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;FormidableLabs&#x2F;victory</a>), Graphing Library<p>3. Radium (<a href="https:&#x2F;&#x2F;github.com&#x2F;FormidableLabs&#x2F;radium" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;FormidableLabs&#x2F;radium</a>), Component Styling
yamalight超过 8 年前
I&#x27;m currently building a React app while trying to explain how&#x2F;what I do in weekly(-ish) videos. You can find the source code (along with links to videos) on github: <a href="https:&#x2F;&#x2F;github.com&#x2F;yamalight&#x2F;building-products-with-js" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;yamalight&#x2F;building-products-with-js</a>
niftich超过 8 年前
I recommend &#x27;debugger.html&#x27; [1] from Mozilla.<p>&quot;debugger.html is a hackable debugger for modern times, built from the ground up using React and Redux. It is designed to be approachable, yet powerful. And it is engineered to be predictable, understandable, and testable.<p>Mozilla created this debugger for use in the Firefox Developer Tools.&quot;<p>[1] <a href="https:&#x2F;&#x2F;github.com&#x2F;devtools-html&#x2F;debugger.html" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;devtools-html&#x2F;debugger.html</a>
评论 #12802929 未加载
OmarIsmail超过 8 年前
I highly recommend checking out React Toolbox [<a href="http:&#x2F;&#x2F;react-toolbox.com&#x2F;#&#x2F;" rel="nofollow">http:&#x2F;&#x2F;react-toolbox.com&#x2F;#&#x2F;</a>]. It&#x27;s a horrible name for what it is - but it&#x27;s a Material Design implementation in React.<p>There are simple components, and then more complicated concepts like higher-order components and factories. It has very good documentation, and is under active development.
indexerror超过 8 年前
I&#x27;ll plug in my project here.<p>Work in progress: <a href="https:&#x2F;&#x2F;github.com&#x2F;Cloud-CV&#x2F;cvfy-frontend" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;Cloud-CV&#x2F;cvfy-frontend</a><p>It is a platform to build pipelines to showcase machine learning models on the web. You select input components, output components, and use the cvfy-lib python client to connect all these.
评论 #12806315 未加载
grinich超过 8 年前
You might be interested in building React apps that support plugins safely: <a href="https:&#x2F;&#x2F;nylas.com&#x2F;blog&#x2F;react-plugins&#x2F;" rel="nofollow">https:&#x2F;&#x2F;nylas.com&#x2F;blog&#x2F;react-plugins&#x2F;</a><p>The code is also open source: <a href="http:&#x2F;&#x2F;github.com&#x2F;nylas&#x2F;n1" rel="nofollow">http:&#x2F;&#x2F;github.com&#x2F;nylas&#x2F;n1</a><p>(I work at Nylas)
caterama超过 8 年前
ES6 React with react-router, server side rendering, and Webpack code splitting + tree shaking. It&#x27;s based on the &quot;huge-app&quot; example from the react-router project.<p><a href="https:&#x2F;&#x2F;github.com&#x2F;5tefan&#x2F;universal-react-demo" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;5tefan&#x2F;universal-react-demo</a>
jedireza超过 8 年前
A website and user system starter. Server side is built with hapi.js. The front-end is built with React. Redux as the state container. Client side routing with React Router.<p><a href="https:&#x2F;&#x2F;jedireza.github.io&#x2F;aqua&#x2F;" rel="nofollow">https:&#x2F;&#x2F;jedireza.github.io&#x2F;aqua&#x2F;</a><p><a href="https:&#x2F;&#x2F;github.com&#x2F;jedireza&#x2F;aqua" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;jedireza&#x2F;aqua</a>
artellectual超过 8 年前
I have a video series with source code, you can follow along if you want.<p>Videos: <a href="https:&#x2F;&#x2F;www.codemy.net&#x2F;channels&#x2F;react-foundation" rel="nofollow">https:&#x2F;&#x2F;www.codemy.net&#x2F;channels&#x2F;react-foundation</a><p>Source Code: <a href="https:&#x2F;&#x2F;github.com&#x2F;codemy&#x2F;invoiced-ui" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;codemy&#x2F;invoiced-ui</a>
rickhanlonii超过 8 年前
We wrote slack-like app for reddit called Breaker and the front-end is written in React:<p>- <a href="http:&#x2F;&#x2F;breakerapp.com&#x2F;r&#x2F;breakerapp" rel="nofollow">http:&#x2F;&#x2F;breakerapp.com&#x2F;r&#x2F;breakerapp</a><p>- <a href="http:&#x2F;&#x2F;github.com&#x2F;larvalabs&#x2F;breaker" rel="nofollow">http:&#x2F;&#x2F;github.com&#x2F;larvalabs&#x2F;breaker</a>
fzaninotto超过 8 年前
Admin-on-rest: Admin GUI for REST APIS, using react + redux + react-router + saga + material ui<p><a href="https:&#x2F;&#x2F;github.com&#x2F;marmelab&#x2F;admin-on-rest" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;marmelab&#x2F;admin-on-rest</a><p>Contains documentation and unit tests, plus a few neat react tricks (like a custom React-router Route component and an accumulator saga), documented there:<p>* <a href="http:&#x2F;&#x2F;marmelab.com&#x2F;blog&#x2F;2016&#x2F;09&#x2F;20&#x2F;custom-react-router-component.html" rel="nofollow">http:&#x2F;&#x2F;marmelab.com&#x2F;blog&#x2F;2016&#x2F;09&#x2F;20&#x2F;custom-react-router-comp...</a> * <a href="http:&#x2F;&#x2F;marmelab.com&#x2F;blog&#x2F;2016&#x2F;10&#x2F;18&#x2F;using-redux-saga-to-deduplicate-and-group-actions.html" rel="nofollow">http:&#x2F;&#x2F;marmelab.com&#x2F;blog&#x2F;2016&#x2F;10&#x2F;18&#x2F;using-redux-saga-to-dedu...</a>
Cymen超过 8 年前
If you&#x27;re interested in component composition, react-bootstrap is a good one to look at for ideas:<p><a href="https:&#x2F;&#x2F;github.com&#x2F;react-bootstrap&#x2F;react-bootstrap" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;react-bootstrap&#x2F;react-bootstrap</a><p>They are also accepting of new contributors.
ehfeng超过 8 年前
Sentry (<a href="https:&#x2F;&#x2F;github.com&#x2F;getsentry&#x2F;sentry" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;getsentry&#x2F;sentry</a>) has a React frontend but it&#x27;s a big enough project that it&#x27;s less ideal for learning.
rwieruch超过 8 年前
React + Redux SoundCloud Application<p>GitHub: <a href="https:&#x2F;&#x2F;github.com&#x2F;rwieruch&#x2F;favesound-redux" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;rwieruch&#x2F;favesound-redux</a> Live: <a href="http:&#x2F;&#x2F;www.favesound.de&#x2F;" rel="nofollow">http:&#x2F;&#x2F;www.favesound.de&#x2F;</a><p>Basic feature set: Login, Sort&#x2F;Filter&#x2F;Search, Play Audio in Browser, Pagination, ...<p>No over engineered libraries: normalizr, redux-thunk, react-touter, enzyme ...<p>Tutorial to build your own: <a href="http:&#x2F;&#x2F;www.robinwieruch.de&#x2F;the-soundcloud-client-in-react-redux&#x2F;" rel="nofollow">http:&#x2F;&#x2F;www.robinwieruch.de&#x2F;the-soundcloud-client-in-react-re...</a>
whicks超过 8 年前
I had this same question awhile back: <a href="https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=12497202" rel="nofollow">https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=12497202</a><p>Just leaving this here for reference and as a resource.
purephase超过 8 年前
Metabase is written in React: <a href="https:&#x2F;&#x2F;github.com&#x2F;metabase&#x2F;metabase" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;metabase&#x2F;metabase</a>
astockwell超过 8 年前
Mattermost[1]: Open-source Slack alternative written in React and Go.<p>[1] <a href="https:&#x2F;&#x2F;www.mattermost.org" rel="nofollow">https:&#x2F;&#x2F;www.mattermost.org</a>
评论 #12803599 未加载
tbrock超过 8 年前
parse-dashboard: <a href="https:&#x2F;&#x2F;github.com&#x2F;ParsePlatform&#x2F;parse-dashboard" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;ParsePlatform&#x2F;parse-dashboard</a><p>It even has user interface guidelines for the components.
boyter超过 8 年前
<a href="https:&#x2F;&#x2F;github.com&#x2F;madou&#x2F;armory-react" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;madou&#x2F;armory-react</a><p>A Guild Wars 2 Armory. Fairly impressive. You can view it live too <a href="https:&#x2F;&#x2F;gw2armory.com&#x2F;" rel="nofollow">https:&#x2F;&#x2F;gw2armory.com&#x2F;</a>
hellothree23超过 8 年前
Nice resource<p><a href="https:&#x2F;&#x2F;react.rocks&#x2F;" rel="nofollow">https:&#x2F;&#x2F;react.rocks&#x2F;</a>
eg312超过 8 年前
I don&#x27;t know how much you can learn from it, but here is a react + three.js project I&#x27;ve done for testing: <a href="https:&#x2F;&#x2F;github.com&#x2F;alexadam&#x2F;bridges" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;alexadam&#x2F;bridges</a>
victorbinetruy超过 8 年前
MASAS - &quot;Make A Sound And Share&quot; www.masas.fm<p><a href="https:&#x2F;&#x2F;github.com&#x2F;masasfm" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;masasfm</a><p>All I know is that it written in react and by what seems to be three, very passionate, brothers.<p>&quot;MASAS.fm is going to be a platform on which all of an Artist&#x27;s needs, from creating music, to getting it discovered, to selling it and playing at live events, can be met, for free. Thus eliminating the need for all the vicious middlemen that have placed themselves between Artists and their fans. Together, we can build that platform, one that will truly help all Artists, without ripping them off of their music rights!&quot;<p>www.MASAS.fm
riledhel超过 8 年前
For another type of application, you can check brave browser source code <a href="https:&#x2F;&#x2F;github.com&#x2F;brave&#x2F;browser-laptop" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;brave&#x2F;browser-laptop</a>
danesparza超过 8 年前
Facebook has some great tutorials and examples on their site: <a href="https:&#x2F;&#x2F;facebook.github.io&#x2F;react&#x2F;tutorial&#x2F;tutorial.html" rel="nofollow">https:&#x2F;&#x2F;facebook.github.io&#x2F;react&#x2F;tutorial&#x2F;tutorial.html</a><p>Also: I would highly recommend getting familiar with both npm and Babel&#x2F;ES6&#x2F;ES2015 -- even if you&#x27;re not a node developer.<p>I found that understanding the tech was one thing, but when I actually started building my own projects I sought out community help with specific questions I had.<p>Have fun!
jwookie55超过 8 年前
Ill plug our new project, Desklamp. Its a replacement for the Redux + React Router standard. These two just weren&#x27;t built to work with each other and so take a lot of extra code. Desklamp solves this problem by delivering a single library that handles both state and routing.<p>check it out here <a href="https:&#x2F;&#x2F;github.com&#x2F;desklamp-js&#x2F;desklamp" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;desklamp-js&#x2F;desklamp</a> and feel free to make pull requests and submit issues.<p>good luck in your tech journey
slig超过 8 年前
I build this trivial SPA front end <a href="https:&#x2F;&#x2F;github.com&#x2F;javascript-obfuscator&#x2F;javascript-obfuscator-ui" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;javascript-obfuscator&#x2F;javascript-obfuscat...</a> to a Node.js package.<p>demo here: <a href="https:&#x2F;&#x2F;javascriptobfuscator.herokuapp.com" rel="nofollow">https:&#x2F;&#x2F;javascriptobfuscator.herokuapp.com</a><p>It has just two reducers, uses redux-promise-middleware to make one ajax call, and uses Semantic-UI for the UI.
sAbakumoff超过 8 年前
Hi! Here is the top 100 of the most rated react apps in Github: <a href="https:&#x2F;&#x2F;airtable.com&#x2F;shrB7DlRYXDlU23a6" rel="nofollow">https:&#x2F;&#x2F;airtable.com&#x2F;shrB7DlRYXDlU23a6</a> And the article that describes how I obtained this list: <a href="https:&#x2F;&#x2F;medium.com&#x2F;@sAbakumoff&#x2F;react-entourage-6d51e7df9944#.mekyvmx36" rel="nofollow">https:&#x2F;&#x2F;medium.com&#x2F;@sAbakumoff&#x2F;react-entourage-6d51e7df9944#...</a>
samtoday超过 8 年前
Presenter Club is written in React&#x2F;Redux:<p><a href="https:&#x2F;&#x2F;gitlab.com&#x2F;presenter.club&#x2F;presenter.club&#x2F;tree&#x2F;master&#x2F;static&#x2F;jsx" rel="nofollow">https:&#x2F;&#x2F;gitlab.com&#x2F;presenter.club&#x2F;presenter.club&#x2F;tree&#x2F;master...</a><p><a href="https:&#x2F;&#x2F;www.presenter.club&#x2F;" rel="nofollow">https:&#x2F;&#x2F;www.presenter.club&#x2F;</a>
goo超过 8 年前
<a href="https:&#x2F;&#x2F;github.com&#x2F;callemall&#x2F;material-ui" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;callemall&#x2F;material-ui</a> is a great collection of components -- there&#x27;s perhaps some insight into how to make (and document!) reusable components, since the project is built to be a component library for others&#x27; use
cybermarkus1超过 8 年前
I built my own react-cellar to learn react, redux, typescript, and so on.<p>GitHub: <a href="https:&#x2F;&#x2F;github.com&#x2F;ayxos&#x2F;react-cellar" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;ayxos&#x2F;react-cellar</a> Web: <a href="https:&#x2F;&#x2F;react-cellar.herokuapp.com&#x2F;" rel="nofollow">https:&#x2F;&#x2F;react-cellar.herokuapp.com&#x2F;</a>
umurkontaci超过 8 年前
WordPress.com front end is written with React. It&#x27;s one of the biggest React projects, and it is used in production. We are actively developing on GitHub and trying develop out in the open.<p><a href="https:&#x2F;&#x2F;github.com&#x2F;Automattic&#x2F;wp-calypso" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;Automattic&#x2F;wp-calypso</a>
ryanluker超过 8 年前
If you are looking for more of a learning project (and in typescript) I converted Wes bos&#x27; react tutorial series for my own learning <a href="http:&#x2F;&#x2F;www.github.com&#x2F;ryanluker&#x2F;typed-catch-of-the-day" rel="nofollow">http:&#x2F;&#x2F;www.github.com&#x2F;ryanluker&#x2F;typed-catch-of-the-day</a>
dmlittle超过 8 年前
<a href="https:&#x2F;&#x2F;pokedextracker.com" rel="nofollow">https:&#x2F;&#x2F;pokedextracker.com</a> is written in react<p><a href="https:&#x2F;&#x2F;github.com&#x2F;robinjoseph08&#x2F;pokedextracker.com" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;robinjoseph08&#x2F;pokedextracker.com</a>
andy-shea超过 8 年前
Octopush - A simple GUI for Capistrano built on React and Redux with server-side rendering<p><a href="https:&#x2F;&#x2F;github.com&#x2F;octahedron&#x2F;octopush" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;octahedron&#x2F;octopush</a>
Sir_Cmpwn超过 8 年前
I helped out a lot with this codebase, it&#x27;s well on its way to becoming a production React SPA:<p><a href="https:&#x2F;&#x2F;github.com&#x2F;Linode&#x2F;manager" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;Linode&#x2F;manager</a>
Buetol超过 8 年前
Sentry is also a nice non-trivial one: <a href="https:&#x2F;&#x2F;github.com&#x2F;getsentry&#x2F;sentry&#x2F;search?l=JSX" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;getsentry&#x2F;sentry&#x2F;search?l=JSX</a>
shanedaugherty超过 8 年前
<a href="https:&#x2F;&#x2F;medium.mybridge.co&#x2F;22-amazing-open-source-react-projects-cb8230ec719f#.6syxev80e" rel="nofollow">https:&#x2F;&#x2F;medium.mybridge.co&#x2F;22-amazing-open-source-react-proj...</a>
cellis超过 8 年前
React Isomorphic Starter Kit: <a href="https:&#x2F;&#x2F;github.com&#x2F;RickWong&#x2F;react-isomorphic-starterkit" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;RickWong&#x2F;react-isomorphic-starterkit</a>
jiji262超过 8 年前
You can&#x27;t miss this one: <a href="https:&#x2F;&#x2F;github.com&#x2F;airbnb&#x2F;react-dates" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;airbnb&#x2F;react-dates</a><p>Provided by Airbnb.
nathantotten超过 8 年前
We have a bunch of open source react apps in <a href="https:&#x2F;&#x2F;github.com&#x2F;auth0-extensions" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;auth0-extensions</a>
crashdown超过 8 年前
I found this tutorial really really helpful: <a href="http:&#x2F;&#x2F;academy.plot.ly&#x2F;#react" rel="nofollow">http:&#x2F;&#x2F;academy.plot.ly&#x2F;#react</a>
Novex超过 8 年前
f8app - <a href="https:&#x2F;&#x2F;github.com&#x2F;fbsamples&#x2F;f8app" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;fbsamples&#x2F;f8app</a><p>React Native, but same idea. There&#x27;s also an excellent set of posts at <a href="http:&#x2F;&#x2F;makeitopen.com&#x2F;" rel="nofollow">http:&#x2F;&#x2F;makeitopen.com&#x2F;</a> which run through how it was built and why.<p>It&#x27;s responsible for a lot of my &#x27;aha&#x27; moments about Flow type-checking and Redux.
MicheleBertoli超过 8 年前
Check this out: <a href="https:&#x2F;&#x2F;github.com&#x2F;zeit&#x2F;hyper" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;zeit&#x2F;hyper</a>