16 Opensource Reactjs Projects to Learn From

by on

ReactJS can be confusing for beginners when they have just finished with their tutorials on React and started using React in real life projects. Having multiple open source projects as reference can help them write better code.

If you are someone who is in your initial stage of learning React and you need some reference projects, you are at the right place. Open-source React projects can get you a better understanding of how everything works and helps you write better code. Here are some ReactJS applications for content management, task management, iTunes application, Google Maps etc. to showcase how ReactJS can be useful in different use-cases.

logo

1) Calypso

Calypso

Calypso is the new WordPress.com front-end – a beautiful redesign of the WordPress dashboard using a single-page web application, powered by the WordPress.com REST API. Calypso is built for reading, writing, and managing all of your WordPress sites in one place.

2) Sentry

Getsentry

Sentry provides real-time crash reporting for your web apps, mobile apps, and games. The Sentry package fundamentally is just a simple server and web UI. It will handle authenticating clients (such as Raven) and all of the logic behind storage and aggregation.

3) SoundRedux

SoundRedux

A Soundcloud client built with React / Redux.

4) Phoenix Trello

Pheonix trello

Phoenix Trello is a single-page application where existing users are will be able to sign in, create some boards, share them with other existing users and add lists and cards to them. While viewing a board, connected users will be displayed and any modification will be automatically reflected on every connected user's browser in real-time a la Trello style.

5) Kitematic

Kitematic

Kitematic is a simple application for managing Docker containers on Mac, Linux and Windows.

6) Google Map Clustering Example

Google Map Clustering Example

This is a clustering example for Google Map React with point clustering with smooth animations from react-motion.

7) Fil

Fil

A playground for in-browser interpreters, to do live coding in your browser with your favourite language. It currently supports Python, Ruby, Javascript, Brainfuck and happycalculator.

8) React iTunes Search

React iTunes Search

A simple web app for iTunes store search, built with React, ES6, Semantic UI, Webpack. Instead of searching and finding all your favorite items in the iTunes store application on you PC or laptop, you could do it on your browser.

9) Sprintly

Sprintly

Sprintly is an agile project management suite. It allows users to see tasks in each stage of the development process: Someday, Backlog, Current, Done, and Accepted.

10) Glimpse

Glimpse

Glimpse is an OSS diagnostics platform. It inspects web requests as they happen, providing insights and tooling that reduce debugging time and empower every developer to improve their web applications.

11) Grommet

Kitematic

Grommet is an advanced UX framework for enterprise apps developed by HP.

12) Dockunit

Dockunit

Dockunit.io is a containerized continuous integration service for testing software written in any language across any type of environment.

13) Retrospected

Retrospected

This is a Retrospective Idea board, powering retrospected.com.

14) Spectacle

Spectacle

Spectacle is a ReactJS-based presentation library with presenter mode, PDF export, themes, transitions, bg images. It shows you a slide lookahead, current time and your current slide:

15) Storyboard

Storyboard

Storyboard is a end-to-end, hierarchical, real-time, colorful logs and stories which is a library, plus a Chrome DevTools extension.

16) Gatsbyjs

Gatsbyjs

Transform plain text into dynamic blogs and websites using the latest web technologies. A React.js static site generator. It supports Markdown, HTML, and React.js pages out of the box. It makes it easy to add support for additional files types. Leverages React Router's "nested component hierarchy" to make templating incredibly intuitive. All templates, css, and content are hot reloadable — powered by Webpack.


Share the love

Published in javascript, web-development | Tagged with javascript, open-source, web-development, products

CATEGORIES
web-development
javascript
ruby-on-rails
ruby
tutorials
startups
products
events
devops
mobile

TAGS
web-development
javascript
ruby
frameworks
open-source
ruby-on-rails
tutorials
ruby-gems
programming
reactjs

MORE

RSS

X

Talk to us, that's always a good idea!