You can listen to the podcast and read the show notes here.
Michael Smith: Welcome back to the show. I’m here with Giancarlo Gomez- I think I’m pronouncing your name right there? Also he’s known as JC, which is a lot easier to pronounce. And he is the co-manager of the South Florida ColdFusion Users Group, which actually is now a virtual user group. Anyone in the world can join in there; it’s through Meetup. And he is not only a dad and a husband, but … Web developer, musician, he owns Fuse Developments, and he created CrossTrackr, in case you do CrossFit and want to track how well you’re doing. So welcome.
Giancarlo G: Hello, Michael, thank you. Thank you for having me.
Michael Smith: So I know you’re speaking at the upcoming Into The Box Conference and you’re talking about WebSockets and … Tell us a bit about that. First of all, maybe we’d better back up a bit. What the heck is a “web socket,” in case people have never used it? I mean, I know it’s been in ColdFusion for a few versions now, but that doesn’t mean people even know it exists.
Giancarlo G: A WebSocket is the ability to send real-time information back and forth between the server and the connected client, with very little to almost no lag. Rather than the user having to poll the server or look for information from the server, the server immediately, once it knows it has information that it can send to subscribed clients, it will do it in real time. So you can … Probably have worked with many websites where you see real-time things happening without you having to refresh the site, in collaboration sites or games; most of these things are done with web sockets. Might be trivial, or some people think … They might think it might be difficult to implement, but ColdFusion makes it really, really easy to start up and get going using this technology.
Michael Smith: So, something I’m sure everyone used is website chat, where there’s a little chat app and you can chat back and forth. Is that something you can implement with WebSockets?
Giancarlo G: That is, and that unfortunately is, at times, what people think WebSockets are for. It gives the, that interpretation where people might not want to see it because they think they’re going to be introduced to a chat app, and- Although I will show you how to create a simple chat app that shows a good way to handle events as people log in and log out and…
I will also show you other things that can be done with WebSockets, in case you haven’t thought of them before. One of them, we will go through a live dashboard, which I use in a lot of my clients’ sites. Actually, CrossTrackr is, you know … One of the beautiful things about it is all this live information going in real time, where people can interact with their phones, interact with kiosks and all that, and then have a dashboard where everything’s updating in real time.
I’ll also show you a quick collaboration form, where you can be sending data in real time and see if somebody else is working on the form and how things actually change in real time. I think those are really good examples to give you an idea of how you can use this in other businesses. You can use it for dashboards, just real-time data; it makes it fun to code that kind of stuff again.
Michael Smith: When you say “dashboards,” that’s like statistics on the company, or whatever the system is; it could be the server, info …
Giancarlo G: Yeah, I mean, it could be graphical … Graphic data, it could be visual data, it could be text. It could be messages that you want to push on the fly. For instance, I have an ordering system that as orders get placed, it can move in real time across different statuses. So think about going to the airport and then you see your flight’s changing in real time; it’s basically developing something similar to that.
Michael Smith: How are you consuming that info? ‘Cause you … I’m assuming WebSockets is just getting the data pushed into the client …
Giancarlo G: When you’re thinking about WebSockets, you’re thinking about just pushing small pieces of data- although you could push images and all that, the way I use it’s more event-driven, so when an event probably happens that triggers it, this particular data can be sent to the clients to either update the views, or maybe take another action, like fetch something from the server. But again it’s a … Helps with minimizing the old poll type of request, where you’re continually asking the server for … Is there something for me? Is there something for me? Taking those additional resources, you will not have to do this, ’cause as your application grows and you have hundreds and thousands and hopefully millions of connections doing this, the least amount of unnecessary traffic is what you want to achieve. And web sockets-
Michael Smith: So when you’re talking about an older way of doing it, are we talking like, Ajax, or some other technology?
Giancarlo G: Right, so … It would be … One of the ways, it’s called long polling, so the way that it would occur would be that the user would basically start up with a request from their client, make an initial Ajax request: ask the server if there’s something for them. The server would then respond. At that time, you would set or you do a timeout on your end every time you get a response. Maybe five seconds later, maybe ten seconds later, you kind of ask the server again. And you can do this over a period of time. Imagine for an hour, you were doing this every … Let’s say you were doing it every minute. That’s sixty requests that you’re making; you probably never even received any update. And of course if you make it smaller, that number just continues to increase. And then we increase it by clients, and you know … That all takes a certain hit on your web servers.
With WebSockets, when the client connects, it creates a bi-directional connection that the server not only knows that the client is there, but the client also knows that the server is connected and he can send data back and forth. Now when something triggers on the server, through that connection, that message can be sent in real time to not only one, but multiple connected clients that are set to receive that data.
Again, it’s something … I think it’s a lot more fun and easier to understand as you see it, but definitely is a technology that I love to play with.
So the original way was basically that you would poll that question over and over again. You would put that wait time on the client. There’s also long polling on the server, if it allows, which is you request a update from the server, again using Ajax, but now the server keeps that connection open and kinda just looks through it and when, after a certain specified amount of time, it knows whether to return, “Yes, I have a value for you,” or, “No, I don’t.” As soon as it does, or maybe let’s say you say, “Keep this connection open for a minute before I need you to close it,” because this is a regular HTTP connection, and there’s a limitation of how many connections an actual server can keep open. And this is where WebSocket comes in, where it can keep multiple … I mean, I don’t have the physical number, but I know it can go pretty high in tests that many smarter people than me have done.
Michael Smith: And so this can be keeping … You can have your app on a phone, it can be on several screens, and they’re all kept pushed in sync with whatever the data is.
Giancarlo G: And you can even go … You can have your phone, computer, tablets, and … You can even make connections with native apps. Native apps have the ability … Even though native apps also have push notifications that we all currently see, where your app doesn’t have to be connected … That is something completely different than WebSockets. WebSockets, your client needs to be connected. So it’s kind of like push notifications, where it is in push notifications you can actually close out your browser and the background, so like a service worker or something else that’s available in the technology will know the connection and send it to the client. Here, you do have to be connected. But you can use this technology for websites, for native applications … It’s really … The possibilities are endless.
Michael Smith: It sounds really exciting. Now, I’m imagining some of the people listening are thinking, “Well, that sounds really cool, but does that mean we have to have the latest version of ColdFusion and have to pay for the Enterprise license?” What versions can you use this on?
Giancarlo G: If you do want to start with this, you can start as early as ColdFusion 10, although that does have some limitations. For instance, if you have a limitation of 100 clients, and after a hundred clients, what ends up happening is those connections, I believe, get pulled. Never really had a clear definition on what happens. Or they get queued. By the time I needed to really know, ColdFusion 11 came out and the team actually got rid of that, where there’s no limitations on how many connections can be, other than the limitation of your own server.
Also, if you needed a … The reason why I didn’t use it in 10 was because my website was an SSL website, so I’d lose an HTTPS website and in order to make a connection a website, a server, you also need to connect to a secure server. Back in the day, browsers weren’t really strict on that, except IE, but now all of them are, and if you try to connect to an unsecure WebSockets from a secure page, it’s gonna fail. So ColdFusion 11 also made that possible.
But if you have ColdFusion 10, or you don’t have ColdFusion 11, you can use other resources like Socket.IO. This is a known server that runs on top of, I believe, the Express framework, or you can just use it standalone. Again, it’s something that is not too difficult to get set up, where you can either set up yourself, manage it, test it, or you can have it run often as your server. Or you can do a paid for service, like Pusher or NubHub- PubNub, I’m sorry, PubNub is one of them … It’s available-
Michael Smith: Do all the clients have to use the same WebSockets service? Can you have that other one you just mentioned, Socket.IO, working together with the ColdFusion 2016 WebSockets, or … They will want to be using the same one?
Michael Smith: So if you’re using the ColdFusion WebSocket server, you don’t have to pay for an extra service in order to be able to do this?
Giancarlo G: No, you do not. If you’re using ColdFusion 11, you got a pretty one to work. ColdFusion 11 or higher … The only thing that’s required in ColdFusion now for Enterprise levels if you’re doing clustering, which makes sense because you can only do clusters if you have the Enterprise license.
Michael Smith: But if you needed a cluster of WebSockets, you’ve got a pretty big app to start with, so you probably could afford to go that way.
Giancarlo G: Yep. And you’re going into a realm that I have to support. But I can show you how to get a cluster working, though. And it’s-
Michael Smith: Right, because it can … You can handle a high volume on a single server.
Giancarlo G: Yes, you can handle a high volume on a single server, yes, you can.
Michael Smith: Yeah. Then what about the folks who use Lucee CFML Open Source? Are they able to do this stuff, or…?
Giancarlo G: With Lucee, I believe there’s a plugin; I still haven’t messed around with it. There was a video made on it. I would … I am going to try my best to give it a whirl before the presentation, but if I don’t, the resources are out there, and if it does not work for you, ’cause I believe it’s still like in a beta stage, there’s always Socket.IO or any of those other available paid-for services. Again, Socket.IO is completely free; it’s open-source.
Michael Smith: Cool! So you could set up a whole open-source system that did this stuff if you wanted to.
Giancarlo G: Yes, I actually … That’s what CrossTrackr runs off. So CrossTrackr actually runs off Socket.IO, because when I-
Michael Smith: And how are you using this in CrossTrackr? You’re keeping track of how many circuits people have done, or how many weights they’ve lifted, or … I don’t quite …
Giancarlo G: Uh, no. In CrossTrackr, the way we use it, there’s several different dashboards, but … In a personal level, you use it post to your profile in real time. But you’re part of a box, just like going to a CrossFit box, you have to … Or any type of gym, anywhere you have to check in. So the check-in process is taken into consideration. As you check in, you show up on the dashboard for the class. When you finish your class and put in your results, well those are also according to real time in that dashboard.
And there’s also another dashboard that comes into play called the Stats board, which … Once you put results, you show up there, and that’s where you actually get ranked. And then coaches, at a gym, actually have a Coach board that in real time, if you’re not putting your results, they can do it for you. And all those work together. So it’s a whole ecosystem of just data being pushed in real time and updating various dashboards in real time. So you could be watching a dashboard from anywhere in the world and just sit there and watch what happens every day.
Michael Smith: So you get real-time data being spread around the world using WebSockets?
Giancarlo G: Yes.
Michael Smith: So I’m just thinking out loud- I’m not suggesting anyone does this, but just suppose for fun, you wanted to recreate the Tinder app, which is all a real-time push and search thing, where people can chat with each other and what have you. You could basically do that part of the application using this technology.
Giancarlo G: Yes. Yes, you can. I would say yes, you can.
Michael Smith: Wow. So are you gonna be showing code during your talk, or…?
Giancarlo G: I’ve actually had one talk before, which was really Introduction to WebSockets, and I’ve showed some of these demos there, and I’ve gotten really good feedback, I got … It opens eyes to everybody that … It opens everybody’s eyes to things that you can do with WebSockets.
So what I plan to do with this new version of the presentation is actually get right into the code. I’m not gonna sit there and explain to you what a WebSocket is, and tell you the history of it, or what the … How the web works. If you want to, we can sit down, we can discuss later, but I really want to get into coding. I am the kind of guy that likes to kinda code live, show you … ‘Cause it gives you that feeling that it can be done. You’re seeing somebody go through it, you can ask questions in real time, you can see a finished product. So yes, we’ll be going right into code, showing you examples, and open for any type of questions that you may have, or challenges. We may try something in real time.
Michael Smith: Sounds good. A real-time coding talk for a real-time coding technology makes sense.
Giancarlo G: Yes.
Michael Smith: So let’s just switch subjects briefly. I think you mentioned this is the first time you’re going to Into The Box, but why- I know you’re speaking there, but why else are you going?
Giancarlo G: Into The Box, it’s … I’ve always wanted to go, it kinda has never probably worked with my schedule, but this time I’m going not only ’cause I’m speaking but also to just meet friends, network, and also learn from other peers. I mean, that’s what I really like about going to conferences: it lets you get away, see the people that I follow, that inspire me, and just kinda have one-on-one conversations and learn from each other. That’s what we’re … That’s why we do these things, you know?
Michael Smith: Yeah, it’s a great place … A way to network, meet other people, learn new stuff, and make ColdFusion friends that you probably keep for many years. And then … This is a question I’ve been asking people: Why are you proud to develop in ColdFusion? ‘Cause I know you’ve been doing it for a while. Why are you proud to do that?
Giancarlo G: I love the language. It was the first language I learned. I learned it ’cause I was a musician. I needed … I went to a friend and said, “I need a mailing list! I’m tired of carrying this big folder where people put in their emails,” and my friend said, “Well, you know there’s a cfquery tag, a cfoutput tag, and a cfmail tag,” and I was in love. That’s the truth. I have worked in other languages. I’m proficient in dotnet and PHP and I do like all of them, and … But still, to this day, when I need to get a real quick idea out, ColdFusion just seems to make it really simple to do. And I think there’s a lot of value in that. And I think it has a great community. People might roll their eyes here and there, but I believe it’s a great language to this day, and it has a lot of potential.
Michael Smith: Well, and I know you’re doing a lot with the South Florida User Group to make that community stronger, so.
Giancarlo G: Always. Always, yeah. We tend to meet online, monthly. From time to time, we may do a presentation, but I’ve changed it into more of a roundtable, so you’re welcome to come if you have problems, if you have questions; that’s what we want, we want engagement in our meetings. Everybody’s busy, everybody’s got a busy schedule and creating presentations is a lot of task for some people, and sometimes you don’t get the topics right. So what I wanted was a group where we can communicate, talk about problems, give each other ideas, listen to each other, and even talk about other technologies, ’cause there is more than … There’s many technologies as web developers, you know. It’s not just one thing anymore; you need a whole tool belt of things to do that make your life even easier and workflow that we all learn from each other.
Michael Smith: And how could listeners found the South Florida User Group if they were interested to check that out?
Giancarlo G: You can find us on Facebook, at facebook.com/cfugsfl; that’s S-F-U-G SFL. We’re also online at cfug.sfl.org, and we … You can find us at Meetup, and now you kinda got me on …
Michael Smith: Meetup.com/south-florida-coldfusion-users-group, and we’ll put all those links in the show notes for this episode, so it’s easier for folks to find them.
And if people wanted to find you, what’s the best way for them to connect with you?
Giancarlo G: Well, with me, it’s easy. Even though I go by JC, my first name and last name is how you want to find me. If you want to find me on Twitter, my hashtag is @GiancarloGomez. If you want to look at my GitHub, likewise: GiancarloGomez. If you want to talk to me on Facebook, again, it’s Giancarlo Gomez, so … And if you want to email me, email@example.com. I’m pretty at responding, so if you want to reach out, I’m here to help.
Michael Smith: Excellent. Thanks so much for being with us on this episode, and good luck on your presentation.
Giancarlo G: Thank you very much. Looking forward to seeing everybody.