My Development Toolset for React Native iOS Development

Durul Dalkanat
Mar 26, 2017 · 4 min read

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.

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? If you really work with real IDE, you can use PyCharm or Webstrom.

Snowflake , Pepperoni and Ignite are React Native starter kits for iOS.

f8App provides tutorials to help get started to use React Native.

Playground for React Native Expo. Also you can find amazing apps about Expo

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

Curated List of Open Source React Native Apps

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.

react native device info library is a device Information for React Native iOS and Android.

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.

Debugging

React Developer Tools for debugging tools to the Chrome Developer Tools.

react-devtools works both with React DOM and React Native for React page.

Reactotron allows us to have great insight into my Redux store state, actions, sagas, logs and more without having to have a browser tab open for debugging all the time.

Service

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.

Sentry is a error reports tool with a lot of useful device specific data and provides holistic reports with both native and JS stack traces.

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

Podcast

I want to add podcast section. Because I listened a lot of good podcast about ReactNative and they shared very good experience that help me.

One of them React Native Radio. please don’t catch to chapter 18.

That’s it. 😃😃😃 Thanks for reading. I hope all these toolkits will help you improve your productivity while developing React Native.

If you want to follow me in social media, here are some links. github, twitter, linkedin

You can check my previous articles here.

Durul Dalkanat

Written by

Health Research Program’s iOS Developer, currently lives in Washington, D.C http://www.about.me/durul

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade