This project is about managing hardware devices like sensors, LED and fan and setting up contexts using Web App and Mobile App. It is similar to a simple Smart Home System. As the system's name (Luminetix), it helps user control devices manually in the network, and have a glance at what is going on in the system, including the status of devices, statistics. Especially, this system allows users to set up contexts based on the valued measured by sensors, and automatically triggers LED or Fan and some activities like sending an email to users when the contexts happen, and create notifications when any devices are turned on or off, and when contexts are triggered. They can also make a schedule for context.
- Le Van Vy
- Huynh Ngoc Nhu
- Nguyen Tri Hieu
- Nguyen Ngoc Tri
- Web App: ReactJS, Tailwind CSS, NodeJS, MongoDB, ExpressJS
- Mobile App: React Native, Tailwind CSS, NodeJS, MongoDB, ExpressJS
- Gateway: Python
- Yolo:Bit & AI program: "Drag & Drop" programming is supported on
app.ohstem.vn
- Both apps use MQTT to get real time data from server Adafruit, which collects data from gateway, without frequently call API to get data, which may cause Error 429 and heavy network traffic.
- Before running this project, you must setup all nececessary feeds in Adafruit IO Server; get APIs feed and get API key and fill them in codes so that programs can call APIs method to run.
- Clone this repo
- Connect hardware devices according to the connection diagram presented in the "Node Implementation" in the report. Connect Yolo:Bit to the computer using the USB port.
- Go to
www.app.ohstem.vn
website, in "Lap trinh Yolo:Bit" section, import projectyolobit.json
which is in the folderYolobit
. Identify and select the USB Serial port before downloading the program to Yolo:Bit. - Also on the Ohstem website, but in "Lap trinh AI" section, import project
AI.json
which is in the folderYolobit
. Identify and select the Bluetooth port for which Yolo:Bit is connected before running the program. - Go to folder
Gateway
and run the programGateway.py
on your PC or Laptop. The program runs successfully when showing on the termial 2 lines: "Connected to Adafruit IO!", "Ket noi thanh cong" and some lines "Subcribe thanh cong" corresponding to the number of connected feeds. - Run this in terminal:
npm install
in the parent folder, and in mobile and frontend folder to install all dependencies. - Paste 3 files .env given by team to parent, frontend and mobile folder.
- Install, config MQTT in frontend and mobile folder:
- run
npm i mqtt
- go to
node_modules/mqtt
and create a file namedwebpack.config.js
with content below:
const webpack = require('webpack') module.exports = { entry: "./lib/connect/index.js", //mode: "development", output: { library: { type: "commonjs2" }, filename: "mqtt.browser.js" }, plugins: [ // fix "process is not defined" error: // (do "npm install process" before running the build) new webpack.ProvidePlugin({ process: 'process/browser', }), new webpack.ProvidePlugin({ Buffer: [ 'buffer', 'Buffer' ], }), ], resolve: { fallback: { assert: require.resolve('assert'), buffer: require.resolve('buffer'), console: require.resolve('console-browserify'), constants: require.resolve('constants-browserify'), crypto: require.resolve('crypto-browserify'), domain: require.resolve('domain-browser'), events: require.resolve('events'), http: require.resolve('stream-http'), https: require.resolve('https-browserify'), os: require.resolve('os-browserify/browser'), path: require.resolve('path-browserify'), punycode: require.resolve('punycode'), process: require.resolve('process/browser'), querystring: require.resolve('querystring-es3'), stream: require.resolve('stream-browserify'), string_decoder: require.resolve('string_decoder'), sys: require.resolve('util'), timers: require.resolve('timers-browserify'), tty: require.resolve('tty-browserify'), url: require.resolve('url'), util: require.resolve('util'), vm: require.resolve('vm-browserify'), zlib: require.resolve('browserify-zlib'), } } }
- Inside of
node_modules/mqtt/package.json
:
- add
"type": "common.js"
- in
"browser"
, change from"./mqtt.js": "./lib/connect/index.js"
to"./mqtt.js": "./dist/mqtt.browser.js"
like this below:
{ ... "type": "commonjs", "browser": { "./mqtt.js": "./dist/mqtt.browser.js" ... } ... }
- Inside of
node_modules/mqtt
execute respectively (ignore any errors happen):
npm i npm i buffer process npm i webpack webpack-cli npx webpack
- Clean folder
.cache
in foldernode_modules
offrontend
andmobile
folder (notnode_modules
in foldernode_modules/mqtt
. Suggest using Windows Explorer and clickView hidden folders
to find and delete. If there is not any folder like this, can skip this step.
- run
- Move out to the folder
frontend
ormobile
, build app:- With Web App: run
npm start
. Done! - With Mobile App: First, you have to install Node, JDK and Android Studio. For this setup, you can refer to this link (sponsored by ReactNative): https://reactnative.dev/docs/environment-setup?guide=native. Read carefully and follow all stages, except for
Running your React Native application
stage. Secondly, runnpx expo start
in terminal from directory/mobile
, then typea
to open Android Emulator you have installed recently. It may require you to install app Expo Go on that device, just do it. After that, you can build your app on Expo Go "on" Android Emulator. Last but not least, you notice that right below the QR code from Expo in terminal when you executenpx expo start
, there is an URL, which contains an IP Address. Copy that ipaddress and paste it in .env, assign it toIPADDRESS
variable. You can restart the app to run it successfully.
- With Web App: run