All Projects → PeterKassenaar → Ng2 Websockets

PeterKassenaar / Ng2 Websockets

Example project of using WebSockets in an Angular 2 application

Programming Languages

typescript
32286 projects

Projects that are alternatives of or similar to Ng2 Websockets

Hookah
A cross-platform tool for data pipelines.
Stars: ✭ 83 (-17%)
Mutual labels:  websockets
Draw
Real-time collaborative whiteboard on the web
Stars: ✭ 89 (-11%)
Mutual labels:  websockets
Advanced Redux
A messenger service built with Redux
Stars: ✭ 96 (-4%)
Mutual labels:  websockets
Localslackirc
IRC gateway for slack, running on localhost for one user
Stars: ✭ 84 (-16%)
Mutual labels:  websockets
Swindon
An HTTP edge (frontend) server with smart websockets support
Stars: ✭ 87 (-13%)
Mutual labels:  websockets
Js Integration Examples
Examples of common uses of ports and web components
Stars: ✭ 90 (-10%)
Mutual labels:  websockets
Angular Websocket
↖️ The missing Angular WebSocket module for connecting client applications to servers by @AngularClass
Stars: ✭ 1,242 (+1142%)
Mutual labels:  websockets
Serverless Chat
A serverless web chat built using AWS Lambda, AWS IoT (for WebSockets) and Amazon DynamoDB
Stars: ✭ 99 (-1%)
Mutual labels:  websockets
Rabbitmq Web Stomp
Provides support for STOMP over WebSockets
Stars: ✭ 87 (-13%)
Mutual labels:  websockets
Pytrader Python Mt4 Mt5 Trading Api Connector Drag N Drop
End-to-End solution connecting Metatrader4 & Metatrader5 💹 with Python with a simple drag and drop EA. Fully tested bug free & efficient solution for live & paper trading⭐ Full Documentation ready.
Stars: ✭ 93 (-7%)
Mutual labels:  websockets
Codeigniter Ratchet Websocket
This library contains the demo of commenting/posting realtime using CodeIgniter+AngularJS+Ratchet PHP Websocket
Stars: ✭ 84 (-16%)
Mutual labels:  websockets
Arduinowebsockets
arduinoWebSockets
Stars: ✭ 1,265 (+1165%)
Mutual labels:  websockets
Wsrpc
node.js/browser protobuf rpc over binary websockets
Stars: ✭ 91 (-9%)
Mutual labels:  websockets
Websocket Client
Async WebSocket client for PHP based on Amp.
Stars: ✭ 83 (-17%)
Mutual labels:  websockets
Sacrificial Socket
A Go websocket library with an API similar to Socket.IO... but not Socket.IO
Stars: ✭ 96 (-4%)
Mutual labels:  websockets
Laravel Blog
Laravel 8.0 blog application with Vue.js, Homestead, Horizon, Telescope and Pusher
Stars: ✭ 1,248 (+1148%)
Mutual labels:  websockets
Mentat
scalable group chat with tags and pretty good privacy.
Stars: ✭ 89 (-11%)
Mutual labels:  websockets
Basilica
It's kinda like a forum.
Stars: ✭ 99 (-1%)
Mutual labels:  websockets
Sandstone
PHP microframework designed to build a RestApi working together with a websocket server. Build a real time RestApi!
Stars: ✭ 98 (-2%)
Mutual labels:  websockets
Uvicorn Gunicorn Starlette Docker
Docker image with Uvicorn managed by Gunicorn for high-performance Starlette web applications in Python 3.7 and 3.6 with performance auto-tuning. Optionally with Alpine Linux.
Stars: ✭ 92 (-8%)
Mutual labels:  websockets

[status: unmaintained - though the code still works, this repository is not updated anymore]

ng2-websockets

Example project of using WebSockets in an Angular 2 application.

This project consists of two parts, a client (angular 2.4, as of Feb.02.2017) and server part (Nodejs 4.x+).

Server(s)

  • Download or clone the repo and run npm install in the server directory to install server dependencies.
  • Currently the server only has a dependency on js-websockets
  • Run node server.js or nodemon server.js to start the server.
  • A chat server is started on localhost:3005.
  • A random data emitter is started on localhost:3006 (community: can this be done simpler??)

The only purpose of this simple server is to start a websocket server and accept incoming connections. Once a message is posted to the server, it is transformed by adding the local time to the incoming object and then echoed back to the client.

The other server emits a random number, every 1 second. It is displayed in the user interface. Think of this as an example for a "stock ticker", or the like.

Client

  • Download or clone the repo and run npm install in the client directory to install dependencies.
  • Make sure the server is already started before you try to start the client (as it is trying to connect to the ws-server on startup).
  • run npm start to start the client.
  • Typ a message in the messagebox. It should reappear in the list of messages.

Messages are always in the format of a Message-object in the following format:

interface Message {
	author: string,
	message: string,
	newDate?: string
}

the field newDate is added by the server.

The number server emits just a simple random number 0 - 10,000.

TODO

  • The server crashes if the client is reloaded - working on that, PR's welcome! For now: just restart the server with Ctrl+C and nodemon server.js again.
  • Text is copied as many times as there are connected clients.

Credits

This project is based on previous work by Łukasz Wojciechowski (https://github.com/lwojciechowski/mildchat-client), who also wrote [this great article] (https://medium.com/@lwojciechowski/websockets-with-angular2-and-rxjs-8b6c5be02fac#.v1d65auh8) on Angular 2 and websockets.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].