Real-time Chat Blog

Mobile Group Chat with One Line of JavaScript

2 min read Michael Carroll on Jun 5, 2014
Try PubNub Today

Free up to 1MM monthly messages. No credit card required.

Subscribe to our newsletter

By submitting this form, you are agreeing to our Terms and Conditions and Privacy Policy.

We'll show you how to build a mobile group chat application in one line of JavaScript. Tutorial and demo…

Waving Hand

Good News! We’ve launched an all new Chat Resource Center.

We recommend checking out our new Chat Resource Center, which includes overviews, tutorials, and design patterns for building and deploying mobile and web chat.

Take me to the Chat Resource Center →

One of our first and most popular blog posts is Chat in 10 Lines of Code. In my constant quest to outperform PubNub founder and CTO Stephen Blum, I decided to challenge myself to create a mobile group chat demo that was responsive and ready for mobile in just one line of JavaScript.

mobile group chat

Yes, that’s right…with one line of code you’ll get a mobile group chat app that looks like this:

Today, I’m happy to announce the release of the PubStrapChat jQuery plugin. With this library you can add mobile group chat to your site, mobile or otherwise, with a single line of javascript:

The chat box drops right into any div on your page. It’s fully responsive and will look great on any mobile site with Bootstrap. Or, you can ditch Bootstrap and style it yourself.

You’ll first need to sign up for a PubNub account. Once you sign up, you can get your unique PubNub keys in the PubNub Developer Portal.

All the code you need to get started and an example is below:

See the Pen PubStrapChat by Ian Jennings (@ianjennings) on CodePen.

The PubStrapChat plugin can be extended to use your own PubNub API keys and even your own user authentication system. You can configure the plugin by using an options object.

Check out the documentation to get it working with your custom user system. You can even set it up to use third party authentication systems like Facebook.

More from PubNub

NPP and HIPAA: Notice of Privacy Practices Definition
Healthcare CategoryJan 6, 20235 min read

NPP and HIPAA: Notice of Privacy Practices Definition

A Notice of Privacy Practices (NPP) is one of the requirements of HIPAA and helps patients understand their personal data rights.

Michael Carroll

Michael Carroll

HIPAA Violation Examples
Healthcare CategoryJan 5, 20236 min read

HIPAA Violation Examples

HIPAA violations can be financially expensive and devastating to a brand. Examine some examples of HIPAA violations, and learn...

Michael Carroll

Michael Carroll

HIPAA Technical Safeguards: How To Protect Sensitive Data
Healthcare CategoryJan 5, 20236 min read

HIPAA Technical Safeguards: How To Protect Sensitive Data

HIPAA covered entities must follow the five technical safeguards to achieve HIPAA compliance and prevent data corruption.

Michael Carroll

Michael Carroll