How to Create this React Library Myself?

Recreating libraries is one of my favorite things that I always want to do, especially challenging ones and there are so many points in learning how a tool is working under the hood.

TL;DR

I'm creating a simpler version of React libraries in this repo:
https://github.com/danialdezfouli/DYI-react-libs
Demo (Live Code):
https://codesandbox.io/s/github/danialdezfouli/DYI-react-libs

Should we create everything by ourselves?

The short answer is no; we use frameworks and libraries like react to simplify our jobs and solve hard problems like state management and DOM manipulation.

It's self-evident that typing npm i something is way easier than writing that package, and it saves our time. But should we do it for every simple job? it works, but meh

If we have a big problem in our code and that library solves it, let's use it, but if that library is unnecessary and can complicate the codebase or increase the bundle size, decrease the code readability or scalability, try to create it yourself.

Nevertheless, the whole point of this repo is learning more about javascript and react, and it's not about not using any specific library.

react-if

we will learn how to use React.Children in here.

an example of react-if:

<When something={happens}>Hello! :D</When>

react-query (Coming SOOON)

It's not ready yet, but till then, you can see react-grpc-query which I have created for helping to handle gRPC server side streaming with hooks and react-query api like:
https://github.com/apingtech/react-grpc-query

we will learn how to use observer pattern in JavaScript and see how to deal with its challenges.

Last words

This post is going to be updated (probably :D) and I will add react-query in the near future.

Please check out the repo in Github and star it if you liked the idea and feel free to contribute it.

24