Skip to main content

Getting started

A collection of components designed to simplify app development. This library provides useful tools and ready-to-use solutions that speed up development, allowing you to focus on building great products.

Installation​

 npm install react-native-ui-devkit

Peer Dependencies​

Refer to the documentation for each package. Each package has its own installation instructions that should be followed to ensure a correct and smooth integration. Keep in mind that the individual installation guidelines for each package are essential for the success of the project.

 npm install react-native-gesture-handler react-native-device-info react-native-vector-icons react-native-sfsymbols react-native-haptic-feedback react-native-reanimated

From React Native 0.60 and higher, linking is automatic. So you don't need to run react-native link.

If you're on a Mac and developing for iOS, you need to install the pods (via Cocoapods) to complete the linking.

 cd ios && pod install

Provider​

The provider has to be imported and has to wrap its routes due to Native-style and light and dark modes.

import React from 'react';

// React Native UI DevKit
import { RNUIDevKitProvider } from 'react-native-ui-devkit'

const App = () => {
  return (
    <RNUIDevKitProvider theme={'auto'} backgroundColor={'both'}>

      { ... }

    </RNUIDevKitProvider>
  );
}

export default App;

Take a look at the RNUIDevKitProvider component section for more information.

Test​

 npx react-native run-android

Next steps​

Now that you have successfully installed the necessary dependencies and configured your development environment as per the provided instructions, you are ready to take the next step.