Using Arduino with Node-RED to create a Simple Web Dashboard

แชร์
ฝัง
  • เผยแพร่เมื่อ 31 พ.ค. 2024
  • This is an introductory video that attempts to demonstrate a very simple example of how to connect an Arduino UNO to Node-RED, using a serial connection via USB cable (i.e. exactly the same way you would normally upload a new sketch to your Arduino board).
    The Arduino can write data, such as the readings of any sensors, to the serial connection using the Serial.print command. Instead of simply showing this data on the Arduino IDE Serial Monitor, this data can be received by the Node-RED server running on a PC which can then trigger a whole range of other hardware, evaluate complex logic, or display the current state of the device in a browser-based graphical dashboard. This makes it ideal for controlling and monitoring Arduino-based props in an escape room, for example.
    Node-RED is free, open-source software that can be downloaded from nodered.org/
    In this tutorial, I'll just create a very simple webpage containing one text node, whose value changes between 0 and 1 depending on whether a Reed switch attached to the Arduino detects a magnet or not. In future videos, I'll extend this example to more complex cases of sending multiple sensor values, how to send data from Node-RED to Arduino, and alternative connection methods such as MQTT. For an example of other ways in which Node-RED can be used in Escape Rooms, check out:
    - • Create your own Escape...
    - • DMX Lighting Control w...
    Timings
    ---
    00:00-01:29 Introduction and hardware explanation
    01:30-05:45 Arduino Code
    05:46-07:10 Demonstration output using Arduino IDE serial monitor
    07:11-12:05 Creating the Node-RED flow
    12:06-12:52 Wrapup
    This video was made possible due to the generous support of my amazing patrons: / playfultech
  • วิทยาศาสตร์และเทคโนโลยี

