Re-React

A minimal React clone created just for fun
Explore the docs »

· Report Bug · Request Feature

Table of Contents

1. About The Project
   • Built With
2. Getting Started
3. Contributing
4. License
5. Contact

About The Project

Re-React is a minimal React clone created just for fun and to better understand how the framework works. This project has been inspired by Build Your Own React work by Rodrigo Pombo, but includes some additional features and is developed using TypeScript.

Re-React was developed as part of an in-depth study of React's logic, for personal educational purposes in order to have a deeper understanding of how the framework works under the hood, and not intended as a library for daily use.

The main features of Re-React include:

• Reconciliation: Based on the fiber tree data structure, after any update from the UI only the actual changes are passed to the renderer.
• Interruptible Rendering: The work is split into little chunks of works, so that the rendering can be interrupted if the browser needs to do high priority stuff like handling user input or keeping an animation smooth
• Function Component: Just like in React, it is possible to define custom components in the form of a JavaScript function.
• Hook: Currently, the following hooks have been implemented:
  • useState
  • useEffect

The additional features (not implemented in the inspiring project) are:

• Handling of array of children
• Conditional rendering using false value
• State update for the useState hook using an object
• Implementation of the useEffect hook

(back to top)

Built With

• 
• 

(back to top)

Getting Started

1. Clone the repository

   HTTPS:

   git clone https://github.com/davidgarra/re-react.git

   SSH:

   git clone [email protected]:davidgarra/re-react.git

2. Install dependencies using yarn

   cd re-react
   yarn

3. Run the application

   yarn start

(back to top)

See the open issues for a full list of proposed features (and known issues).

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

(back to top)

License

Distributed under the MIT License. See LICENSE.txt for more information.

(back to top)

Contact

David Garra - Linkedin - [email protected]

Project Link: https://github.com/davidgarra/re-react

(back to top)