# Card | Slack Integration

Purpose of this tutorial

This tutorial is meant to help you achieve **2 things as quickly as possible** so that you can grasp the absolute basics of Investec’s Programmable Banking feature:

1. Join OfferZen Community [Slack](https://investec-dev-com.slack.com/archives/C065W2RTUFN) so that you can send a message to an external system
2. Send a message to Slack from Investec Programmable Banking when you simulate a transaction to get a feel for how it works

## The challenge

### Step 1: Join [`#rooty`](https://investec-dev-com.slack.com/archives/C065W2RTUFN) on Investec Developer Community Slack

### Step 2: Open Investec Programmable Banking

Log in to your online banking and select the Investec Developer option, under the Manage tab.

<figure><img src="https://1041073753-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FvM15O0U8oNHeEpNUrGSS%2Fuploads%2FPVbl49zk1wbkwR3KUyH1%2FStep%201%20.png?alt=media&#x26;token=1b74a0f9-747e-4d1b-a191-373a1a573398" alt=""><figcaption></figcaption></figure>

### Step 3: Select the card you want to code

> ProTip: You can enable and disable the code on each card using the toggle below the cards.

* You can also use the mobile app to do that by tapping on your account, then on cards, and there you will see a toggle for programmable banking.
* 💡 Often people forget they added code that blocks transactions, and their card is declined at the shops and they call the call centre - so if your card declines at the shop, remember that you can disable your code from the mobile app.

<figure><img src="https://1041073753-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FvM15O0U8oNHeEpNUrGSS%2Fuploads%2F71cC5H5xhmx451MBUZzF%2FScreenshot%202024-12-09%20152759.png?alt=media&#x26;token=273d04a7-1f80-453a-9b02-4046e1635ae9" alt=""><figcaption></figcaption></figure>

### Step 4: Setup your `main.js` file

Replace all the code in your `main.js` file in the editor [with this code](https://gitlab.com/offerzen-community/investec-programmable-banking/programmable-card-starter-challenge/-/raw/master/main.js). Make sure you *Deploy code to card* when you're done.

![](https://1041073753-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FvM15O0U8oNHeEpNUrGSS%2Fuploads%2Fgit-blob-66d9130150ee796bcf3ffdf75c49a8f3e5341a3d%2Ftut3?alt=media)

> ProTip: Transaction log history

* On the right-hand side, near the top of the screen, you will see “Event logs” you can click on that to get a history of transactions that you made with code enabled and the logs of those transactions - you can click on it to see this.
* You will notice you have simulator logs and production logs.
* Simulation transactions are fake transactions like the one we just ran, which you can use for testing.
* Production transactions are the real transactions you make when you use your card.

### Step 5: Setup your `env.json` file and add your Slack ID

Get your Slack ID from the Investec Developer Community Slack:

<figure><img src="https://1041073753-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FvM15O0U8oNHeEpNUrGSS%2Fuploads%2FJb90a5L3Z4cNxYCjfHYo%2FScreenshot%202024-04-30%20at%2013.59.12.png?alt=media&#x26;token=87b41a1f-3f2d-42e1-bb0a-0a30c57582e1" alt="" width="337"><figcaption></figcaption></figure>

Now replace all the code in your `env.json` file [with this code](https://gitlab.com/offerzen-community/investec-programmable-banking/programmable-card-starter-challenge/-/raw/master/env.json) in the editor, and replace `YOUR_SLACK_ID_HERE` with **your actual Slack ID**. Deploy your code to card when you're done:

![](https://1041073753-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FvM15O0U8oNHeEpNUrGSS%2Fuploads%2Fgit-blob-2129b443871d53da04fd0384704c96292857d40c%2Ftut6?alt=media)

### Step 6: Simulate a transaction in the programmable banking app!

![](https://1041073753-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FvM15O0U8oNHeEpNUrGSS%2Fuploads%2Fgit-blob-b1db8e39f579eaf773a6f9c17cfc5dfbda5e8801%2Ftut7?alt=media)

### Step 7: Celebrate when you see your notification on the Investec Developer Community Slack \o/

![Example feed :)](https://1041073753-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FvM15O0U8oNHeEpNUrGSS%2Fuploads%2Fgit-blob-89ab449496df0c971d78291d27bb839d8f146396%2FScreenshot%202022-04-08%20at%2009.43.37.png?alt=media)

### <mark style="color:red;">**NB**</mark> Step 8: Delete/edit your code

This code is now live on your card. Please make sure you clear it out or delete it to ensure that your live transactions aren't posted into [`#rooty`](https://investec-dev-com.slack.com/archives/C065W2RTUFN)`.`