So you want to learn React Native? Here’s 12 exercises to that will help you do that.
The post is inspired by a free self-paced workshop I’ve created. If you’re interested in guided instructions, solutions, and extra exercises check it out!
The classic starter project. Render a square with a background color. Inside of the square render the text “Hello, world”.
An app isn’t much if a user can’t interact with it. The most basic form of interaction is capturing a user’s tap (or press) on a screen. …
v0.59 of React Native is a big deal. It…
With that, I wanted to spend some time walking through how to upgrade (it’s easy!), how to upgrade in the future, and handling changes.
This post was originally published at React Native School. If you’re interested in learning more about React Native be sure to visit! New articles weekly!
React Native is putting its foot down on what the proper way to upgrade React Native is and I’m happy to see the community unifying around one solution. …
This tutorial was originally published on React Native School. Give it a visit if you want to see 75+ React Native tutorials!
I’ve got a pet peeve — when apps ask for feedback/a review at bad times/in bad ways:
Thanks to Instabug for sponsoring this lesson! If you’re looking for an all-in-one solution to capture user feedback, bug reports, crash reports, and more check them out! …
Crashes are going to happen. We can try to minimize them but they’ll still happen. When they happen in production what can we do about them? In this tutorial we’ll learn how to detect crashes in React Native and what to do about them.
In this lesson we learn how to handle errors in production. I would suggest checking out
react-native-exception-handler as a way to get started with capture errors in all runtimes of React Native.
If you’re ready to go one step further I highly suggest taking a look at Instabug. Instabug provides a platform and tooling to capture and analyze errors in your React Native app, in addition to other things (like capturing user feedback). …
Note: At the time of recording/writing React Native 0.59 is in RC status. As such, to try it out you’ll need to specify your React Native version
react-native init MyProject --version react-native@next
Second Note: Hooks are new and I’m new to them too. I may have misspoken multiple times through the video — my apologies! I’m learning them too ;)
This post was originally published on React Native School. For the most up to date article & resources please visit me there! …
This month at React Native School is all about debugging your React Native apps!
I’ve just released a new 12 lesson class to help you debug your app, whether the bug is happening in development or production.
I’m also happy to say that this course is 100% free forever! Thanks to Instabug for making this possible.
Instabug provides tooling for you to capture in-app feedback, bug reports, crash reports, and error reporting! It’s been a great tool to work with and provides some immensely valuable insights into your production applications.
In the class we’ll actually look into using Instabug to handle some of our production debugging needs. …
It can be pretty easy to write code — but how do you organize it?
I’ve worked with dozens of developers working with React Native and have seen a variety of ways of organizing code. From putting everything into one file to files that have less than 10 lines on average.
In this tutorial I want to give you a balanced approach. A way to organize your code so it’s easy to work with and maintain but not a burden to manage/stick to.
We’re just covering the UI components in this tutorial but I want to give an overall look at how my React Native projects are typically structured. …
Images add another dimension to a mobile app. User-generated images amplify that.
If you’re building a React Native app, how do you give your users the ability to upload images? React Native has polyfills for many web APIs — to do image uploading we’ll be using the
Before we can actually start uploading images, we’ll to create two projects:
Note: This tutorial assumes you already have React Native installed on your machine.
We‘ll be doing a few things here:
Internet connection speeds are variable, especially when you’re working with mobile devices. As developers we often forget that many of our users are running our apps on less powerful devices and with slower internet connections than we are. Go out into the mountains and try to access your app and see how it performs.
One of the more expensive things in an app is the remote images you’re loading. They’re going to take time to load, especially if they’re large images.
Today we’ll build a component that allows us to:
When you like a picture on Instagram a heart quickly scales and fades in over the image you liked — how would we go about accomplishing the same in React Native? In this quick tutorial we’ll cover exactly that.
This tutorial builds on top of a previous tutorial in which we implement a double tap component.
To get started, create a new project with Create React Native App.
Next, download the following zip file, unzip it, and place it in your new React Native project. Make sure to name the directory