Hello guys! I would like to introduce my latest choices for React Native iOS Development tools, playlist, service, testing, libraries and websites that I am currently using and learning on MacBook Pro 2015 and 2011.
Update: August 17 2017.
Tools
There are a few different development environments DECO and EXPO or you can use Nuclide by Atom. I use EXPO XDE right now. Don’t use DECO guys. Becuse After delete DECO from your machine, DECO still keeps 800MB. I don’t know why?
Snowflake , Pepperoni and Ignite are React Native starter kits for iOS.
f8App provides tutorials to help get started to use React Native.
React Developer Tools for Chrome Extension.
Playground for React Native Expo Sketch or Fil. If you need local playground, you can use React Native Storybook.
CodePush is another life saver. This tool is a cloud service that deploys mobile app updates directly to their users’ devices.
Npm desktop manager helps to add, remove, update global and local packages with ease.
Sentry is a cross-platform crash reporting and aggregation platform.
ESLint and Flow will help you for writing more quality and correct code.
DevTools for Redux helps with hot reloading, action replay and customizable UI.
Libraries
NativeBase is an essential cross-platform UI component for React Native. We can change the look of our application from one file instead of every component.
MobX is a state management library similar to Redux which is the current defacto state management library. However, MobX is as simple as possible.
A React Native Apple HealthKit is a bridge module for interacting with Apple HealthKit data.
Styled Component is a visual primitive for the component age.
React Color is a collection of Color Pickers from Sketch, Photoshop, Chrome, Github, Twitter, Material Design & more.
Native Navigation , React Native Router Flux or Vix react native navigation use for transition between pages.
Axios uses to Http Request.
Redux state management library – They are a power couple with React. Check out this awesome redux repo and playground ( redux works directly ) area.
Vector Icons provide buttons, logos,navbars and tab bars. Easy to extend, style and integrate into your project.
tcomb form native generate a form based on domain model.
React Native Elements is a solid option that offers everything you need UI Toolkit. But the question is why? Because you can build your own components.
Lottie renders Adobe After Effects animations in iOS app. The diffrence of Lottie loads the animation data in JSON format and renders the animation in real time. Check out free files.
Testing
Jest is a painless React Native testing library.
Jasmine is going to get all kinds of testing under the hood.
Backend
If you have React experience you can build your own back-end with mern.io. Mern is built on Mongo, Express, React and Node. But If you have Angular experience mean.io is better solution for you. If you have none of those experience, Meteor’s a good option for you.
Websites
You can find incredible ReactNative Examples here React.Rocks
React Native github page website .
Made with React is a collection of websites and applications using React Native.
Start React is a library of free to download React.js themes and templates.
ReactEx UI components from around the web, delivered to your inbox.
I share my favorite React Native web site.
Very good React Native Newsletter.
Facebook React Native page.
A guide and reference to help people get started with React Native –ReactNativeExpress.
Don’t catch this guy. This guy has spent building a whole bunch of applications that we know. For example Pokemon, Twitter, AirBnb, Tinder, WhatsApp, Snapchat.
Playlist
React Native Tutorial — Build Apps With React Native
Service
React Native wrapper for SegmentIO’s Analytics SDK.
React Native wrapper for Intercom.io is a messaging platform that helps create relation with consumers.
Testfairy , HockeyApp , Buddybuild, Applivery are beta testing tools for React Native. My favorite is Buddybuild.
Terms
- Components: Components are the composable building blocks to your react native application.
- JSX: JSX is a syntax for embedding XML within JS.
- Component Lifecycle: The lifecycle helps manage the complexity of different platform APIs
- Props: Props are way of passing data from parent to child
- State: State is how a component’s data looks at a given point in time
