Skip to content

Commit aca29a8

Browse files
committed
Merge branch 'victor-dev' of https://github.com/victorvrv/react-rewind into victor-dev
2 parents ab548f0 + 9ccf640 commit aca29a8

File tree

8 files changed

+86
-0
lines changed

8 files changed

+86
-0
lines changed

LICENCE

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2019 React Rewind <reactrewindjs@gmail.com>
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

README.md

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
![alt text](./images/greygreen_gg_full_350w.png)
2+
3+
# React Rewind : A Time Travel Debugger for React
4+
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](https://github.com/reactrewind/react-rewind/pulls) [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)<br/>
5+
A time travel debugger for React's useReducer hook, designed to help engineers record and replay user sessions to fix bugs faster.
6+
Debug issues easier by “rewinding” your session instead of having to reproduce the issue until you find the bug.
7+
8+
- Press record and start interacting with your application
9+
- Each dispatched action will be stored as a unique “event” in time
10+
- Rewind through your recorded actions with back buttom
11+
- Press play to view your changing app state
12+
13+
14+
**React Rewind is in active development. Please follow this repo for contribution guidelines and our development road map.**
15+
## Getting Started
16+
17+
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.
18+
19+
### Prerequisites
20+
Your application must be using the hook useReducer for actions to be record.
21+
22+
### Installing
23+
React Rewind is available as a Chrome extension through the Google Chrome Web Store.
24+
On your application page open Chrome Developer tools and select React Rewind from the tool bar.
25+
Click `Record` and begin interacting with your application.
26+
27+
If you prefer to install locally, setup instructions are as follows:
28+
```
29+
git clone https://github.com/reactrewind/react-rewind.git
30+
cd reactrewind
31+
npm install
32+
npm run rewind
33+
```
34+
35+
Then head to [chrome://extensions/](chrome://extensions/)<br/>
36+
Click `Load Unpacked` button and upload the chrome folder, located at react-rewind/src/browser/chrome.<br/>
37+
On your application page open Chrome Developer tools and select React Rewind from the tool bar. <br/>
38+
Click `Record` and begin interacting with your application.
39+
40+
41+
As you interact with your application actions will populate in the events panel. These actions are clickable and will change the state of your page. The actions can be viewed in more detail in the right panel by inspecting the actions, effects, and state. The time slider panel allows you to rewind, fast forward,and play through all recorded actions.
42+
43+
### The UI
44+
|Property | Description |
45+
| ------------- | ------------- |
46+
| Events | Dispatched actions (three ways to view see below) <br/>Shows elapsed time since last dispatch |
47+
|Actions | Events action type and payload |
48+
|Effects | Difference between selected event and previous state |
49+
|State | Overall state of the application at the selected time |
50+
## Contributing
51+
52+
Please fork this repo. We welcome pull requests. For suggestions or to report bugs please log an issue.
53+
54+
## Versioning
55+
56+
We use [SemVer](http://semver.org/) for versioning. For the versions available, see the [tags on this repository](https://github.com/your/project/tags).
57+
58+
## Authors
59+
60+
[Brandon Murphy](https://github.com/murphybrandon) | [Victor Varaschin](https://github.com/victorvrv) | [Kia Colbert](https://github.com/kiacolbert) | [Gabor Mowiena](https://github.com/GaberMowiena)
61+
62+
## License
63+
64+
This project is licensed under the MIT License - see the [LICENSE.md](./LICENSE) file for details
65+

images/.gitkeep

Whitespace-only changes.

images/greygreen_gg_full.png

68 KB
Loading

images/greygreen_gg_full_350w.png

39.8 KB
Loading

images/greygreen_logo.png

60.1 KB
Loading

images/greygreen_logo_150w.png

18.3 KB
Loading

images/greygreen_text.png

16.5 KB
Loading

0 commit comments

Comments
 (0)