Dashboard 2.0 - Where we are, and what’s next?

The next generation of the Node-RED dashboard is starting to mature. Development work on Dashboard 2.0 started earlier this year and amazing progress has been made already.
Joe Pavitt, FlowFuse Head of Design and UX, is leading the development work and will be the host of this webinar. During this webinar, Joe does a live demonstration of the project, presents the roadmap for the planned next steps, and lead an open discussion to gather new ideas and feedback.
If you are a current user of Node-RED Dashboard or interested in building your own User Interfaces and Data Visualisations using Node-RED then you will want to watch.
00:00 Welcome to the Webinar
01:22 Introduction
03:40 Dashboard 1.0 - Current State
05:37 Dashboard 2.0 - The Mission
11:06 Migration Roadmap
12:43 Demo 1 - Data Visualisation & Integration
21:14 Demo 2 - Responsive Layout
22:59 Demo 3 - Dynamic Markdown & Mermaid Charts
30:00 Demo 4 - Vuetify & Custom Templates
41:13 Future Features
45:16 Announcements
47:01 Q&A

[@thegeterrdone]

Great Webinar :) I love the new updates and definitely going to try them out asap. Thanks Joe and Ian for the webinar.

[@joeking5211]

Stunned and rather pleased to spot this vid. Was just about to scrap NR after coming back to it after a few years break to maintain some old flows and spotted some info that very soon now NR Dashboard will no longer be supported, IIRC something to do with 'angular', and that made the call to scrap the use of NR. I shall be viewing this vid for the full 1Hr when time permits, but in the meantime are you saying this is false info that I read and in fact there will be a newer Dashboard version that will be supported, as if so I'll hold my flows. The comment below this states "I love the new updates", is this referring to v2.0 being available now ?, I don't see it unless I am not updating correctly ?. Kind Rgds and respect to all NR developers.

[@FlowFuseInc]

Hi Joe. Yes, there is a newer dashboarding tool supported by FlowFuse. It will be under a different package.
This a new project that can be found here: www.npmjs.com/package/@flowfuse/node-red-dashboard
If you are looking to migrate, start here: flowfuse.com/blog/2023/11/dashboard-0-7/

[@Best_Chuansatien]

Node red have a great benefits for my work
hope one day I can contribute some thing to mankind and back to your team

[@FlowFuseInc]

Thank you for your kind words! We're thrilled to hear that Node-RED has been beneficial for your work. We'd love to know more about how you use Node-RED and the specific ways it helps you.

[@Best_Chuansatien]

My Team use Node-Red dashboard to build Mini app to gather data from Processed fruit Plant both from Manual input (Dashboard) and from PLC via Modbus TCP
And calculate the result then show data to Plant Owner
I Run it as a actual production For a year. So stable and light load
Looking forward to test Dashboard 2.0 with my Data-gathering Project
One day i hope to be good enough to build some new useful contrib and share to community

[@FlowFuseInc]

​@@Best_Chuansatien Thank you for sharing your experience with Node-RED! Should you ever encounter scalability, remote access, or access control challenges, remember that these are areas we specialize in at FlowFuse. Feel free to reach out whenever you need expert support. Keep up the excellent work!

[@RRits57]

very cool!

[@zyroxiot9417]

Great. Thanks 🇧🇷🤝🏼

[@DreamsAPI]

Is it possible, if yes, please how, to embed AI trained on Node-RED's documentations to help us while we build

I work a lot with the ui-template and assemble all my components within it. Currently, everything works for me on the old dashboard, but it seems that the new one leaves the assembly disorganized. Extracting status dynamically from components like the node has been a big problem and the simplistic example in the video doesn't really show how to do it. If there is documentation that shows me how to extract the component statuses through a simple payload like I do in the old one using this new workbench, leave me the link so I can anticipate the end of the old dashboard.

I just saw that you left one on how to assemble the internal structure of the ui_templet for people who, like me, assemble all the components from scratch. Thank you and I will continue testing with this.. You can have an example on my channel of how in Brazil we use these nodes and develop something. Grateful

[@solidfuel0]

I spent hours to get chart to work and it doesn't. Even your own example didn't work. I so lazy to report to github

[@MrValles10]

*Clicks "cancel" instead of done everytime*
"why is none of my stuff saving? That's very weird" 😂

[@solidfuel0]

You said you will show us the result of js code and how it merge the arrays, but you never did. I want to see what format the chart work with. Docs sucks

[@FlowFuseInc]

Hi @solidfuel0 - thanks for the feedback. Just to check you're looking in the right place, the chart documentation is available here: dashboard.flowfuse.com/nodes/widgets/ui-chart.html#working-with-data
If that still doesn't help - can you please raise a post on the Node-RED Forums, and share a little more detail on what you've tried, and then we (and the rest of the community) can help there: discourse.nodered.org/tag/dashboard-2