This project contains a demo client showing integration between Lightstreamer JavaScript Client library and Vue.js
JavaScript HTML CSS
Switch branches/tags
Nothing to show
Clone or download
Latest commit fec2a67 Mar 23, 2017
Failed to load latest commit information.
src Update links Jul 18, 2016
.gitignore Initial commit Jul 18, 2016
LICENSE Initial commit Jul 18, 2016 Fix markup. Mar 23, 2017
screen_basicstocklist.png Initial commit Jul 18, 2016
screen_basicstocklist_large.png Initial commit Jul 18, 2016

Lightstreamer - Basic Stock-List Demo - Vue.js Client

This project contains a demo application showing the integration between the Lightstreamer Web Client library and Vue.js.

Live Demo

Demo ScreenShot

View live demo


This demo displays real-time market data for ten stocks generated by a feed simulator and is based on Basic Stock-List Demo.

This project uses the JavaScript Web Client API for Lightstreamer to handle the communications with Lightstreamer Server and uses Vue.js library to display the real-time data pushed by Lightstreamer Server.

The onItemUpdate callback, of a Lightstreamer Subscription, updates an object binded to a Vue.js component, which keeps in sync the real-time data with the DOM.

If you want to go deeper into Vue, check out the Vue.js site.


If you want to install a version of one of these demos pointing to your local Lightstreamer Server, follow these steps:

  • Note that, as prerequisite, the Lightstreamer - Stock- List Demo - Java Adapter has to be deployed on your local Lightstreamer Server instance. Please check out that project and follow the installation instructions provided with it.
  • Launch Lightstreamer Server.
  • Get the lightstreamer.js file from the latest Lightstreamer distribution and put it in the src/[demo_name]/js folder of the demo (if that is the case, please create it). Alternatively, you can build a lightstreamer.js file from the online generator. In that case, be sure to include the LightstreamerClient, Subscription, ConnectionSharing, and StatusWidget modules and to use the "Use namespaced globals" version.

You can deploy these demos to use the Lightstreamer server as Web server or in any external Web Server you are running. If you choose the former case, please create the folders <LS_HOME>/pages/demos/[demo_name] then copy here the contents of the src/[demo_name] folder of this project.
The client demos configuration assumes that Lightstreamer Server, Lightstreamer Adapters, and this client are launched on the same machine. If you need to target a different Lightstreamer server, please search this line:

lsClient = new Lightstreamer.LightstreamerClient(protocolToUse+"//localhost:"+portToUse,"DEMO");

in js/index.js, and change it accordingly.

The demo is now ready to be launched.

See Also

Lightstreamer Adapters Needed by These Demo Clients

Related Projects

Lightstreamer Compatibility Notes

  • Compatible with Lightstreamer Web Client library version 6.0 or newer.