- React Native
- NativeBase v2.x
- React Navigation
- React Native Easy Grid
NativeBase is an open source framework from the team of StrapMobile. This framework enable developers to build high-quality mobile apps using React Native iOS and Android apps with a fusion of ES6. NativeBase builds a layer on top of React Native that provides you with basic set of components for mobile application development. The applications stack of components is built using native UI components and because of that, there are no compromises with the User Experience of the applications. NativeBase is targeted specially on the look and feel, and UI interplay of your app. NativeBase without a doubt fits in well with mobile applications which cut downs one huge part of your app - The Front end.
Quick links to NativeBase
- The state of whole application is stored in an object tree within a single store.
- The only way to mutate the state is to emit an action, an object describing what happened.
- To specify how the state tree is transformed by actions, you write pure reducers.
Navigators allow you to define your application's navigation structure. Navigators also render common elements such as headers and tab bars which you can configure.
- Stack Navigator
Renders one screen at a time and provides transitions between screens. Each new screen is put on the top of the stack and going back removes a screen from the top of the stack.
- Tab Navigator
Renders a tab bar with a TabRouter that lets the user switch between several screens
- Drawer Navigator
Provides a drawer that slides in from the left of the screen
React Native Easy Grid is an open source package for grid layout from the team of StrapMobile. The layout system is an essential concept that needs to be mastered in order to create great layouts and UIs. React Native uses Flexbox to create the layouts, which is great when we need to accommodate our components and views in different screen sizes or even different devices. Flexbox is awesome but it could be tiresome for newbies. Easy Grid Library, a wrapper of Flexbox. Easy Grid is very powerful and flexible layout system. No more worries about props of Flexbox such as alignItems, flexDirection, justifyContent, margin, padding, position, width etc. You can create any layout with all the available options that we have. Flexbox makes it look like percentages, however what actually is happening is just ratios. On the easier part, ratios are easier to represent than percentage/decimals. For this reason, the Easy Grid takes in ratios in place of percentage. Performance wise, Easy Grid is noteworthy and works as fine as Flexbox, not much of calculation. More Examples . . .