DEV Community: Isak Solheim

Moving to Berlin using ChatGPT and JavaScript

Isak Solheim — Mon, 11 Dec 2023 09:24:46 +0000

TLDR: I built a bot that automatically sends personalized, context-aware messages to every new listing posted on wg-gesucht.de. The bot found me a flat in Berlin!

If you’re interested in the technical side of this project, feel free to dig through the code while reading this article!

Intro

As my exchange semester at Technische Universität Berlin approached, I started looking for places to live. Without an existing network in Berlin, I used the website wg-geuscht.de to contact potential flatshares. This was a very repetitive process, and I decided to automate it.

Automate the Boring Stuff with JavaScript

I set up email alerts for all new potential flats in my price range on wg-gesucht.de, and used Google Clouds Pub/Sub service with a push subscription to watch for any incoming email to my Gmail inbox.

Once a new email arrives, the service sends a webhook notification to my server.

Parsing the email

On the server, written in JavaScript with Express, I read the latest email in my Gmail inbox and parse it with Regex to see if the email contains links to any wg-geuscht listings.

Navigating the listing

For each listing, I spawn a chromium browser using Playwright, an end-to-end testing framework. This allows me to navigate the website just as one would when interacting with it themselves. I sign into my account, take note of the listing description, and hit send message.

Generating a message using GPT-3.5 Turbo

The message is generated using GPT-3.5 Turbo with the following prompt:

const prompt = `
Can you spice up the following text: "${starterText}"
The updated text should explain why I would fit in the
flatshare with the following listing text: "${listingText}".
Add some emojies as well. Mention that my semester is from
September to March, so a stay for that perioud would be ideal
(but Im always flexible)! And if the listing is written in
German, the answer should be in German as well. And if the 
listing says I need to say a specific word, start the whole 
text with that word!
`;

The generated message was sent alongside a couple of images of myself.

The result

The time it took from a listing went live to my bot had sent a response was around 10 seconds, making me confident in being the first responder. This was the response that secured me a flat:

Hallo zusammen! 🦄

Das scheint ja eine richtig coole WG zu sein, in die ich perfekt reinpassen würde! 😄

Ich bin Isak und ich glaube, dass ich perfekt in dein WG-Zimmer passen würde! Mein Semester in Berlin geht von September bis März, also wäre ein Aufenthalt für diesen Zeitraum ideal (aber ich bin auch immer flexibel!). Die Lage der Wohnung klingt super, besonders die Nähe zum RAW-Gelände und zum Boxhagener Platz. Und hey, eine Tram-Station direkt vor der Tür ist auch genial! 🚋

Die Wohnung hört sich toll an, mit Balkon, Badewanne und Waschmaschine. Da fühlt man sich doch gleich wie zuhause! Wenn du Interesse hast, würde ich mich freuen, von dir zu hören. 📞

Liebe Grüße und hoffentlich bis bald!

Isak

P.S. Wenn die Anzeige auf Deutsch ist, dann antworte ich auch gerne auf Deutsch. Aber sei gewarnt, mein Deutsch ist manchmal etwas holprig. Ich verstehe nur Bahnhof! 😄

Closing thoughts

Looking back, I spent more time tinkering with the bot than I would have manually responding to email notifications. But with that being said, I am happy with how this project turned out. I got a lot of laughs from the silly responses the bot would send, and the frequency of people getting back to me was noticeably increased (most likely because I was their first responder).

I recently tried spinning the bot up again, but since my search in June, captcha verification has been implemented on their site. This may be for the better. For all I know many of the listings themselves were created using ChatGPT.

Creating a Slackbot With JavaScript Bolt

Isak Solheim — Fri, 08 Dec 2023 14:58:06 +0000

Creating a SlackBot that reacts to every message sent by a specific user.

Creating a New Slack App

The first thing we have to do is create a new slack app. We do this by navigating to api.slack.com and navigating to Your Apps -> Create New App.

We’ll call our app reacting-bot. Next up, we have to set up event subscriptions, a bot user, and permissions.

Socket Mode

