When adding a new function with Amplify, it will create a new stack on CloudFormation. If your project or team becomes larger this could cause an issue because CloudFormation allows you to create 200 stacks maximum per AWS account.

As a workaround, we can deploy multiple functions from one resource. Another benefit of this approach is that we can share the same policies/executionRole if each function is in the same domain.

The figures below represent the output. As you can see, One single CloudFormation Stack( amplify-multiplefunction-dev) is generating two Lambda Functions( multiplefunction-functionOne, multiplefunction-functionTwo).

CloudFormation stack

Photo by GeoJango Maps on Unsplash

When you start using Amplify for your project, you will be surprised how much it will automate complicated development processes that lie along the way. However, when it comes to integrating push notifications, it’s not so helpful. Although Amplify uses Pinpoint as a default push notifications/analytics tool, there’s a very limited document regarding this topic.

In this article, I’m going to share a few tips and guides to implement Pinpoint as a push notifications tool so that you don’t run into trouble as I did.

Environment

  • RN 0.64.1
  • amplify
  • react-native-push-notification-ios 1.8.0
  • @aws-amplify/pushnotification”: “3.2.29”

Configuring Amplify for push notifications

When you set up push notifications, you also…


When you build an app that has a Camera functionality, you need to use a real device to go through the photo shooting process. However, sometimes you want to just use a simulator. There are few approaches you can take:

  1. Use Camera Library that supports iOS simulator like https://github.com/teslamotors/react-native-camera-kit
  2. Add Image Picker Library(e.g. https://github.com/react-native-image-picker/react-native-image-picker) and skip the photo shooting process
  3. Create a wrapper component and mock the Camera functionality

In this article, I’m going to explain the third approach. Here’s the video of how it will look.

Running on iOS simulator. We love cats, right?

I’m going to explain in this order:

  • Create a functional Component for Camera


Provisioned Concurrency is a feature that keeps Lambda function up and running. Although Amplify does not support this feature out of the box, we can automate generating Provisioned Concurrency by customizing a CloudFormation file. In this article, I’m sharing a few tips to address Amplify specific issues for Provisioned Concurrency. For example:

  • How to set up Provisioned Concurrency to Production environment?
  • How to run Povisioned Lambda function from Lambda Trigger or AppSync?

Now let’s have a look!

Basic CloudFormation Setup

Provisioned Concurrency requires two setups on CloudFormation file: Alias and Version. Provisioned Concurrency can only be set to Lambda function that has the…


Image by rawpixel.com

MockProvider is a recommended way of mocking requests and results of Apollo client. The sample code seems to be straightforward, but when it comes to real-world usage, you can hit some stumbling blocks. Although there is already a great article on medium about MockProvider usage tips, I still spent a couple of hours dealing with unexpected behaviors of MockProvier. In this article, I’ll go through some gotchas I found before mocking responses properly.

FYI here’s the environments I used in this article:

@apollo/client: 3.2.0
react-native:0.62.2
jest: 24.9.0
react-native-testing-library: 2.1.1

1. Import useQuery directly from hooks package

When you run your first test with MockProvider, you might get…


over 300 files update!

Recently I worked on migrating Apollo Client to 3.0 from 2.6 in our project. There are quite a few updates in Apollo 3.0 so I never underestimated the complexity of upgrading this library, but still, it took a few days to complete the task. Today I want to share about gotchas I encountered during this migration.

Infinite loop with useQuery, useLazyQuery and useMutation

In version 3.0, Apollo Client made major refactoring for a caching mechanism and request handling. It added significant performance improvements(in fact, it’s almost up to 76% with their benchmark) but at the same time, it caused some issues that did not occur before.

One…


Photo by FOX from Pexels

Recently, I worked on developing an Android app for my company’s product, which we have released an iOS app over a year ago. Since we are using React Native, a lot of code worked without making any change. However, there were still many parts, especially on the device-specific Native code, that needed to be taken care of to build & run the app properly.

In this article, I’m going to share what I worked on to port an Android App from an existing React Native iOS App.

Update libraries and Gradle settings to the latest

First of all, I had to start building the app without any error…


It’s been a while since I posted an article about how we take a photo using Camera2 API. Today I’m going to share the way to control the screen size of the preview.

First, let me go through the necessary steps to configure the preview screen. Then I will explain two camera app examples — the first one is a full-screen preview and the other one with the preview which fits the width of a screen.


Photo by rawpixel.com from Pexels

In the previous article, I explained how the preview and rendering work when the camera is launched with Camera2 API. Now we go to the next step, taking a photo.

Once again, here’s the sample project I made for this series of article. It’s forked from https://github.com/googlesamples/android-Camera2Basic

2 things you need to understand

There are 2 things you should know before we dive into the photo capture process.

(1) Capturing is all about the interaction between CaptureSession.capture() and CameraCaptureSession.CaptureCallback

To capture an image from the camera device, we have to request multiple Camera states — Lock Focus, wait for Auto Exposure and Flash, etc — against the camera device. We do that by calling captureSession.capture.

captureSession.capture


Photo by Markus Spiske temporausch.com from Pexels

Android development is becoming easy to jump in day by day. There are so many convenient development tools such as Jetpack. However, when it comes to Camera2, there’s still a big hurdle for new comers to understand the whole picture of how it works. Also I should note that even famous Android books or the official doc do not explain a lot about Camera2 API, especially how we should implement.

One reason why Camera2 confuses developers is that there are so many callbacks that we have to manage just to take one picture.
In this series of articles, I will…

Tomoaki Imai

CTO at Chomp, inc. Love to share ideas about React Native and GraphQL. https://twitter.com/tomoaki_imai (Japanese) https://github.com/tomoima525

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store