In other posts we have investigated how to capture screen output in Chrome and built a screen sharing video chat application. There was one feature missing though. The Chrome extension made screen capture possible, but didn’t test whether it  had been installed before the application tried to use it. In this post we are going to build a Chrome extension that can be detected from the front end.

Getting set up

We’re going to use the extension we built for screen capture and add the functionality to make it detectable. We’ll then build an example to show handling the two cases, with and without the extension.

Download the source for the extension from the GitHub repo or by cloning the building-extension-detection branch

The extension

Open extension/extension.js and take a look ...

In recent posts we’ve seen how to capture a user’s screen in Chrome and Firefox. Now it’s time to combine this with a real video chat application and share screens as part of a video chat.

What we’re building

In this post we’ll take the Twilio Video quickstart application and add screen sharing to it. When we are done your application will let you make calls between browsers and share screens from one to the other.

What you’ll need

To build this application you will need a few things:

• A Twilio account – you can sign up for free here
• Node.js – we need to run a server to generate access tokens for the Twilio Video service
• The Chrome extension we built in the first post (if you didn’t follow this post, there will be a copy of the extension in the repo later ...

Sending a single SMS with Twilio is a relatively straightforward affair, but what if you had to send 10 messages? Or 10,000?

Imagine you’re an ice cream seller. You want to improve business by sending SMS alerts when you’re in your van so that your customers will know you’re on your way to deliver some sweet refreshment.

Look, I know what you’re thinking: “It’s December, hardly time for ice cream!” But, I’m in Melbourne right now enjoying a toasty 31°C Summer day so icy cold things are on my mind right now.

In this post we’ll look at how to work up from sending the first message to subscriber number 1 to up to 10,000 messages with Node.js.

Getting prepared

To follow along with this post and code the same features you’re going to need a couple of ...

If you’re building web applications with Ruby then you’re probably using Rails. Hanami is a young competitor focused on providing a full featured, modern web framework for Ruby developers that is fast, secure and flexible.

Hanami is a new web application framework for the Ruby community. It has been under development since 2014, initially under the name Lotus. Version 1 was released in April 2017 and version 1.1 was just recently released in October.

As the introduction to the Hanami guide says, “If you’ve ever felt you’re stretching against the ‘Rails way’, you’ll appreciate Hanami.” While this article isn’t a comparison of Hanami and Rails, as we build with Hanami you will see the ways in which they differ and be able to decide which approach you prefer.

Let’s investigate building a web application with Hanami with a tried and tested Twilio ...

Screen sharing is a hugely useful feature you can build into a video chat. We recently saw how to capture the screen using Chrome. Support in only one browser is not much fun so you’ll be pleased to hear we can access screen capture in Firefox too. Let’s see how.

What you need

• Firefox
• A text editor
• A local web server – I like to use servedir for things like this
• Either ngrok or an equivalent tunnelling service or TLS certificates set up for localhost (we’ll see why later)

Screen capture

It was not straightforward to implement screen capture for our own application with Chrome as we needed to build an extension. Firefox, on the other hand, has supported screen capture since version 33 using the mediaSource constraint in the mediaDevices API.

However, before Firefox version 52 your site needed to be on a whitelist to access screen ...

To build screen sharing capabilities into a WebRTC video chat application you must first be able to capture the content on screen. In this post we’re going to see how to access the screen capture capabilities of Google Chrome from within a web application.

What you need

In order to build this project you will need:

• Google Chrome
• A text editor
• A local web server – I like to use servedir for things like this

Screen sharing

As of right now, Chrome does not allow you to access the content of a screen via the mediaDevices API. There is a draft spec for a getDisplayMedia method but no browser has implemented it yet. Screen sharing on the web has many security concerns for the end user, so the browsers are handling this feature with concern.

What can we do right now then?

Well, in Chrome we can write a extension ...

“There has never been a major security incident caused by leaked npm credentials, but our security work is never finished.”

This wasn’t the headline that npm lead with when they announced their support for two factor authentication recently, but it was a line that stuck out to me. It is fantastic to see that these critical parts of the infrastructure of web development are taking security seriously.

But that’s only half the battle, it’s up to all of us to secure our accounts with 2FA now too. Once you are setup with 2FA you will need both a password and a device to generate a one time code in order to authenticate with npm. This makes it much harder for anyone to take over your account and more importantly your npm packages.

Without further ado, here’s how to secure your npm account with 2FA and Authy ...

If you ever need to contact your application’s users by phone then it’s good practice to verify that the phone number they enter is in fact theirs. Let’s see how to verify phone numbers in a Rails 5 application using the Authy Phone Verification API.

What you’ll need

To code along with this post, you’ll need:

• A Twilio account
• An Authy App which you can create in the Twilio console, you’ll need the API key
• Ruby and Rails installed, I am using the latest Rails 5.1.2 and Ruby 2.4.1

Getting started

Create a new Rails application for this project:

We need to add a couple of gems that we’ll use in the project, open up the Gemfile and add authy and envyable. Authy is going to be used for the phone verification, envyable ...

In under a month SIGNAL London will be upon us. Now in its second year we’ll have more talks, more hands on learning and, with the code, games and installations of $bash at the after party, more fun.

If that’s enough to get you excited, then go grab yourself a ticket and I’ll see you in London on the 19th September. Pop in the promo code PNASH20 and you’ll get 20% off the ticket price too.

If you need a little more convincing, let me share with you some of the sessions I’m most looking forward to.

What’s on the schedule?

If you’re new to Twilio then you won’t want to miss Nichole Wong and Devang Sachdev introducing what can you do with Twilio.

For the security conscious amongst you, we have B Byrne to tell us about the future of two ...