Add ReactJs usage instructions#12
Conversation
steren
left a comment
steren
left a comment
There was a problem hiding this comment.
Thanks a lot!
Actually, I realize that most of the instructions are not React specific:
- and 2. are just the regular setup
- and 4. are best practices to have the behavior differ between dev and prod, they would benefit anybody using webpack for example (with or without React)
README.md
Outdated
| //# sourceMappingURL=http://example.com/path/to/your/sourcemap.map | ||
| ``` | ||
|
|
||
| ## Setup for ReactJs |
There was a problem hiding this comment.
Nit: Use 'React' or 'ReactJS' (capital S)
README.md
Outdated
| }); | ||
| ``` | ||
|
|
||
| 3. If using webpack and the `DefinePlugin`, it is advisable to wrap the initialization logic to only occur in your production environment. Otherwise, with local development you will receive 403s if you restricted your API key to your production href(which is _HIGHLY_ recommended). The code for this would look something along these lines: |
There was a problem hiding this comment.
This advise applies for all framework. I would suggest to move it outside of the React instructions.
README.md
Outdated
| } | ||
| ``` | ||
|
|
||
| 4. If you would like to use the logger throughout your application, there are many options that exist within the React ecosystem. The simplest is to pull the initialization logic into its own file and reference it as necessary throughout your application. An example would be as follows: |
There was a problem hiding this comment.
Same here, this is not React specific. I suggest to do a dedicated section with point 3 and 4 about best practices for dev and prod environment.
README.md
Outdated
| </head> | ||
| ``` | ||
|
|
||
| 2. You can capture all exceptions with the following logic in your entry point, typically `index.js` with the following code: |
There was a problem hiding this comment.
- and 2. are not React specific, they are what is already described in the set up instructions. I'd suggest to just say that for React, users need to follow the regular setup instructions.
|
(Un)fortunately I have experience debugging sporadic, browser-specific errors in React applications. When recommending an approach for error logging in React please consider how async errors are handled. Support for error boundaries are being added, but other libraries (redux, react-router) need to be handled differently. If there is an easy way to listen for "async stacktraces" such as provided by the chrome console, please let me know :-) |
|
Very good feedback @steren , I'll send an update shortly. |
oshalygin
force-pushed
the
feature/add-reactjs-instructions
branch
2 times, most recently
from
47fbb2b to
81e872e
Compare
|
@steren take a look at the changes and let me know if you have any feedback. Thanks!! |
README.md
Outdated
|
|
||
| ## Best Practices | ||
|
|
||
| ### Usage with Webpack |
There was a problem hiding this comment.
I'd suggest to be more specific in this title. Something like 'Only report in prod environment with Webpack'
| ## Best Practices | ||
|
|
||
| ### Usage with Webpack | ||
|
|
There was a problem hiding this comment.
to your production href
What is 'href'? Use 'environment'?
- There are numerous options to how the library can be consumed and used within a ReactJs application and the examples/instructions given in the README.md are merely examples of how the stackdriver-error-js library can be instrumented within a ReactJs application. - Once the library is published to npm, the instructions to import the module will be updated accordingly. - Additition of a best practices section which helps guide users on how the library can be used in conjunction with Webpack and as a standalone modular utility. Addresses GoogleCloudPlatform#11
oshalygin
force-pushed
the
feature/add-reactjs-instructions
branch
from
81e872e to
7094673
Compare
|
@steren updated! Let me know what you think :) |
|
Thanks a lot for your contribution |
3 participants
CLA signed:
can be consumed and used within a ReactJs application
and the examples/instructions given in the README.md
are merely examples of how the stackdriver-error-js
library can be instrumented within a ReactJs
application.
to import the module will be updated accordingly.
Addresses #11