paint-brush
How to Build a QR Code Generator for Slack with Just 7 Lines of Codeby@threesided
1,496 reads
1,496 reads

How to Build a QR Code Generator for Slack with Just 7 Lines of Code

by Scott GambleAugust 22nd, 2020
Read on Terminal Reader
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

How to Build a QR Code Generator for Slack with Just 7 Lines of Code reads: How to build a QR code with just 7 lines of code. The QR code generator is set up to respond to the request to convert a temporary URL in Slack, followed by the URL you want to convert. This QR code image is then directly uploaded to your Slack channel using the slack channel. Once that's complete, your new Slack command app is live! Now you too can rick roll your friends in style.

Companies Mentioned

Mention Thumbnail
Mention Thumbnail

Coin Mentioned

Mention Thumbnail
featured image - How to Build a QR Code Generator for Slack with Just 7 Lines of Code
Scott Gamble HackerNoon profile picture

Hey, remember QR Codes?

Those weird, glitchy little blocks that you can scan with your phone seem to be more popular than ever these days. Given our need for a more "hands off" approach to sharing information, some might even argue they're now an everyday essential!

Well, thanks to services like Autocode, you can set up a super simple Slack app that can generate QR codes for you and automatically upload them to your Slack channel.

TL;DR (30 seconds)

In just 30 seconds you could have this QR code generator up and running. There's admittedly a little hand-waving; Autocode as a platform will automatically handle authentication and deployment for you. But that's kinda the point! You get to focus on the API to API code that matters and leave the undifferentiated heavy-lifting of app-to-app authentication to the platform — the same way we once gave up server towers for cloud-based VM and container management.

How it Works

This Source is set up to respond to the

/cmd qr
command in Slack, followed by the URL you want to convert. For example, in any channel you can write
/cmd qr http://www.threesided.ca/
to automatically generate a QR code from the link.

This command uses the qrcode.generate API Connector, making the whole process a breeze!

// Convert temporary URL to QR Code
let qrCode = await lib.qrcode.generate['@0.0.3']({
  text: result.tempURL.link_url,
});

This QR code image is then directly uploaded to your Slack channel using the slack.channels.files.create method

// Upload the QR Code image to Slack
result.upload = await lib.slack.channels['@0.7.2'].files.create({
  filename: `qr-code.png`,
  channels: [
    `${event.channel_id}`,
  ],
  content: qrCode,
  title: `QR Code`,
});

Getting Started

There are two really easy steps to get started with this.

Step 1: Fork the Source in Autocode

Click on: https://autocode.com/src/slack/slack-qr-code/ to view and fork the Source Code for this project.

Step 2: Link your Slack Account

Once the project is forked you'll be brought to the Autocode editor. In the bottom right of the editor is a red button, indicating that you need to connect your slack account.

There are two possible ways (simple, using the Autocode app, or more involved using your own app). I recommend you use the simple slack app account linking flow for the Source.

The link account modal will provide you a detailed walkthrough on linking your Slack account. Once you've finished with those instructions, the last step is to deploy your project!

Step 3: Deploy your Forked Project

On the bottom left of the Autocode editor screen is a **Deploy** button.

Clicking that will bring up a deployment progress modal. Once that's complete, your new Slack command app is live! Now you too can rick roll your friends in style. 😎

Once you're happy with how everything is working, you can create a release from your Autocode Manage Dashboard.

You'll be prompted to link a production slack account and give your release a version via the release modal.

That's it!

Thanks for checking out this Source! Follow the Autocode team on Twitter @AutocodeHQ for updates. If you have any questions, feel free to reach out to me directly at [email protected]

Previously published at https://dev.to/threesided/create-a-qr-code-generator-for-slack-in-7-lines-of-code-3a5f/edit