Handleiding: hoe een eenvoudige bot voor Telegram te maken met JS voor beginners in programmeren

Ik ben drie weken geleden begonnen met het verkennen van de IT-wereld. Serieus, drie weken geleden begreep ik zelfs de syntaxis van HTML niet, en mijn kennismaking met programmeertalen eindigde met het schoolprogramma voor Pascal van tien jaar geleden. Maar ik besloot naar een IT-kamp te gaan, waar het voor kinderen leuk zou zijn om een bot te maken. Ik dacht dat het waarschijnlijk niet zo moeilijk zou zijn.

Hier begon mijn lange reis, waarin ik:

• een cloudserver met Ubuntu heb opgezet,
• me heb geregistreerd op GitHub,
• de basis syntaxis van JavaScript heb geleerd,
• een berg artikelen in het Engels en Russisch heb gelezen,
• uiteindelijk een bot heb gemaakt,
• en deze artikel heb geschreven, eindelijk.

Het eindresultaat zag er ongeveer zo uit:

Ik zal meteen zeggen, dit artikel is voor beginners — om gewoon te begrijpen hoe je elementaire dingen vanaf nul kunt doen.

En ook voor gevorderde programmeurs — gewoon om ze een beetje te vermaken.

1. Hoe schrijf je code in JS?

Ik begreep dat ik in ieder geval eerst de syntaxis van de taal moest begrijpen. De keuze viel op JavaScript, gewoon omdat de volgende stap voor mij het maken van een applicatie in ReactNative was. Ik begon met een cursus op Codecademy en was enorm enthousiast. De eerste 7 dagen gratis. Echte projecten. Aanbevolen. Het duurde ongeveer 25 uur om het te doorlopen. In werkelijkheid was niet alles heel nuttig. Zo ziet de structuur van de cursus eruit en hier is gedetailleerd het eerste blok.

2. Hoe registreer je een bot?

In het begin hielp deze dit artikel van een zekere Archakov me enorm. Hij legt de basis duidelijk uit. Maar het belangrijkste is dat er een handleiding voor het registreren van een bot is. Ik kan het niet beter schrijven, en omdat dit het makkelijkste deel is, zal ik het gewoon kort samenvatten. Je moet een bot maken en zijn API krijgen. Dit gebeurt via een andere bot — @BotFather. Zoek hem in Telegram, schrijf hem, volg de eenvoudige stappen en ontvang (bewaar!) de API-sleutel (dit is een reeks cijfers en letters). Ik heb het later gebruikt.

3. Hoe ziet de code van de bot eruit?

Na langdurig artikelen bestuderen, begreep ik dat het beter was om een bibliotheek (externe code in moduleformaat) te gebruiken, zodat ik niet hoefde te worstelen met het leren van de Telegram API en het vanaf nul schrijven van grote stukjes code. Ik vond het framework telegraf, dat op de een of andere manier met npm of yarn moest worden verbonden. Zo begreep ik destijds de opzet van de bot. Maak je geen zorgen om te lachen. Ik neem het je niet kwalijk. Het meest waardevolle bij het verder creëren van de bot waren de voorbeelden aan de onderkant van de pagina:

3. Hoe maak je je eigen cloudserver voor 100 roebel

Na lang zoeken begreep ik dat het commando 'npm' uit de afbeelding hierboven betrekking heeft op de opdrachtprompt. De opdrachtprompt is overal, maar om deze uit te voeren, moet je NodePackageManager installeren. Het probleem was dat ik programma's schreef op een PixelBook met ChromeOS. Ik laat hier een groot stuk weg over hoe ik Linux leerde kennen — voor de meeste mensen is dat nutteloos. Als je Windows of een MacBook hebt, heb je al een console.

Kortom, ik installeerde Linux via Crostini.

Echter, tijdens het proces realiseerde ik me dat ik een cloudserver nodig had voor de constante werking van de bot (en niet alleen wanneer mijn computer aan staat). Ik koos voor vscale.io Ik storte 100 roebel, kocht de goedkoopste Ubuntu-server (zie afbeelding).

4. Hoe de server voor het draaien van de bot voor te bereiden

Daarna begreep ik dat ik op de server een map moest maken waarin ik het bestand met de code zou plaatsen. Hiervoor typte ik in de console (direct op de website activeren met de knop 'Open console')

mkdir bot

bot — это стало название моей папки. После этого я установил npm и Node.js, что позволит запускать мне потом код из файликов с разрешением *.js

sudo apt update
sudo apt install nodejs
sudo apt install npm

Ik raad ten zeerste aan om op dit punt verbinding met de server in te stellen via je eigen console. Hier is handleiding Dit stelt je in staat om direct met de server te werken via de console van je computer.

5. Hoe de code voor de eerste bot te schrijven.

En nu is het een eye-opener voor mij. Elke programma is gewoon een reeks teksten. Je kunt ze overal invoeren, opslaan met de juiste extensie en dat is alles. Je bent geweldig. Ik heb gebruikt Atom, maar je kunt eigenlijk gewoon in de standaard notepad schrijven. Het belangrijkste is om het bestand later met de juiste extensie op te slaan. Het is als het schrijven van tekst in Word en opslaan.

Ik maakte een nieuw bestand, waarin ik de code uit het voorbeeld op de telegraf-pagina plakte en opsloeg als index.js (het is niet nodig om het bestand zo te noemen, maar het is gebruikelijk). Belangrijk — vervang BOT_TOKEN door je eigen API-sleutel uit het tweede punt.