The first thing we have to do is enable Socket Mode. Turning on Socket Mode will route your app’s interactions and events over a WebSockets connection instead of sending these payloads to different Request URLs.

To enable Socket Mode, navigate to Settings -> Socket Mode and hit Enable Socket Mode. You will be prompted to add scopes and generate an app-level token. Give the token a name, e.g., “token”, and add the following scopes:

connections:write & authorizations:read

As the names suggest, these will give our app permission to read and write messages.

Event Subscriptions

Next up, we need to enable Event Subscriptions, which can be found beneath Features in the left-side menu. After enabling Event Subscriptions, you will need to add the following Event Subscriptions.

Subscribe to bot events: message.groups
Subscribe to event on behalf of users: message.channels

Bot User

If a Bot User has not yet been created, it can be set up on the App Home tab. Here we can set a display name and its username.

Permissions

Lastly, we need to ensure that the SlackBot has all the correct permissions needed. Head over to OAuth & Permissions and add the reactions.write permission to the Bot Token Scopes.

We have now set up the SlackBot, and we are ready to start coding!

Writing The Bot

We will be using the bolt-js library as an interface to the Slack API. It comes with many useful features that make creating SlackBots a breeze.

While in a new directory reacting-bot, we can initialize the project using npm init -y. This will create a package.json file that looks like the following:

{
  "name": "reacting-bot",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

For this project, we are going to need two packages. @slack/bolt and dotenv. Bolt is an interface that we use to communicate with the Slack API, and dotenv is used to access environment variables. We can install the packages with the following command:

npm install @slack/bolt dotenv

Next up, we need to create the file .env which should store our environment variables for when we are running this project locally. The file should contain the following:

SIGNING_SECRET=5c24e...
TOKEN=xoxb-...
APP_TOKEN=xapp-...
USER_ID=UCF8...

SIGNING_SECRET can be found on the Basic Information page
TOKEN (xoxb) can be found on the OAuth & Permissions page
APP_TOKEN (xapp) can be found on the Basic Information page under App-level tokens
USER_ID can be found when viewing a slack profile under More

In index.js, we start by importing @slack/bolt and dotenv, and we initialize a bolt application in socket mode in the constant app:

const { App } = require("@slack/bolt");
require("dotenv").config();

const app = new App({
  signingSecret: process.env.SIGNING_SECRET,
  token: process.env.TOKEN,
  socketMode: true,
  appToken: process.env.APP_TOKEN,
});

We then write the logic that uses the message() method to attach a listener for messages.

app.message(async ({ message, context }) => {
  if (message.user === process.env.USER_ID) {
    try {
      const result = await app.client.reactions.add({
        token: context.botToken,
        name: "heavy_plus_sign",
        channel: message.channel,
        timestamp: message.ts,
      });
    } catch (error) {
      console.error(error);
    }
  }
});

We check any given message is sent by the user with the ID USER_ID. If we find a match, we use the app.client.reactions.add() function to add a reaction to the message.

Lastly, we add a function that runs when the application starts. This function will start up the Slack App:

(async () => {
  const port = process.env.PORT || 3000;
  await app.start(port);
  console.log(`⚡️ reacting-bot is running on port ${port}`);
})();

And that’s it! You can now run the app using the npm start command, and the bot will start reacting to messages once it has been added to the correct channels.

This is what the final code looks like:

const { App } = require("@slack/bolt");
require("dotenv").config();

const app = new App({
  signingSecret: process.env.SIGNING_SECRET,
  token: process.env.TOKEN,
  socketMode: true,
  appToken: process.env.APP_TOKEN,
});

app.message(async ({ message, context }) => {
  if (message.user === process.env.USER_ID) {
    try {
      const result = await app.client.reactions.add({
        token: context.botToken,
        name: "heavy_plus_sign",
        channel: message.channel,
        timestamp: message.ts,
      });
    } catch (error) {
      console.error(error);
    }
  }
});

(async () => {
  const port = process.env.PORT || 3000;

  await app.start(port);

  console.log(`⚡️ reacting-app is running on port ${port}`);
})();

Thanks for checking out this guide! You can view the code for this project on my GitHub.