DEV Community

Chandrasekar Kuppusamy
Chandrasekar Kuppusamy

Posted on • Originally published at Medium on

Creating Reusable UI for React Native using NativeBase

What is NativeBase?

NativeBase is a reusable UI component library which helps to create React Native UI component rapidly with ease. It enables component support for both iOS and Android natively.

For Example: ActionSheet UI in iOS and BottomSheet UI in Android without adding any extra dependencies.

It’s time to say goodbye to index.android.js and index.ios.js for creating UI with cross-platform support.

Reference : https://docs.nativebase.io/#Introduction

How to setup?

  1. Navigate to your root React Native project folder (i.e cd YOUR_PROJECT_NAME)
  2. Install NativeBase using npm install native-base --save command
  3. Connect your existing React Native project using react-native link command.

Boom! You’re good to go. Now you can use all the components and property of NativeBase in your project.

Customization?

Yes! There is an option for that too. Native Base is built on top of React Native and it provides variety of options using themes, styles, variables and components.

Run this command from terminal to view the Native Base theme folder

node node_modules/native-base/ejectTheme.js
Enter fullscreen mode Exit fullscreen mode

Now the native-base-theme folder is enabled on your project root. Play with all .js files to change color, background, font, size, text and other properties used in the Component.

Please refer official docs for the supported components with NativeBase here

AWS Security LIVE! Stream

Streaming live from AWS re:Inforce

Join AWS Security LIVE! at re:Inforce for real conversations with AWS Partners.

Learn More

Top comments (0)

ACI image

ACI.dev: Fully Open-source AI Agent Tool-Use Infra (Composio Alternative)

100% open-source tool-use platform (backend, dev portal, integration library, SDK/MCP) that connects your AI agents to 600+ tools with multi-tenant auth, granular permissions, and access through direct function calling or a unified MCP server.

Check out our GitHub!

AWS Security LIVE! From re:Inforce 2025

Tune into AWS Security LIVE! streaming live from the AWS re:Inforce expo floor in Philadelphia from 8:00AM ET-6:00PM ET.

Tune in to the full event

DEV is partnering to bring live events to the community. Join us or dismiss this billboard if you're not interested. ❤️