const Telegraf = require('telegraf')

const bot = new Telegraf(process.env.BOT_TOKEN)
bot.start((ctx) => ctx.reply('Welkom!'))
bot.help((ctx) => ctx.reply('Stuur me een sticker'))
bot.on('sticker', (ctx) => ctx.reply(''))
bot.hears('hi', (ctx) => ctx.reply('Hey daar'))
bot.launch()

6. Hoe de code op de server te uploaden via github

Nu moest ik deze code op een server plaatsen en uitvoeren. Dit werd een uitdaging voor me. Uiteindelijk, na veel inspanning, besefte ik dat het eenvoudiger zou zijn om een bestand op GitHub te maken, dat het mogelijk maakt om de code bij te werken via de opdracht in de console. Ik heb een account aangemaakt op github en heb nieuw project, waar ik het bestand heb geüpload. Daarna moest ik begrijpen hoe ik de bestanden van mijn (open!) account naar de server in de map bot kon uploaden (als je eruit bent gegaan — typ gewoon cd bot).

7. Hoe bestanden uploaden naar de server via GitHub deel 2

Ik moest een programma op de server installeren dat bestanden van git zou uploaden. Ik heb git op de server geïnstalleerd door de opdracht in de console in te voeren

apt-get install git

Daarna moest ik de upload van bestanden configureren. Hiervoor typte ik in de opdrachtregel

git clone git://github.com/b0tank/bot.git bot

В итоге все из проекта загрузилось на сервер. Ошибкой на данном этапе было, что я, по сути, сделал вторую папку внутри уже существующей папки bot. Адрес до файла выглядел как */bot/bot/index.js

Ik besloot dit probleem te negeren.

En om de telegraf-bibliotheek te laden, die we in de eerste regel van de code aanvragen, voer je de volgende opdracht in de console in.

npm install telegraf

8. Hoe de bot te starten

Hiervoor, terwijl je in de map met het bestand bent (om tussen de mappen in de console te navigeren — voer de opdracht in het formaat cd bot Om er zeker van te zijn dat je daar bent waar je moet zijn, kun je het commando invoeren, dat alle bestanden en mappen die daar zijn toont ls -a

Om de bot te starten, typte ik in de console

node index.js

Als er geen fout is — alles is goed, de bot werkt. Zoek hem in Telegram. Als er een fout is — gebruik je kennis uit punt 1.

9. Hoe de bot op de achtergrond te starten

Je zult snel begrijpen dat de bot alleen werkt wanneer je zelf in de console zit. Om dit probleem op te lossen, gebruikte ik de opdracht

screen

Daarna verschijnt er een scherm met een bepaalde tekst. Dit betekent dat alles goed is. Je bent op een virtuele server in de cloud. Om beter te begrijpen hoe dit alles werkt — hier is een artikel. Ga gewoon naar je map en voer de opdracht voor het starten van de bot in

node index.js

10. Hoe de bot werkt en hoe je de functionaliteit kunt uitbreiden

Wat kan onze bot uit het voorbeeld? Hij kan

bot.start((ctx) => ctx.reply('Welcome!'))

zeggen 'Welcome!' op het moment van starten (probeer de tekst te veranderen)

bot.help((ctx) => ctx.reply('Send me a sticker'))

bij het standaardcommando /help het bericht 'Send me a sticker' sturen

bot.on('sticker', (ctx) => ctx.reply(''))

bij een sticker goedkeuring sturen

bot.hears('hi', (ctx) => ctx.reply('Hey there'))

antwoorden met 'Hey there', als iemand 'hi' schrijft
bot.launch()

Als je naar de code kijkt op github, dan zult u snel begrijpen dat ik niet ver van deze functionaliteit ben afgedwaald. Wat actief wordt gebruikt, is de functie ctx.replyWithPhoto Het stelt in staat om de opgegeven foto of gif te sturen als reactie op een bepaalde tekst.

Een aanzienlijk deel van de code is geschreven door kinderen van 11-13 jaar, aan wie ik toegang tot de bot heb gegeven. Zij hebben hun eigen user-case ingevoerd. Ik denk dat het gemakkelijk is om te bepalen welk deel door hen is gemaakt.

Bijvoorbeeld, op het bericht ‘jake’ komt een gif met een bekend personage uit de cartoon Adventure Time.

Om de bot verder te ontwikkelen, moet je kijken naar voorbeelden van hoe je een toetsenbord kunt aansluiten, bijvoorbeeld, hier

11. Hoe de code bij te werken en de bot opnieuw op te starten

Vergeet niet dat je de code niet alleen op github, maar ook op de server moet bijwerken. Dit is eenvoudig te doen: stop de bot (druk op ctrl+c),

— voer in de console in terwijl je in de doelmap bent, git pull
— start de bot opnieuw met het commando node index.js

EINDE

Veel dingen die in dit bestand worden beschreven, zullen super vanzelfsprekend zijn voor gevorderde programmeurs. Echter, toen ik zelf probeerde om in één keer de kloof naar de wereld van bots te overbruggen, miste ik zo'n gids enorm. Een gids waarin de voor de hand liggende en eenvoudige dingen voor elke IT-specialist niet worden overgeslagen.

In de toekomst ben ik van plan om een post te maken over hoe je je eerste applicatie in ReactNative kunt maken in dezelfde stijl, abonneer je!

Bron: habr.com