ความคิดเห็น • 90

  • @diyvideojunk2066
    @diyvideojunk2066 6 หลายเดือนก่อน +2

    This is the first Node Red video that I have found that actually shows a beginner how it works and also explains how this is a practical starting point for further learning. Thank you so much for this, really appreciated.

    • @PlayfulTechnology
      @PlayfulTechnology  6 หลายเดือนก่อน

      Aw, thanks for the comment, that's really nice to hear!

  • @pythonexplorer5512
    @pythonexplorer5512 3 ปีที่แล้ว +2

    You so beautifully and precisely showed how a physical sensor (the reed switch) can be monitored on a web page using Node Red. Many other tutorials on YT simply drone on endlessly about nodes and message payloads but that doesn't help beginners to actually understand how Node Red can integrate with the physical world. Keep up your great work.

  • @mikehardy7060
    @mikehardy7060 2 ปีที่แล้ว +2

    Excellent, thank you. Really straightforward, clear, concise and easy to follow for a beginner. Now subscribed

  • @stez7199
    @stez7199 4 ปีที่แล้ว +1

    Excellent videos and exactly what I've been looking for! I am eagerly awaiting the Node-Red w/ MQTT tutorial. Thanks for your great work!

    • @ibrarahmad6716
      @ibrarahmad6716 3 ปีที่แล้ว

      a very good explanation is here
      funprojects.blog/2018/03/04/arduino-talking-mqtt-to-node-red/

    • @ShreySharma
      @ShreySharma 3 ปีที่แล้ว

      Hey buddy you can get the complete tutorial here -th-cam.com/video/rlxCE5ZedXM/w-d-xo.html

  • @riasaheta8960
    @riasaheta8960 ปีที่แล้ว

    thank you, this was extremely helpful. i finally have a dashboard to put live sensor data on!

  • @Mattequation
    @Mattequation 3 ปีที่แล้ว

    Very informative and simple, Love it, Thank you!

  • @wadebrewer7212
    @wadebrewer7212 2 หลายเดือนก่อน

    Thank you. All the learning out there assumes a lot on the learners part of either knowing C++ OR node red....i understand neither bt want to get started.
    The community really needs to figure that part out. If people want to learn but know nothing...there is little tget them started. Stuff like your tutorial here is REALLY needed. Explain it all amd assume the learner knows nothing. If people are advanced....skip through the video.

  • @connermerrill7008
    @connermerrill7008 ปีที่แล้ว

    you rock dude. Helped me out a lot with my IoT assignment. Much love

  • @Edappl
    @Edappl 2 ปีที่แล้ว

    This is the best simple tutorial ever!!

  • @ImperialLightandMagic
    @ImperialLightandMagic 3 ปีที่แล้ว

    Hi Alistair, hope it's ok to ask a Node Red newb question. Can it manage video files? What I want to do is trigger a video to play based on an arduino pin reading, and this would be perfect if it's supported in Node Red.

  • @SriRam-dv6mb
    @SriRam-dv6mb 4 ปีที่แล้ว

    GREAT WORK....♥️ from INDIA

  • @saurabhtalele1537
    @saurabhtalele1537 4 ปีที่แล้ว +2

    Sir,U r explanation is just great make video more please😫🙏🙏💓

  • @stenlan8932
    @stenlan8932 4 ปีที่แล้ว +3

    Thanks a lot, exactly what I needed!

  • @M0nty16
    @M0nty16 4 ปีที่แล้ว +1

    Thanks! Great explanation!!

  • @phildonaldson5770
    @phildonaldson5770 3 ปีที่แล้ว

    Big thumbs up! Excellent video

  • @siddharthrs7067
    @siddharthrs7067 2 ปีที่แล้ว

    Amazing video ! .. using this concept for a hackathon :)

  • @ivandavidcarmona8384
    @ivandavidcarmona8384 ปีที่แล้ว

    Muchisimas gracias por compartir. Fue demasiado útil y muy facil de entender tu explicación.

  • @antoniogarridobueno2210
    @antoniogarridobueno2210 ปีที่แล้ว

    You have helped me a lot, thanks :)

  • @SuperAsmit
    @SuperAsmit 3 ปีที่แล้ว

    Hello.! Thanks for the awesome video, but can we use Arduino In node to get input, rather than serial in ??

  • @dmasb
    @dmasb 3 ปีที่แล้ว

    Excellent video! Thanks

  • @baseladams280
    @baseladams280 3 ปีที่แล้ว +1

    Thanks a lot for your great videos!
    I have a very basic question. I have created a Node Red Dashboard on my Raspberry Pi. I connect my Raspberry to Internet using Huawei 4G to wifi router.
    I would like to acces to my Node red Dashboard from any pc in the world over Internet. Do you have any suggestion how to do this?
    Thanks a lot a again!

  • @goldrickfalko8935
    @goldrickfalko8935 4 ปีที่แล้ว +2

    Great video again, well done.
    I hope you will show some wireless examples with MQTT and node red :-)

    • @720xt
      @720xt 4 ปีที่แล้ว +1

      The best i could recomend you, is to use the Node-MCU + TASMOTA firmware on it.
      Then install mosquitto server on the machine which is running Node-RED, and then you will be able to talk to the MCU from Node-RED via MQTT. Its really easy.

    • @goldrickfalko8935
      @goldrickfalko8935 4 ปีที่แล้ว

      @@720xt thanks a lot :-)

  • @jachencarl
    @jachencarl ปีที่แล้ว

    Wonderful Video. Like your English.

  • @720xt
    @720xt 4 ปีที่แล้ว +4

    There is an easier way.
    First you install only Arduino FIRMATA on the ARDUINO.
    Then you install the Arduino NODE in Node-RED. An easier way to talk to arduino than the Serial node ;)
    In this way you will be able to talk to ALL of the pins of the Arduino, without the need to make a large sketches, everything will be manageble from Node-RED.

    • @btkramer
      @btkramer 4 ปีที่แล้ว

      Not if you are trying to view the io of a program you are running on the arduino....

    • @antoniodg9344
      @antoniodg9344 3 ปีที่แล้ว

      This one doesn't work. I've tried it a lot of times and nothing

  • @zachreyhelmberger894
    @zachreyhelmberger894 3 ปีที่แล้ว

    Very nice! Thank you!!

  • @sajadmohammadi3155
    @sajadmohammadi3155 6 หลายเดือนก่อน

    Hello,
    I want to set the parameters of an industrial drive using a node through RS485 serial communication.
    In this project, I need to use the hex codes of an industrial drive and control the drive using the hex codes.
    Can you help me with this project with node-red-node-serialport?

  • @terryterry1655
    @terryterry1655 2 ปีที่แล้ว

    How to activate arduino sketch only when prompted in node red and not when connected to serial port after my timer runs down to zero? Pls advise. Thx

  • @vijaynaru
    @vijaynaru 3 ปีที่แล้ว

    Its Great video....Thanks bro...can you share guidance about how to read this value from arduino when it is connected to laptop port say com3 and nodered is running on raspberry pi means on different workstation and I am working on my laptop and accessing nodered there. Thanks

  • @danaknight7678
    @danaknight7678 3 ปีที่แล้ว

    For some reason I do not have a [Home] Default group to select. So I do what I think is right and add a group, it now displays as [Home] [Home] Default, so I did not add it correctly.....

  • @maharshpatel4170
    @maharshpatel4170 3 ปีที่แล้ว

    I want to send raspberry pi data to Arduino. suppose I have integer value '512' on raspberry pi node-red and I want to send that on Arduino so how can I do that?

  • @roywobser5036
    @roywobser5036 2 หลายเดือนก่อน

    Hello, now ist this also interest for me. But how i can send a one Wire bus to Node Red. I have 18 temperatursensors one one Pin an i will See this in Node Red. Can i also Switch other pins for functions?

  • @Lenigan96
    @Lenigan96 4 ปีที่แล้ว

    Hey! I don’t have any options in the TEXT node / group … Why?

  • @josephroberts991
    @josephroberts991 4 ปีที่แล้ว +2

    Love these videos. Is it possible to achieve the same thing using a wireless connection to the Ardunio board? It would be difficult to run USB cables from the control room into the escape room and into every Ardunio board.

    • @PlayfulTechnology
      @PlayfulTechnology  4 ปีที่แล้ว +5

      Oh yes - there's many ways to connect! Wired ethernet, wireless, USB, DMX, ModBus, CanBus, MQTT or HTTP, JSON, CSV, binary, or simple text payloads.... they'll all be coming soon - I just wanted to get this example out first because I think it's the simplest to understand - people are already familiar with using the USB cable to upload code to the Arduino, and I've already used Serial.print many times to send data back from the Arduino to the Serial Monitor. The only difference in this example is that I'm picking up that value in Node-RED rather than in the Arduino IDE.

    • @AlexTheKid85
      @AlexTheKid85 4 ปีที่แล้ว +2

      @@PlayfulTechnology Very nice! If you make wired Ethernet Next that would be nice :)

    • @josephroberts991
      @josephroberts991 4 ปีที่แล้ว +1

      @@PlayfulTechnology Wonderful, thank you so much.

  • @kisjangid
    @kisjangid 4 หลายเดือนก่อน

    so nice thankyou sir

  • @BillBrutzman
    @BillBrutzman 3 ปีที่แล้ว

    Great video _ much appreciated _ one wrinkle for me _ to get serial button in dashboard _ I had to install Visual Studio Community Edition (I already had Visual Studio Code installed.)

  • @WowVinnu
    @WowVinnu 4 ปีที่แล้ว

    Sir , whatever I do I see my serial port is not connected to node red.could you help me out of this

  • @iamZairul
    @iamZairul 4 ปีที่แล้ว

    ty for sharing bro

  • @eng.mustafadhahir295
    @eng.mustafadhahir295 2 ปีที่แล้ว

    Is this can work with Arduino analog input ??

  • @mitkosokolov9382
    @mitkosokolov9382 3 ปีที่แล้ว

    Can you do the code in NR with some function nodes?

  • @akkir6707
    @akkir6707 ปีที่แล้ว

    hey sir do you know how to this but without using any usb wire at all??

  • @sprezzaturarrd
    @sprezzaturarrd ปีที่แล้ว

    Can you write an Arduino code in Node-red instead of using the Arduino IDE?

  • @JohanConradie
    @JohanConradie 4 ปีที่แล้ว +1

    On the 2nd Tab you have the dashboard open, how do you access the web page (How do i get to this screen (address) Sorry i hope this is not a stupid question

    • @Electronieks
      @Electronieks 4 ปีที่แล้ว

      indeed , i m looking also for this information , this video is useless for beginners of for clean node-red installations

    • @homayounsoleimani3556
      @homayounsoleimani3556 3 ปีที่แล้ว +1

      localhost:1880/ui/

    • @Cookie-jb3xd
      @Cookie-jb3xd 2 ปีที่แล้ว +1

      @@homayounsoleimani3556 thank you :D

  • @cosminromuluspop6432
    @cosminromuluspop6432 2 ปีที่แล้ว

    Thx for this video

  • @N1ghtR1der666
    @N1ghtR1der666 26 วันที่ผ่านมา

    outside of playing around/learning you will never build a system that has just one sensor so say you have Arduinos/sensors in multiple locations, how will you read all the data into node red at once, I would think you would likely setup node red on a raspberry pie or something so only have 1-4 usb ports to get serial from, there must be a better way?

  • @Electronieks
    @Electronieks 4 ปีที่แล้ว +1

    which site do i need to enter in the browser to see the dashboard?

    • @user-qb1gx7vx2y
      @user-qb1gx7vx2y 3 ปีที่แล้ว +1

      On top right corner of the Node-RED window you have a tab called dashboard. (display->dashboard) then click on the arrow ↗ right next to Theme

  • @doymentprojects252
    @doymentprojects252 4 หลายเดือนก่อน

    i have some error "[serialconfig:8bd3c8c47c237574] serial port COM2 error: Error: Opening COM2: Access denied" can i fix that?

  • @sajithwickramanayake9511
    @sajithwickramanayake9511 2 ปีที่แล้ว

    Sir how to show text word as a out put in dashboard

  • @budsayalaohapensaeng6869
    @budsayalaohapensaeng6869 ปีที่แล้ว

    Can u teach timemer on node-red with esp32

  • @canyonlewis6452
    @canyonlewis6452 4 ปีที่แล้ว +2

    How do you access the dashboard tab?

    • @user-qb1gx7vx2y
      @user-qb1gx7vx2y 3 ปีที่แล้ว

      On top right corner of the Node-RED window you have a tab called dashboard. (display->dashboard) then click on the arrow ↗ right next to Theme

  • @rohit-lohar
    @rohit-lohar 4 ปีที่แล้ว

    error "please add some ui nodes to your flow and redeploy"

  • @shravanteja6131
    @shravanteja6131 3 หลายเดือนก่อน

    11 Feb 08:26:36 - [info] Starting flows
    11 Feb 08:26:36 - [info] Started flows
    11 Feb 08:26:36 - [error] [serialconfig:11d6dad84156b4a6] serial port COM3 error: Error: Opening COM3: Access denied
    its showing me this error when i tried to connect with node red, but my arduino is connected to the system with the same port. How can I solve this problem

  • @TheUnofficialMaker
    @TheUnofficialMaker 2 ปีที่แล้ว

    You failed to mention where node red is running, I assume its on your pc.

  • @zingo1010
    @zingo1010 3 ปีที่แล้ว

    Very good

  • @ibrarahmad6716
    @ibrarahmad6716 3 ปีที่แล้ว

    Thanks for the video. it is very rare and very explanatory. actually i am thinking of hosting rednode and then i can connect via port forwarding. But how to send this sensor data to the rednode IoT center : self hosted). it will be very helpful if you can make a tutorial about it. thanks in advance

    • @ibrarahmad6716
      @ibrarahmad6716 3 ปีที่แล้ว

      got it.
      a very good explanation is here
      funprojects.blog/2018/03/04/arduino-talking-mqtt-to-node-red/

  • @hoofheartedicemelted296
    @hoofheartedicemelted296 8 หลายเดือนก่อน

    14th line of code Serial.print*n (currentState); Is that a *1?

  • @MrBobWareham
    @MrBobWareham 3 ปีที่แล้ว

    So where is Node-red installed then???

  • @mustafaaljumaili6279
    @mustafaaljumaili6279 2 ปีที่แล้ว

    Can you connect same circuit to raspberry pi ?? I mean Arduino connected to raspberry pi

    • @PlayfulTechnology
      @PlayfulTechnology  2 ปีที่แล้ว

      Sure - you can connect Arduinos to Raspberry Pis via I2C, or simple serial interface.

    • @mustafaaljumaili6279
      @mustafaaljumaili6279 2 ปีที่แล้ว

      @@PlayfulTechnology please paste any link for experiment in which I can get the way for this connection

    • @mustafaaljumaili6279
      @mustafaaljumaili6279 2 ปีที่แล้ว

      Sir , appreciate your help for my request since I have search a lot but not succeed

  • @escapeonealgarve785
    @escapeonealgarve785 3 ปีที่แล้ว

    I seem to be having a nightmare trying to install the node-red-serial palette. It keeps failing to install and I don't really understand anything on the error log! The only thing that makes any sense to me is this bit:
    2020-08-26T14:52:05.002Z [err] gyp ERR! find VS You need to install the latest version of Visual Studio
    2020-08-26T14:52:05.002Z [err] gyp ERR! find VS including the "Desktop development with C++" workload.
    2020-08-26T14:52:05.002Z [err] gyp ERR! find VS For more information consult the documentation at:
    2020-08-26T14:52:05.002Z [err] gyp ERR! find VS github.com/nodejs/node-gyp#on-windows
    But I have installed Visual Studio (eventually), after installing python which it seemed to be missing first. I've tried reading through the github page mentioned above, but again just don't really understand any of it. Should I have to be installing all this stuff or am I missing something?
    The real question I guess is should I even bother trying to get this to work? I was trying to work through all your tutorials so I could learn stuff step by step, but my end goal is to set up props and control software for three escape rooms, so will likely end up using ethernet or wifi connections anyway.
    Any help or advice would be much appreciated!

    • @PlayfulTechnology
      @PlayfulTechnology  3 ปีที่แล้ว

      So are you trying to install the node by going to the Manage Palette option from the dashboard? I've never seen that error before - are you using a Windows PC and, if so, are you logged on as a user with admin privileges? (or, to be specific, are you running your node-run instance as a service with admin privileges?)

    • @escapeonealgarve785
      @escapeonealgarve785 3 ปีที่แล้ว +1

      @@PlayfulTechnology It's ok, it's working now!
      I think the problem was with the Visual Studio install. Turns out I'd installed the 2019 version, but I found somewhere that it doesn't recognise that, only the 2017 version. I'd tried installing that one, but it obviously didn't work properly with the 2019 already there. I got rid of both and installed the 2017 again and now it all works! So now I'm having lots of fun playing with and tweaking all the example code you gave us, finding out what does what!

    • @PlayfulTechnology
      @PlayfulTechnology  3 ปีที่แล้ว

      @@escapeonealgarve785 Woot! That's great news :)

    • @escapeonealgarve785
      @escapeonealgarve785 3 ปีที่แล้ว

      @@PlayfulTechnology Can I ask another question? Do you know how I could send an image as a hint? Either as a full screen image over the timer or just as a pic below it. I've tried to do it by having an inject to a change node setting msg.image to the url of the image and then displaying it on the uibuilder as an html image (). It displays the alt text, but I can't seem to get the image to show?? Any bright ideas as to where I may be going wrong?

  • @duartecancela
    @duartecancela 2 ปีที่แล้ว

    Nice :)

  • @Electronieks
    @Electronieks 4 ปีที่แล้ว +1

    error , i have no group ...

    • @ButtButtNii
      @ButtButtNii 3 ปีที่แล้ว

      In browser enter localhost:1880/ui, then you can enter dashboard

    • @erikbergmann5296
      @erikbergmann5296 3 ปีที่แล้ว

      Took me a bit to figure this out as well. You have to click add a group, THEN on that tab you have to click add new UI tab. I gather you're initializing the dashboard before you can write to it. Once I did that it worked for me.

  • @jeetenderkakkar7570
    @jeetenderkakkar7570 3 ปีที่แล้ว

    100

  • @thepvporg
    @thepvporg ปีที่แล้ว

    Frankly, this is what pisses me off about Arduino, its meant to be accessible but they use a hard language to learn, I learnt Delphi C back in the 1990's and it was horrible language to use and you have to do things that should be automatic like memory and housekeeping.
    Until arduino stop using C only, I won't ever by one.