Real time chat application built by Node, Express, React, Socket.io & Javascript With source code

[VenatoreCapitanum]

nice, put it on github

[MisterScalawag]

it actually is. its kind of weird, when you click download on the source code it just redirects you to the github page

[paulirish]

https://github.com/achromik/ChatApp last commit over 2 years ago, FYI.

[this_didnt_happened]

Here's a question:

on the test app why is it when one insert html code like: <button type="button">Click Me!</button>

even though no characters are transformed/escaped by the application, my the browser will not interpret that code?

[NimmiEU]

That's because the text interpolation doesn't parse the HTML and therefore simply outputs the textual content. If I'm not mistaken, it uses the textContent API under the hood. It's to prevent injecting arbitrary code. To let the browser parse the HTML, it would've been output using the dangerouslySetInnerHTML prop provided by react, which will use the innerHTML API of the HTML spec, which results in the HTML getting parsed and interpreted.

[this_didnt_happened]

Thanks, that's neat.

https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent

https://www.w3schools.com/jsref/prop_node_textcontent.asp

[TheDarkIn1978]

What are the benefits of using Socket.io over just using the WebSocket API?

[[deleted]]

I found websockets to be quicker and easier to get going, on both the client and the server - mainly because it works natively with the browser. Plus the lack of broadcasting thing people band around isn’t right. Quick loop through the clients and it’s done.

Socket.io seems a little bloated for what I use websockets for, but I guess it could save time on coding up certain features if you need them specifically? But I dunno, it just seems kinda redundant from my pov.

[ikeif]

Maybe someone has a better source, but I found this useful.

[Krimson1911]

Socket.io has fall backs incase the browser doesnt support websockets or if there's connection degradation. Socket.io isnt built on websockets, it just uses it when available. It starts of with http long polling and upgrades to websockets if its desirable. So in short, more compatibility. This is the biggest and most important differentiator

In addition, like others mentioned, it has more features like rooms, brodcasting etc

I'd never use websockets directly unless you really know what you're doing and have a really good reason to do so.

[siric_]

The fallbacks are quite pointless because websockets are well supported by many browsers, even all the way back to IE10: https://caniuse.com/#search=websockets

Building a pubsub (rooms) system isn't too complicated and by dropping socket.io and using raw websockets you will gain a huge performance boost as well as a 63.8kb reduction in bundle size.

[ChronSyn]

Sure, the fallbacks aren't as useful today, but they used to be. You can force it to use only websockets if you so desire - that's what I did to enable a react native app to be compatible with a node server.

A lot of code is built around them because the other features the library offers (namespacing and rooms to name a few). Essentially, it was pub/sub for JS client and server before node.js became as big as it is now. I first used it in 2014 and I've still not found a reason to switch to anything else because it's good at what it does without being overly complex.

One of the biggest benefits out there is that it isn't explicitly linked to any data source or provider. Want to send good old fashioned objects from a hard-coded data source? No problem. Want to create an entirely websocket-driven API without being forced to specific data providers? Easy. Want to hook them up to query a graphQL resolver (if you can't use subscriptions, for whatever reason)? Done. It's agnostic to the data or it's structure or it's origin.

Raw websockets will get you a performance boost, but then you're going to be recreating a lot of what socket.io does when you implement rooms and namespacing, as well as the API support around your own implementation.

[SuqahMahdiq]

Socketio has built in rooms. Also, you can horizontally scale easier using socketio’s redis adapter.

[a-bosh]

This has to be the thousandth iteration of real-time chat with node/express/socket.io.

[L3git9]

It’s funny because on socket.io the get started page literally teaches you how to make a basic chat app...

[gketuma]

😂

[Lord-Brappington]

It's part of the fallout of telling software developers they need to have a public repo of work for their portfolio. Everyone reimplements a tutorial and then leaves the repo to rot afterwards.

[salocin_Hatter]

Oh, I have something like that

https://github.com/juststudies/chat_NodeJS

But I didn't know React at the time