Developing Mobile Apps to Control Vinyl Fences and Enhance Security

Smart home technology now extends beyond interior spaces—mobile apps can also manage outdoor components like fences and gates. This post focuses on building a mobile application to control vinyl fences using real-time data, MQTT communication, and smart actuators. Why a Mobile App for Fencing? Controlling gates via mobile offers convenience and boosts security. Homeowners in areas like Chicago are increasingly adopting solutions such as Automatic Gates Chicago IL, enabling remote access control directly from smartphones. System Architecture Overview Frontend: React Native (cross-platform mobile development) Backend: Node.js + Express API IoT Messaging: MQTT broker (HiveMQ) Device: WiFi/Bluetooth-enabled actuator for gate movement Core Functionality Code Snippets React Native App – MQTT Communication import React, { useEffect } from 'react'; import { Button, View, Text } from 'react-native'; import init from 'react_native_mqtt'; import AsyncStorage from '@react-native-async-storage/async-storage'; init({ size: 10000, storageBackend: AsyncStorage, defaultExpires: 1000 * 3600 * 24, enableCache: true, reconnect: true, }); const client = new Paho.MQTT.Client('broker.hivemq.com', 8000, 'fenceAppClient'); const FenceApp = () => { useEffect(() => { client.connect({ onSuccess: () => console.log('Connected') }); }, []); const sendCommand = (cmd) => { client.send('home/fence/control', cmd); }; return ( Vinyl Fence Controller sendCommand('OPEN')} /> sendCommand('CLOSE')} /> ); }; export default FenceApp; Node.js Backend – Logging Commands const express = require('express'); const app = express(); app.use(express.json()); const logs = []; app.post('/log-command', (req, res) => { const { command, user } = req.body; logs.push({ timestamp: Date.now(), command, user }); res.sendStatus(200); }); app.get('/logs', (req, res) => { res.json(logs); }); app.listen(3000, () => console.log('API running on port 3000')); Device-Side Arduino Code (ESP8266 Example) #include #include const char* ssid = "YOUR_WIFI"; const char* password = "YOUR_PASS"; const char* mqtt_server = "broker.hivemq.com"; WiFiClient espClient; PubSubClient client(espClient); void callback(char* topic, byte* payload, unsigned int length) { String command = ""; for (int i = 0; i

import React, { useEffect } from 'react';
import { Button, View, Text } from 'react-native';
import init from 'react_native_mqtt';
import AsyncStorage from '@react-native-async-storage/async-storage';

init({
  size: 10000,
  storageBackend: AsyncStorage,
  defaultExpires: 1000 * 3600 * 24,
  enableCache: true,
  reconnect: true,
});

const client = new Paho.MQTT.Client('broker.hivemq.com', 8000, 'fenceAppClient');

const FenceApp = () => {
  useEffect(() => {
    client.connect({ onSuccess: () => console.log('Connected') });
  }, []);

  const sendCommand = (cmd) => {
    client.send('home/fence/control', cmd);
  };

  return (
    <View style={{ padding: 20 }}>
      <Text>Vinyl Fence Controller</Text>
      <Button title="Open Gate" onPress={() => sendCommand('OPEN')} />
      <Button title="Close Gate" onPress={() => sendCommand('CLOSE')} />
    </View>
  );
};

export default FenceApp;

const express = require('express');
const app = express();
app.use(express.json());

const logs = [];

app.post('/log-command', (req, res) => {
  const { command, user } = req.body;
  logs.push({ timestamp: Date.now(), command, user });
  res.sendStatus(200);
});

app.get('/logs', (req, res) => {
  res.json(logs);
});

app.listen(3000, () => console.log('API running on port 3000'));

#include 
#include 

const char* ssid = "YOUR_WIFI";
const char* password = "YOUR_PASS";
const char* mqtt_server = "broker.hivemq.com";

WiFiClient espClient;
PubSubClient client(espClient);

void callback(char* topic, byte* payload, unsigned int length) {
  String command = "";
  for (int i = 0; i < length; i++) command += (char)payload[i];
  if (command == "OPEN") digitalWrite(D1, HIGH);
  if (command == "CLOSE") digitalWrite(D1, LOW);
}

void setup() {
  pinMode(D1, OUTPUT);
  WiFi.begin(ssid, password);
  client.setServer(mqtt_server, 1883);
  client.setCallback(callback);
  while (!client.connected()) client.connect("FenceESPClient");
  client.subscribe("home/fence/control");
}

void loop() {
  client.loop();
}

Related Posts

May 7, 2025  0

Add Demo Blog using hashnodeApis

Apr 28, 2025  0

How to make your Tauri dev faster

May 2, 2025  0