react-hackclub-webring
v1.0.3
Published
react library for https://github.com/hackclub/webring
Downloads
6
Readme
react-hackclub-webring
react library for https://github.com/hackclub/webring that supports SSR
Install
npm install --save react-hackclub-webring
Usage
The library allows you to manage fetching the data when convenient by using fetchWebringData()
. example/
has an example of fetching it client-side; example-next/
has an example of fetching it when rendering on the server using NextJS's getServerSideProps
.
Code Example
import React from 'react'
import { HackClubWebring, fetchWebringData } from 'react-hackclub-webring'
import 'react-hackclub-webring/dist/index.css' // be sure to import the styles
const Example = () => {
const [webringData, setWebringData] = useState(null)
useEffect(() => {
;(async () => {
//
setWebringData(await fetchWebringData())
})()
}, [])
return <HackClubWebring webringData={webringData} domainName='example.com' />
}
Props
| Prop | Description | Default Value | Required | Notes |
| ----------- | --------------------------------------------------------------------------------------------- | ------------- | -------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| webringData | data from the fetchWebringData()
function | none | Yes | Allows your app to manage fetching when convenient (for SSR and stuff) |
| domainName | the domain name of your website as on the webring's home page | none | Yes | For those of us with multiple domains for our websites, it allows the webring to work correctly. Also because when SSR with NextJS, I don't think window.location.hostname
is available |
License
MIT © SConaway