Getting Started | NativeBase | Universal Components for React and React Native
IMPORTANT MESSAGE
Upgrade to gluestack-ui
If you are starting a new project with NativeBase, we recommend using gluestack-ui
Please opt in to our enterprise plan (coming soon) for priority support with NativeBase.
Migrate to gluestack-ui
If you are working on a project with NativeBase, we recommend using @gluestack-ui/themed
NativeBase
3.4.x
Light mode active 🚨
Do you really want to stay here? Really? Really? Pakka? Sure? Are you a true developer?
No
Back to DarkMode
Resources
Disclosure
If you are starting a new project, please try gluestack-ui for better performance and new design.
Getting Started
NativeBase is a component library that enables devs to build universal design systems. It is built on top of React Native, allowing you to develop apps for Android, iOS and the Web.
Info: If you are starting a new project, please try gluestack-ui for better performance and new design.
A Brief History of NativeBase
NativeBase v1.x : NativeBase started out as an open source framework that enabled developers to build high-quality mobile apps using React Native. The first version included UITabBar on iOS and Drawer on Android. NativeBase v1 was very well-received by the dev community.
NativeBase v2.x : The second version was released with new components, preset themes, unified icons & more. The main focus of v2 was to make components easy to theme with very few modifications. From v2.4.1 onwards, NativeBase also included support for the web.
NativeBase v3.x : We wanted to make NativeBase the go-to component library for anyone building with React Native and Web. This version is accessible, highly customizable and consistent across android, iOS & web. That's not all though, read on for the full benefits of using v3.
gluestack-ui : With the introduction of gluestack-ui, we aim to address the performance and maintainability issues of NativeBase v3. By splitting the library into three parts and focusing on a universal, headless, and independent set of components, gluestack-ui now offers better performance and easier maintenance.
Idea behind NativeBase
We had clear goals in mind while building version 3. Take a look at some of the new features we added:
Multiplatform : NativeBase supports multiple platforms; android, iOS and web. You can also customise properties using platform-specific props.
Inherently Beautiful : NativeBase ships with a default theme that provides beautiful components, out of the box.
Accessible : This version has out of the box accessibility including focus management, keyboard navigation and more.
Customisable : The default theme can be extended as you desire. You can also customise specific components for your app needs.
What’s new with gluestack-ui?
Improved Performance: gluestack-ui helps in enhancing the performance of NativeBase by offering a universal and performant styling library, dank.style, which is highly optimized with a babel-plugin.
Headless and Independent Components: gluestack-ui provides a set of headless and independent components, similar to radix-ui, that can be styled in the user’s project as needed.
Easier Maintenance: By simplifying the styling engine and component library, gluestack-ui makes it easier to maintain and contribute to the library.
Universal Support: gluestack-ui is designed to be compatible with React and React Native, covering platforms such as Next.js and Expo.
Future-proof: With the backing of GeekyAnts and its long-term support commitment, you can trust that gluestack-ui will continue to evolve and receive updates to stay compatible with the latest versions of React and React Native.
MadeWithNativeBase
gluestack-ui