4 posts tagged with "react"

Introduction​

Web Components have been around for quite some time now, but it's probably fair to say that they have not reached the widespread adoption that in the early days it seemed they might. I never really started using them for various reasons:

• Incomplete browser support JsPlumb needs to work on as many browsers as possible and does not have the luxury of requiring the latest browsers. It took quite some time for all of the major browsers to bring their web components support up to the spec.
• Relatively poor documentation Nowadays there's a wealth of articles discussing web components, including a great one on MDN, but this was not the case at first.
• Clunky developer interface This is of course a subjective viewpoint, but it's certainly not just me who thought so. One of the fundamental issues for me was trying to figure out how they could be composed as easily as something like React/Angular etc, particularly when the only input to a web component is through its attributes, and they have to be strings.

Recently I've been looking at web components anew: with the upcoming 7.x release of JsPlumb we're keen to explore all opportunities to use up-to-date technologies, and we thought web components deserved a second look. There seems to be a groundswell of people adopting them, and so we're interested in exploring if there's any value for our licensees in us adding some kind of web components support.

Specifically, we're wondering if we can support something like this:

Recently we documented the process of building a chatbot app in 3 hours and 37 minutes. A couple of days later we documented porting that to make an Angular Chatbot, and now in today's post we're going to look at porting the vanilla chatbot to React.

Yesterday we documented the process of building a chatbot app in 3 hours and 37 minutes. We wrote that app in "vanilla" JS but we know one of the features of JsPlumb that people love is its deep integration with libraries such as Angular, Vue, React and Svelte. In today's post we're going to look at porting the vanilla chatbot to Angular.

Recently we had the idea that a good addition to our list of starter applications might be a chatbot demo. In this post we're going to track the process in real time, or real-ish time, at least. We're going to write this in ES6, and we'll use esbuild to create our bundle.

The source code of this demo is available on Github. If you're not a licensee of JsPlumb, you can start your 30 day free trial of JsPlumb here.

So - here goes.

8:10am - initialisation​