Friday, 7 September, 2018 UTC
Summary
We all love seeing what other developers have done with the tools we use. Like many front-end developers, we continue to be thoroughly in love with React and build most of our software with it. Part 1 of this blog series covered 12 solid React projects to inspire your next project. We’ll now finish the series with 13 more!
I combed Github for 13 more great React open-source projects for you to learn from and be inspired by. I hope these inspire you to try new design patterns, new libraries, or simply just build new things.
Note: Mind the licenses! Some, but not all, are MIT-licensed.
My criteria, during my Github combing, was that they be somewhat interesting, have a functioning demo (with the exception of mobile apps), and be updated after mid 2017 (and preferably much later).
captbaritone/webamp (demo)
If you were online in the early 2000s, you probably used Winamp to listen to your Napster/Kazaa tracks. Here is a web app version of Winamp 2.9 that uses React, the web audio API, and many other libraries to recreate the player I used everyday when I was 11 (to listen to mostly crap).
djirdehh/react-living-app
This simple web app will give you cost-of-living comparisons (via Numbeo and Teleport API’s data) between common world cities. The simple, clean design uses bootstrap and react-select (for smooth input controls).
ismaelgt/english-accents-map (demo)
This simple/fun map lets you explore (and hear) different English accents. This progressive web app (PWA) is built using React, Redux, Firebase, Material-design-lite, and the English Accents Database (it exists!).
antoinejaussoin/retro-board (demo)
This Trello board clone was built using React, Socket-IO, Redux, and MongoDB. It supports several languages and appears to use local storage to save user settings. This project has many contributors and translators and appears to be extremely well-documented.
creativetimofficial/material-dashboard-react (demo)
Material-ui is, by far, the most popular ui-kit in use in the React world in 2018. This dashboard builds upon material-ui for a nice open source dashboard with many additional components. The author also offers ui-kits in other popular frameworks/libraries.
reduction-admin/react-reduction (demo)
No list like this would be complete without a Bootstrap based dashboard. This dashboard has a wide variety of pages and components, some of which use libraries like react d3 map and react-chartjs2. All in all, there’s a lot of great ui examples here that you can borrow or learn from.
clintonwoo/hackernews-react-graphql(demo)
This HackerNews demo looks exactly like the original HN and is powered by GraphQL and Universal React. This is a great demo to learn from if you’re considering diving in the ‘universal’ apps world.
fullstackreact/react-daily-ui (many demos in the repo)
Fullstack React offers many excellent tutorials and books on React. 30 Days of React is a free and incredibly comprehensive for learning React. This repo is a collection of many of the demos and code repos for their smaller tutorial series called react daily ui. As you might imagine, this tut series will show you the React way of building many common pieces of ui.
brtsai/food-help (demo)
This surprisingly full-featured Yelp clone deserves a lot more stars than it currently has (<10). This is a great example app for anyone looking to make a map based guide or review site using React.
SKempin/reactjs-tmdb-app (demo)
TMDb Movie Search is a responsive React app that utilizes Twitter’s typeahead.js and the Bloodhound suggestion engine, loading data via The Movie Database (TMDb) API. This would be great to checkout if you’re building a search interface.
srtucker22/chatty (mobile/no demo)
Chatty is a WhatsApp clone built with React and Apollo. This great open source project also features a free long tutorial to show you how it was built.
IceEnd/Yosoro (demo)
Yosoro is an elegant markdown-friendly note taking app build using React, Redux, and Electron. Notes taken in Yosoro can be synced to Microsoft’s OneDrive storage product. This project would be a great one to check out if you’re interested in making cross-platform desktop apps using React and Electron.
dabit3/heard (mobile/no dem0)
Heard is an enterprise React Native Social Messaging App built using AWS AppSync & AWS Amplify. AppSync is a newer AWS product for building mobile and offline apps using GraphQL. AppSync seems to be a competitor to using Firebase or a platform like Graphcool.
The Heard repo gives you a nice tutorial on how to setup the GraphQL schema properly within AppSync so you should be able to clone this app, setup a database and get started. This looks to be a great project for someone wanting to see how GraphQL (in a AWS PaaS context) works with React.
pusher/react-slack-clone (demo) [bonus #14)
This fully-featured React Slack Clone is built on the Pusher Chatkit (what seems to be a nicely designed PaaS). This demo is well componentized and simple (there’s only 7 dependencies in the package.json). This is a great project to check out if you need to include chat in your app but want some of the help that a PaaS product offers.
As with the first part of the series, I hope this projects inspire you, teach you, and get you building even more cool software with React.
The post 25 Public React Repos/Apps to Inspire Your Next Project (part 2) appeared first on appendTo.