{"id":26871300,"url":"https://github.com/codeadamca/arduino-to-nodejs","last_synced_at":"2025-07-14T18:33:32.422Z","repository":{"id":37946434,"uuid":"296498847","full_name":"codeadamca/arduino-to-nodejs","owner":"codeadamca","description":"Using JavaScript, Node.js, and an Arduino to communicate from an Arduino to the browser.","archived":false,"fork":false,"pushed_at":"2025-01-26T21:31:34.000Z","size":134,"stargazers_count":51,"open_issues_count":1,"forks_count":34,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-31T07:18:58.729Z","etag":null,"topics":["arduino","cplusplus","javascript","nodejs","socket-io"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/codeadamca.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2020-09-18T03:01:09.000Z","updated_at":"2025-03-12T12:01:52.000Z","dependencies_parsed_at":"2024-02-24T19:27:19.890Z","dependency_job_id":"36dadfb5-3a98-45e3-8ffd-a6045acb6738","html_url":"https://github.com/codeadamca/arduino-to-nodejs","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeadamca%2Farduino-to-nodejs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeadamca%2Farduino-to-nodejs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeadamca%2Farduino-to-nodejs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codeadamca%2Farduino-to-nodejs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/codeadamca","download_url":"https://codeload.github.com/codeadamca/arduino-to-nodejs/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247767239,"owners_count":20992548,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["arduino","cplusplus","javascript","nodejs","socket-io"],"created_at":"2025-03-31T07:19:03.378Z","updated_at":"2025-04-08T03:19:19.050Z","avatar_url":"https://github.com/codeadamca.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Communicating Between an Arduino and a Node.js Server\n\nThis tutorial will walkthrough the process of creating an Arduino IOT device that controls aspects fo a website. In this example the website will simpy display a red block that will fade when a dial on an Arduino is adjusted.\n\n## HTML and JavaScript\n\nCreate an HTML file called `index.html`. Add the following code:\n\n```javascript\n\u003c!doctype html\u003e\n\u003chtml\u003e\n  \u003chead\u003e\n\n    \u003cscript src='https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.4/socket.io.js'\u003e\u003c/script\u003e\n\n    \u003cscript\u003e\n\n    var socket = io();\n\n    socket.on('data', function(data) {\n        console.log(data);\n        document.getElementById('sample').style.opacity = data+\"%\";\n    });\n\n    \u003c/script\u003e\n\n    \u003cstyle\u003e\n\n      #sample {\n        background-color: red;\n        width: 300px;\n        height: 300px;\n      }\n\n    \u003c/style\u003e\n\n  \u003c/head\u003e\n  \u003cbody\u003e\n\n    \u003ch1\u003eCommunicating from an Arduino to Node.js\u003c/h1\u003e\n    \u003cdiv id=\"sample\"\u003e\u003c/div\u003e\n\n  \u003c/body\u003e\n\u003c/html\u003e\n```\n\nThe above code creates a webpage with a red square. Whn the dial is turned on the Arduino device, the red square will fade in and out.\n\n## Node.js Server\n\nBefore we setup the Node.js server we need to know the name of the serialport your Arduino is attached to. You can find the name of your serialport, it will look something like `/dev/tty.wchusbserialfa1410`. On a Mac using the Terminal and entering the following command:\n\n```\nls /dev/{tty,cu}.*\n```\n\nOn a PC you can use the command line and the following command:\n\n```\nchgport\n```\n\nOn my PC when I use the `chgport` command I get the following output:\n\n```\nAUX = \\DosDevices\\COM1\nCOM1 = \\Device\\Serial0\nCOM3 = \\Device\\Serial2\n```\n\nIn my Node.js I would use `COM3` as my serialport string.\n\nIf you're not sure which one is your Arduino, just disconnet your Arduino and execute the cpommand again and take note of which port is no longer on the list.\n\nOr you can find the name in [Arduino Create](https://create.arduino.cc/editor) in the drop down menu used to select your Arduino.\n\nCreate a file called `app.js` and add the following code:\n\n```javascript\nvar http = require(\"http\");\nvar fs = require(\"fs\");\nvar index = fs.readFileSync(\"index.html\");\n\nvar SerialPort = require(\"serialport\");\nconst parsers = SerialPort.parsers;\n\nconst parser = new parsers.Readline({\n  delimiter: \"\\r\\n\",\n});\n\nvar port = new SerialPort(\"/dev/tty.wchusbserialfa1410\", {\n  baudRate: 9600,\n  dataBits: 8,\n  parity: \"none\",\n  stopBits: 1,\n  flowControl: false,\n});\n\nport.pipe(parser);\n\nvar app = http.createServer(function (req, res) {\n  res.writeHead(200, {\"Content-Type\": \"text/html\"});\n  res.end(index);\n});\n\nvar io = require(\"socket.io\").listen(app);\n\nio.on(\"connection\", function (socket) {\n  console.log(\"Node is listening to port\");\n});\n\nparser.on(\"data\", function (data) {\n  console.log(\"Received data from port: \" + data);\n  io.emit(\"data\", data);\n});\n\napp.listen(3000);\n```\n\nThe above code listend for a message from the Arduino over the USD port and then passes a message onto the HTML/JavaScript using Socket.io.\n\n\u003e [!Note]\n\u003e Make sure to change the name of the serialport.\n\n## The Arduino\n\nUsing [Arduino Create](https://create.arduino.cc/editor) create the following sketch and upload it to your Arduino.\n\n```csharp\nint percent = 0;\nint prevPercent = 0;\n\nvoid setup() {\n  Serial.begin( 9600 );\n}\n\nvoid loop() {\n\n  percent = round(analogRead(0) / 1024.00 * 100);\n\n  if(percent != prevPercent) {\n    Serial.println(percent);\n    prevPercent = percent;\n  }\n\n  delay(100);\n\n}\n```\n\nThe previous code will generate a percentage pased on the dial and pass the number on to the Node.js server using the serialport.\n\n\u003e View the Arduino code on Arduino Create:  \n\u003e https://create.arduino.cc/editor/professoradam/da29d7ec-2df5-4528-82ce-817710aadb1a/preview\n\nYou will need to setup the following circuit using your Arduino:\n\n![Tinkercad Circuit](_readme/tinkercad-to-nodejs.png)\n\n\u003e View the Circuit on Tinkercad:  \n\u003e https://www.tinkercad.com/things/5Siec0jdhZo-arduinotobrowser\n\n## Launch Application\n\n1. Using [Arduino Create](https://create.arduino.cc/editor) upload the sketch to your Arduino.\n2. Using the Terminal start your Node.js app using `node app.js`.\n3. Open up a browser and enter the URL `http://localhost:3000/`.\n4. Turn the dial on the Arduino device and watch the red square in the browser.\n\n\u003e Full tutorial URL:  \n\u003e https://codeadam.ca/learning/arduino-to-nodejs.html\n\n---\n\n## Repo Resources\n\n- [Visual Studio Code](https://code.visualstudio.com/)\n- [Arduino Create](https://create.arduino.cc/editor)\n- [SerialPort NPM](https://www.npmjs.com/package/serialport)\n- [Socket.io](https://socket.io/)\n\n\u003cbr\u003e\n\u003ca href=\"https://codeadam.ca\"\u003e\n\u003cimg src=\"https://cdn.codeadam.ca/images@1.0.0/codeadam-logo-coloured-horizontal.png\" width=\"200\"\u003e\n\u003c/a\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodeadamca%2Farduino-to-nodejs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodeadamca%2Farduino-to-nodejs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodeadamca%2Farduino-to-nodejs/lists"}