https://github.com/ritwickdey/my-react-router

Minimal version of React Router | Just for learning purpose
https://github.com/ritwickdey/my-react-router

learning-purpose react-router react-router-dom

Last synced: 3 days ago
JSON representation

Minimal version of React Router | Just for learning purpose

• Host: GitHub
• URL: https://github.com/ritwickdey/my-react-router
• Owner: ritwickdey
• License: mit
• Created: 2020-08-04T15:35:46.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2023-01-05T23:13:41.000Z (almost 2 years ago)
• Last Synced: 2023-02-26T18:46:50.592Z (over 1 year ago)
• Topics: learning-purpose, react-router, react-router-dom
• Language: JavaScript
• Homepage:
• Size: 3.84 MB
• Stars: 11
• Watchers: 2
• Forks: 1
• Open Issues: 20
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
#### About

This is not `react-router-dom` (aka `react-router`) tutorial. It's a minimal version of `react-router-dom`.

If you're interested to know how `react-router-dom` is implemented, this repo will help you to understand how it actually works.

#### Syntax

```jsx

//Define Routes

import { BrowserRouter, Route, Redirect } from './lib/my-react-router';

  

  

  

  

;

```

```jsx

//Inside Component. `Link` and `props.history`

import { Link } from './lib/my-react-router';

function Home(props) {

  return (

    


       props.history.push('/login')}>

        Login Page via click

      

      Login page vai link

    

  );

}

```


#### Code

[src/lib/my-react-route.js](src/lib/my-react-router.js) _(less than 100 lines)_




> Note: This sample project does not handle all edge cases and of course it's not as comprehensive as `react-router-dom`. I always wonder how react-router actually works, that is why I was trying out how I can implement it. That's all about the repo.




`:wq!`