Example Todo app built with Monja.js.
Implementing my own version of React.
This project aims to build a simplified version of the React framework. Particularly, its reconciliation algorithm and the Fiber architecture.
- Functional components.
- JSX support.
useState
hook.useEffect
hook.- Reconciliation by key.
- Style prop as object.
With npm:
npm install monja
With yarn:
yarn add monja
import Monja from "monja";
function App() {
return <h1>Monja.js</h1>;
}
const container = document.getElementById("root");
Monja.render(<App />, container);
-
Clone the project
$ git clone https://github.com/gustavomonjardim/monja.git
-
Install the dependencies:
$ yarn
-
Run the project on watch mode
$ yarn start
-
Build the package
yarn build
yarn start:example
This project is bundled with rollup.
- Build your own React - A Step by step tutorial teaching you how to build your own version of react.
- React as a UI Runtime - A deep dive into React by Dan Abramov.
- Inside Fiber: in-depth overview of the new reconciliation algorithm in React - A deep dive into React`s reconciliation algorithm by Max Koretskyi.
- React Fiber Architecture - An introduction to React Fiber by Andrew Clark.
- A Cartoon Intro to Fiber - A talk about React Fiber by Lin Clark at React Conf 2017.
- Add static typing with Typescript
Licensed under the MIT License.