Awesome Open Source
Awesome Open Source
Sponsorship

React Projects

A couple of projects to get familiar with the React framework.

Giphy Giphy Giphy

Projects

  1. todo: Basic todo app to get started.
  2. tictactoe: A tic-tac-toe game uses states and props.
  3. markdown-editor: A real-time markdown editor SPA. (Live Demo)
  4. basic-react-redux: Basic react-redux project which handles articles in its store.
  5. basic-redux-thunk: Basic react-redux-thunk project which handles items from an API using thunk, uses redux for store.
  6. book-store [WIP]: Online book store built over react-redux and Bootstrap for UI.
  7. trip-mate: Manage and keep track of your trips with this simple, smooth webapp. Uses react-router, custom styling. (Live Demo)
  8. property-finder: Search for and list properties. Built on React-Native, uses react-navigation.
  9. todo-pwa: The classic Todos Tracker as a Progressive Web App. Built using React, Redux, leveraging styled-components, PaperCSS, Service Worker tools. Data is retained using localStorage (Live Demo)
  10. gatsbyjs-markdown-blog: GatsbyJS blog which fetches markdown blog posts, lists them and displays each post wrapped up as a static site. Based on the tutorials in the official docs, uses GraphQL, Typography.js, Remark plugin, Glamor.
  11. reddit-clone: react-redux-thunk project that calls the RedditAPI to fetch posts from selected subreddits. (Live Demo)

Development

Projects such as create-react-app, nwb and react-slingshot have been used to setup development envs.

Install all the required packages/dependencies using yarn

yarn

Serve the app to browser

yarn start

Tutorials/References

https://reactjs.org/tutorial/tutorial.html

https://egghead.io/courses/the-beginner-s-guide-to-reactjs

https://www.valentinog.com/blog/react-redux-tutorial-beginners/

https://medium.com/@stowball/a-dummys-guide-to-redux-and-thunk-in-react-d8904a7005d3

https://www.raywenderlich.com/178012/react-native-tutorial-building-android-apps-javascript

https://medium.com/@rajaraodv/step-by-step-guide-to-building-react-redux-apps-using-mocks-48ca0f47f9a

https://www.gatsbyjs.org/tutorial/part-four/

https://redux.js.org/advanced/example-reddit-api

Contributing

Feel free to open issues and pull requests!


Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (66,106
react (4,845
redux (1,106
react-router (195
jsx (143
projects (29

Find Open Source By Browsing 7,000 Topics Across 59 Categories