https://github.com/bsv-blockchain/uhrp-react
UHRP-enabled React components for images, video, and audio
https://github.com/bsv-blockchain/uhrp-react
Last synced: 3 months ago
JSON representation
UHRP-enabled React components for images, video, and audio
- Host: GitHub
- URL: https://github.com/bsv-blockchain/uhrp-react
- Owner: bsv-blockchain
- Created: 2025-03-19T22:35:21.000Z (8 months ago)
- Default Branch: master
- Last Pushed: 2025-08-04T14:57:43.000Z (4 months ago)
- Last Synced: 2025-08-08T14:21:53.603Z (3 months ago)
- Language: TypeScript
- Size: 2.89 MB
- Stars: 0
- Watchers: 4
- Forks: 0
- Open Issues: 7
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# The `@bsv/uhrp-react` Package
UHRP-enabled React components for images, video, and audio.
# Background
The Universal Hash Resolution Protocol (UHRP) allows content to be addressed by its SHA256 hash, enabling efficient content storage and retrieval. This eliminates the need to store large media files directly on the blockchain, significantly reducing costs.
## Installation
```
npm i @bsv/uhrp-react
```
## Usage
In your React project:
```tsx
import React from 'react'
import { Img, Source } from '@bsv/uhrp-react'
const App = () => (
UHRP Media Showcase
Image Preview
Video Preview
Image with Loading State
Loading...}
/>
)
export default App
```
## Props
src (required) – The UHRP address of the media.
loading (optional) – A React element to display while the media is being resolved.
Any additional props will be passed directly to the rendered ![]()
or element for greater flexibility.
## How It Works
The uhrp-react library automatically resolves UHRP URLs to HTTP URLs using the UHRP Storage Server in the background. This provides seamless integration with your React application.
## Example
Check the [example directory of the repo](./example) for a simple React Scripts project utilizing these components.
## License
The license for the code in this repository is the Open BSV License.