Skip to content

Latest commit

 

History

History
executable file
·
99 lines (67 loc) · 2.55 KB

File metadata and controls

executable file
·
99 lines (67 loc) · 2.55 KB

Introduction

This sample project covers:

  1. Setting up ImageKit React SDK
  2. Rendering images
  3. Setting authentication context for the SDK
  4. Applying common image manipulations
  5. Adding overlays to images
  6. Lazy loading images
  7. Blurred image placeholder
  8. Client-side file uploading

How to run locally

This project was bootstrapped with React Native CLI Quickstart. Head over to the link, choose your development OS and target OS and install its dependencies if not already done.

Install dependencies

npm install

Setup authentication

In app/config/Imagekit.js, set the following parameters for authentication:

const urlEndpoint = "<YOUR_IMAGEKIT_URL_ENDPOINT>";
const publicKey = "<YOUR_IMAGEKIT_PUBLIC_KEY>";
const authenticationEndpoint = "http://localhost:8080/auth";

Required parameters are urlEndpoint and publicKey. The authenticationEndpoint parameter is optional and only needed if you want to use the SDK for client-side file upload.

You can get the value of URL-endpoint from your ImageKit dashboard. API public key can be obtained from the developer section in your ImageKit dashboard.

Start Metro Server:

npx react-native start

Run the app in ios simulator (You need to have Xcode installed):

npx react-native run-ios

Run the app in android simulator (You need to have Android Studio installed):

npx react-native run-android

Setup dummy backend for upload

Move to the server directory

cd server

Create .env file by copying sample.env

cp sample.env .env

Set the following keys in .env

PRIVATE_KEY=private_XXXXXXXXXXXX

API private key can be obtained from the developer section in your ImageKit dashboard.

Please note that file upload will only work if, along with the above, you have also defined publicKey, urlEndpoint, and authenticationEndpoint variables in app/config/Imagekit.js.

Install packages:

npm install

Run the Node.js server

npm start

Node server will run at http://localhost:8080.

Useful links

Report a bug

If something doesn't work as expected, report a bug at support@imagekit.io.