https://github.com/fastcomments/fastcomments-react
A React component for FastComments
https://github.com/fastcomments/fastcomments-react
Last synced: 2 months ago
JSON representation
A React component for FastComments
- Host: GitHub
- URL: https://github.com/fastcomments/fastcomments-react
- Owner: FastComments
- License: mit
- Created: 2020-08-09T00:27:59.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2025-01-13T14:42:47.000Z (over 1 year ago)
- Last Synced: 2025-08-09T06:07:48.635Z (10 months ago)
- Language: TypeScript
- Size: 4.17 MB
- Stars: 8
- Watchers: 1
- Forks: 3
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
- awesome-react-components - fastcomments-react - [demo](<https://blog.fastcomments.com/(12-30-2019)-fastcomments-demo.html>) - FastComments component for embedding a live comment thread on a page or SPA. (UI Components / Miscellaneous)
- awesome-react-components - fastcomments-react - [demo](<https://blog.fastcomments.com/(12-30-2019)-fastcomments-demo.html>) - FastComments component for embedding a live comment thread on a page or SPA. (UI Components / Miscellaneous)
- fucking-awesome-react-components - fastcomments-react - [demo](<https://blog.fastcomments.com/(12-30-2019)-fastcomments-demo.html>) - FastComments component for embedding a live comment thread on a page or SPA. (UI Components / Miscellaneous)
- react-components - fastcomments-react
- awesome-react-components - fastcomments-react - [demo](<https://blog.fastcomments.com/(12-30-2019)-fastcomments-demo.html>) - FastComments component for embedding a live comment thread on a page or SPA. (UI Components / Miscellaneous)
README
# fastcomments-react
> A React library for FastComments, a fast and developer friendly comment system.
[](https://www.npmjs.com/package/fastcomments-react) [](https://standardjs.com)
## Installation
### NPM
```bash
npm install --save fastcomments-react
```
### Yarn
```bash
yarn add fastcomments-react
```
## Live Showcase
To see every widget and flow running locally against the public `demo` tenant, clone the repo and run:
```bash
cd examples/example-showcase
npm install
npm start
```
Each widget/flow has its own view under `examples/example-showcase/src/views/` that you can copy straight into your own React app.
## Examples
Individual use cases (dark mode, pagination, etc.) live in their own folders under `examples/`. Each can be set up with `npm install` and started with `npm start`.
## Usage
### The Main Widget Component
The FastCommentsCommentWidget component contains the live FastComments comment widget.
Replace "demo" below with your "tenantId" - available [here](https://fastcomments.com/auth/my-account/api) in the FastComments admin area.
The widget supports a lot of options - see FastCommentsCommentWidgetConfig in src/index.tsx.
```tsx
import React, { Component } from 'react'
import {FastCommentsCommentWidget} from 'fastcomments-react'
class Example extends Component {
render() {
return
}
}
```
### Updating The Current Page (For SPAs)
To update the page/article the comment thread is tied to you must update the configuration parameters "urlId" and "url".
See the example and explanation [here](https://github.com/FastComments/fastcomments-react/blob/master/examples/example-paginated/src/PaginatedApp.tsx).
### Account Region (ATTENTION: EU Customers)
If you're in the EU, you'll want to tell the client widgets what region you are in. See [examples/example-eu](/examples/example-eu/src/App.tsx);
Otherwise, you do not have to define `region`.
### The Comment Count Widget
The FastCommentsCommentCountWidget component contains the live FastComments comment count widget.
Replace "demo" below with your "tenantId" - available [here](https://fastcomments.com/auth/my-account/api) in the FastComments admin area.
See FastCommentsCommentCountConfig in src/index.tsx for the supported configuration options.
```tsx
import React, { Component } from 'react'
import {FastCommentsCommentCountWidget} from 'fastcomments-react'
class Example extends Component {
render() {
return
}
}
```
### Native
For a completely native implementation of FastComments, see [fastcomments-react-native-sdk](https://github.com/FastComments/fastcomments-react-native-sdk).
For a React Native wrapper of this library, using a webview, see [fastcomments-react-native](https://github.com/FastComments/fastcomments-react-native).
## Contributing
Please check out our [contribution guidelines](CONTRIBUTING.md) before starting on a change. Remember to communicate first!
## License
MIT © [winrid](https://github.com/winrid)
## Maintenance Status
These components are wrappers around our core VanillaJS components. We can automatically update these components (fix bugs, add features) without publishing this library, so while it may not be published for a while that does not mean FastComments is not under active development! Feel free to check [our blog](https://blog.fastcomments.com/) for updates. Breaking API changes or features will never be shipped to the underlying core library without a version bump in this library.