React Integration

How to integrate Tueri.io into your React app

View on GitHub

Integrate Tueri.io into your React application in minutes.

Installation

npm i @tueri/react
or
yarn add @tueri/react

Import Tueri

Wrap your app with the <TueriProvider/>
import TueriProvider from '@tueri/react'

ReactDOM.render(
    <TueriProvider>
        <MyRootComponent />
    </TueriProvider>,
    document.getElementById('root)
)

Usage

Use the Tueri <Img/> component
import { Img } from '@tueri/react'

function MyComponent() {
    return(
        <Img src='https://cdn.tueri.io/...' alt='Alternate Text' />
    )
}
Tueri automatically detects the dimensions of the parent element, then generates and returns your image in exactly the right dimensions to fill the parent element.

The <Img /> component

Props

  • src: String (REQUIRED)
  • alt: String (REQUIRED)
  • options: Object (optional)
    • Default: w: <auto-calculated>