Arduino remotely controlled (part 3)

Introduction

In the previous post, we created a server to talk with an Arduino.

Now it's time to create a simple mobile application to interact with the server.

What are the problems I want to solve?

I don't want to interact with my Arduino using URLs. I want to interact with a nice (?) UI.

What is the solution?

Create an React Native + Expo application to connect and interact with the server.

Weak points

1. I'm not doing a very complex and fully working application. It's just a POC.
2. Ideally each interaction with the 'slider' should take some milliseconds before calling the server to avoid multiple callings
   1. Now I'm thinking of making a change into the Arduino library to make percent values change into steps to make it smooth.
3. I'm not storing/recovering the server IP into the application. I'm sure you can do it easily.

Intended public

I expect you to have some knowledge of: Typescript, React, React Native and Expo.

Let's start

Code

I created tag into the app repository, so you just have to download and read the code.

What is the code idea?

1. It waits for user input the server URL or IP
2. Tests the connection
3. Loads the server data
4. Shows the hubs components
   1. Waits for user interaction to send the value back to Arduino

Results

It's running in my old Android 7 smartphone. The screen is damaged and I had to do multiple touches to make the buttons work. I didn't want a long video, so I cropped some parts of it.

Previous steps

1. Create an Arduino library to remote communication
2. Connect the Arduino to a server

Last words

• This project is far from complete.
• It's NOT intended to be used in production as is.
• It needs lots of refactoring (that I intend to do, and I'll keep the tags for everyone who's reading this tutorial)
• Maybe someday, after all refactoring, I'll connect my Arduino to an solid state relay and do some 220V tests (children, don't try this)
• If you did try my code, please let me know if it worked, any problems you faced and how you got around those issues
• And last but not least, if you got this far, thank you for your patience