Was ist Realize for React?

Realize for React ist eine Chrome-Erweiterung, die von Realize for React entwickelt wurde, und ihr Hauptmerkmal ist "A React component tree visualizer".

Erweiterungsscreenshots

Realize for React-Erweiterungs-CRX-Datei herunterladen

Laden Sie Realize for React-Erweiterungsdateien im crx-Format herunter, installieren Sie Chrome-Erweiterungen manuell im Browser oder teilen Sie die crx-Dateien mit Freunden, um Chrome-Erweiterungen einfach zu installieren.

Anleitung zur Verwendung der Erweiterung

As React applications scale, it becomes more difficult to track state and to have a holistic overview of the component hierarchy. Realize is a tool to help developers visualize the structure and state flow of their React applications, especially when they are growing in scale and complexity. It currently supports React v.16.8.

Prerequisites
1. You must have React Dev Tools installed to use Realize for React. Install it from the Chrome store
2. Realize is best used on non-deployed applications. This uglification of deployed websites makes the component structure pretty unreadable.

How to use
1. Click the blue 'Add to Chrome' button
2. Once installed, navigate to your React website
3. Open the dev tools window and click on the Realize panel
4. Trigger a state change to populate the component tree

Functionality:
- Utilize the search bar to search for any component that exists in the tree.
- Clicking a node component will display information about state, children, props, and hooks in the right hand panel.
- You can zoom and pan the tree by holding shift and dragging/scrolling
- Click the 'State' button to view the flow of state through the component tree

Grundlegende Informationen zur Erweiterung

Name	Realize for React
ID	llondniabnmnappjekpflmgcikaiilmh
Offizielle URL	https://chromewebstore.google.com/detail/realize-for-react/llondniabnmnappjekpflmgcikaiilmh
Beschreibung	A React component tree visualizer
Dateigröße	160 KB
Installationsanzahl	5,086
Aktuelle Version	1.0.0.0
Letztes Update	2020-06-20
Veröffentlichungsdatum	2020-06-20
Bewertung	1.88/5 Insgesamt 8 Bewertungen
Entwickler	Realize for React
E-Mail	[email protected]
Zahlungsart	free
Erweiterungswebsite	http://www.realizeforreact.com
Hilfeseite URL	http://www.realizeforreact.com
Unterstützte Sprachen	en-US
manifest.json
{ "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx", "manifest_version": 2, "name": "Realize for React", "version": "1.0.0.0", "description": "A React component tree visualizer", "icons": { "16": "16.png", "32": "32.png", "48": "48.png", "128": "128.png" }, "permissions": [ "activeTab", "" ], "background": { "scripts": [ "background.js" ] }, "web_accessible_resources": [ "hook.js" ], "devtools_page": "devtools-root.html" }