ReactPlay(Repo: react-play)

All Contributors

react-play

Learn . Create . Share about your ReactJS Development Journey

react-play licence react-play forks react-play stars react-play issues react-play pull-requests

View Demo Β· Report Bug Β· Request Feature

πŸ‘‹ Introducing ReactPlay

name

react-play is an open-source web app that helps you learn ReactJS faster with a hands-on practice model. It is a collection of ReactJS projects that you can use to learn ReactJS.

Is that all? Nope. You can also create your projects and share them with the world. The best part is that the ReactJS experts will review your project code before it gets part of the ReactPlay app. Isn’t that a pure WIN-WIN?

πŸ”₯ Demo

Here is the link to the app. We hope you enjoy it.

The ReactPlay app Link

Who doesn’t want motivation and support? Many Thanks to all the Stargazers who have supported this project with stars(⭐). You all are amazing!!!

Stargazers repo roster for @reactplay/react-play

Please support the work by giving the repository a ⭐, contributing to it, and/or sponsoring using the Sponsor button at the top 😍. You can also follow us on Twitter @reactplayio.

πŸ—οΈ How to Set up ReactPlay for Development?

You may want to set up the react-play repo for the following reasons:

  • You want to create a new play or want to edit an existing play as a contributor. Please check the Create a Play Guide for more details. Also, please check the Contribution Guide to get started.

  • You want to contribute to the react-play repo in general. Please check the Contribution Guide to get started.

Here is a quick overview of the react-play repo setup:

🍴 Fork and Clone the Repo

First, you need to fork the react-play repo. You can do this by clicking the Fork button on the top right corner of the repo. If you are new to forking, please watch this YouTube Guide to get started.

Once forked, you can clone the repo by clicking the Clone or Download button on the top right corner of the forked repo.

Please change the directory after cloning the repository using the cd <folder-name> command.

⬇️ Install Dependencies

Next, install the dependencies by running the following command in the react-play repo:

npm install

Or

yarn install

Note: ReactPlay runs on React 18. However, some of our dependencies are yet to upgrade to version 18. So please use the following command when you face difficulties installing the dependencies.

npm install --legacy-peer-deps

⛓️ Create a .env file at the root of your project folder with the following content,

REACT_APP_NHOST_BACKEND_URL=https://rgkjmwftqtbpayoyolwh.nhost.run/
REACT_APP_NHOST_VERSION=v1
REACT_APP_NHOST_ENDPOINT=graphql

πŸ¦„ Start the Development Mode

Use the following command to start the app in the development mode:

npm start

Or

yarn start

It runs the app in development mode. Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes. You may also see any lint errors in the console.

🧱 Build the App for Production

Use the following command to build the app for production:

npm run build

Or

yarn build

It builds the app for production to the build folder. It correctly bundles React in production mode and optimizes the build for the best performance. The build is minified and the filenames include the hashes.

πŸš€ Deploy

You can deploy the app to Vercel or Netlify with a single click.

🀝 Contributing to ReactPlay

Any kind of positive contribution is welcome! Please help us to grow by contributing to the project.

If you wish to contribute, you can,

  • Create a Play
  • Suggest a Feature
  • Test the app, and help it improve.
  • Improve the app, fix bugs, etc.
  • Improve documentation.
  • Create content about ReactPlay and share it with the world.

Please read CONTRIBUTING for details on our CODE OF CONDUCT, and the process for submitting pull requests to us.

Launching reactplay Rewards

Contributed to reactplay? Here is a big thank you from our community to you. Claim your badge and showcase them with pride. Let us inspire more folks !

reactplay Badges

Claim Now!

πŸ™ Support

We all need support and motivation. ReactPlay is not an exception. Please give this project a ⭐️ to encourage and show that you liked it. Don’t forget to leave a star ⭐️ before you move away.

If you found the app helpful, consider supporting us with a coffee.


A ⭐️ to ReactPlay is to make us more πŸ’ͺ stronger and motivated.

Contributors ✨

Thanks goes to these wonderful people (emoji key):

Tapas AdhikaryπŸ’» Nirmal KumarπŸ’» Murtuzaali SurtiπŸ’» Abhishek KhatriπŸ’» Abhishek HolaniπŸ’» Hasnain MakadaπŸ’» Shrilakshmi ShastryπŸ’»
Mohammed TahaπŸ’» Dalpat RathoreπŸ’» Eray AlkΔ±ΕŸπŸ’» Nirban ChakrabortyπŸ’» Deepak PundirπŸ’» Vasanti SutharπŸ“– Ahnaf AhamedπŸ’»
Shivam KatareπŸ’» Shyam MahantaπŸ’» KoustovπŸ’» Shri Om TrivediπŸ’» Naresh NaikπŸ’» Vincent PatocπŸ’» Sachin ChaurasiyaπŸ’»
Tejinder SharmaπŸ’» Ishrar GπŸ’» Programming-SchoolπŸ’» Valesh GopalπŸ’» Emdadul HaqueπŸ’» Olang DanielπŸ’» Supriya MπŸ’»
Saksham chandelπŸ’» Luca PizziniπŸ’» Shivam BhasinπŸ’» Tejas ShekarπŸ’» Anirban PratiharπŸ’»

This project follows the all-contributors specification. Contributions of any kind are welcome!

GitHub

View Github