Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Get Started Node-RED with Web App

Get Started Node-RED with Web App

57c9c4b846c73c911cbf795d211904f3?s=128

Taiji HAGINO

March 24, 2021
Tweet

Transcript

  1. Get started Node-RED with building web applications Taiji Hagino IBM

    Customer Success Manager | Developer Advocate IBM Champion Program Japan Regional Director Node-RED Japan User Group Lead @taiponrock
  2. Taiji Hagino Customer Success Manager | Developer Advocate IBM Champion

    Program Japan Director IBM Lecturer University of Tsukuba @taiponrock Please follow me! Practical Node-RED Programming By Packt Publishing Ex-hairdresser and Ex-musician. After becoming a software engineer, he started an Accurate Systems Ltd. with his various experience. After working as a system integrator of a subsidiary of a general trading company, he joined IBM as a developer advocate in the IBM Global team, developing DevRel (Developer Relations), a marketing approach to engineers. Now he works IBM as Customer Success Manager. My books “Developer Marketing DevRel Q&A” (Impress R&D), “Hajimete-no Node-RED”, “Node-RED using manual” (Kogakusha), etc.
  3. What is Node-RED? 3 The Node-RED editor runs in a

    browser and allows you to create applications by drawing flows of events. Each node in a flow represents a well-defined piece of functionality, such as updating a value, making a database query or sending a tweet. The developer configures each node as required, focused on what it does, not how it does it. When the flow is deployed to the Node-RED runtime, each node becomes a running piece of code and messages start passing through the flow. “Flow-based programming for event-driven applications” https://ibm.biz/NRWorkshop
  4. Technical Overview architecture 4 There are two logical parts to

    Node-RED. The Runtime is a node.js application. It is responsible for running the deployed flows. The Editor is a web application where the user can edit their flows. The main installable package includes both components, with a web-server to provide the Editor as well as a REST Admin API for administering the runtime. Internally, these components can be installed separately and embedded into existing Node.js applications. node-red runtime editor HTTP Admin API @node-red/editor-api Client-side Editor @node-red/editor-client Flow Runtime @node-red/runtime Core Nodes @node-red/nodes Node Registry @node-red/registry Common Utils @node-red/util https://ibm.biz/NRWorkshop
  5. Technical Overview flows 5 A flow is a collection of

    nodes that are wired together. A node can have multiple output ports and a single port can have multiple wires connected to it. The flow is stored as a JSON object – providing the configuration for all of its nodes and how they are connected. The flow JSON can be imported and exported between Node-RED instances, making it easy to share flows. https://ibm.biz/NRWorkshop
  6. Technical Overview messages 6 The messages that pass through a

    flow are JavaScript Objects. By convention they will have a payload property that contains the ‘interesting’ information. This is the property most nodes will operate on by default. topic: “weather/uk” payload: “sunny!” … … https://ibm.biz/NRWorkshop
  7. Technical Overview nodes 7 Nodes are the basic building blocks

    of a flow. Nodes that sit at the start of a flow will be waiting for some external event to occur, such as an incoming HTTP request, a timer event or a hardware IO event. They then pass messages onto the nodes they are connected to. Nodes receive those messages, do some work, and then pass them on down the flow. payload: “Jedi are totally amazing!” payload: “Jedi are totally amazing!” sentiment: { score: 4 } In this example, a Sentiment analysis node has examined the ’payload’ property of the message, assessed its sentiment and added its result as a new property of the message. https://ibm.biz/NRWorkshop
  8. Technical Overview nodes 8 Nodes also represent the main way

    Node-RED can be extended by the community. They consist of two parts: - A node.js module that defines the runtime behavior of the node. - An HTML file that provides its appearance, edit dialog and help text for the Editor These are packaged as a Node.js module and distributed via the NPM package repository. The project hosts https://flows.nodered.org that automatically indexes the available Node-RED modules on npm https://ibm.biz/NRWorkshop
  9. https://ibm.biz/NRWorkshop Hands-on Workshop

  10. Part 1 10 https://ibm.biz/NRWorkshop Part 2 Part 3 Part 4

    Part 5 Getting Started with Node-RED Setting up your Cloud environment Deploy your application to the Cloud Connect your app to a cloud-hosted db Setup a deployment pipeline to Cloud
  11. Part 1 11 https://ibm.biz/NRWorkshop Part 2 Part 3 Part 4

    Part 5 Getting Started with Node-RED Setting up your Cloud environment Deploy your application to the Cloud Connect your app to a cloud-hosted db Setup a deployment pipeline to Cloud
  12. Part 1 Getting Started with Node-RED 12 Get a Node-RED

    application running locally against a CouchDB database https://ibm.biz/NRWorkshop
  13. 13 https://ibm.biz/NRWorkshop npm install -g --unsafe-perm node-red https://nodejs.org/ Installing Node.js

    (and npm) Installing Node-RED
  14. 14 https://ibm.biz/NRWorkshop

  15. 15 https://ibm.biz/NRWorkshop

  16. 16 https://ibm.biz/NRWorkshop

  17. 17 Node-RED Editor Runtime https://ibm.biz/NRWorkshop

  18. 18 Node-RED Editor Runtime https://ibm.biz/NRWorkshop

  19. 19 flow.json : the flow configuration flow_cred.json : credentials file

    package.json https://ibm.biz/NRWorkshop
  20. 20 Node-RED Editor Runtime CouchDB https://ibm.biz/NRWorkshop

  21. Part 2 Setting up your Cloud environment 21 Create an

    IBM Cloud account and install the ibmcloud command-line tool https://ibm.biz/NRWorkshop
  22. Part 3 Deploy your application to the IBM Cloud 22

    Get your application running in the IBM Cloud https://ibm.biz/NRWorkshop
  23. 23 Node-RED Editor Runtime https://ibm.biz/NRWorkshop

  24. 24 flow.json : the flow configuration flow_cred.json : credentials file

    package.json settings.js : runtime settings manifest.yaml : deployment manifest https://ibm.biz/NRWorkshop
  25. 25 Runtime https://ibm.biz/NRWorkshop

  26. Part 4 Connect your application to a cloud-hosted db 26

    Create a cloud-hosted Cloudant instance and configure the application to use it with separate development and production databases https://ibm.biz/NRWorkshop
  27. 27 Runtime Cloudant https://ibm.biz/NRWorkshop

  28. Part 5 Setup a deployment pipeline to IBM Cloud 28

    Create a deployment pipeline use TravisCI to automatically deploy your application when pushing updates to a GitHub repository https://ibm.biz/NRWorkshop
  29. 29 Runtime Cloudant https://ibm.biz/NRWorkshop

  30. We have Node-RED communities Group Name / DOC ID /

    Month XX, 2018 / © 2018 IBM Corporation 30 https://nodered.org/slack/ https://www.facebook.com/groups/nodered Slack Facebook Group
  31. Who want this book Group Name / DOC ID /

    Month XX, 2018 / © 2018 IBM Corporation 31 We can chose 5 people, so please email me! taijih@jp.ibm.com
  32. None