Slackbot 개발팀 스터디 - 2

SSO·2022년 4월 23일
JavaScriptnode.jsslackslackbotweb멋쟁이사자처럼
0

LikeLion10th

목록 보기
10/16

오늘의 내용은 ~ !
- 슬랙봇이란?
- 슬랙봇의 기본 원리
- API
- 제네릭

슬랙봇이란?

특정 이벤트가 발생 시 그에 맞는 유저 동작이나 알림을 컴퓨터가 자동으로 하는 것

슬랙봇의 원리

특정 입력을 하면 메세지가 출력되는 기능에 대해 알아봅시다!

  1. 슬랙봇을 생성하기 위한 생성자 함수 호출부
import {App} from "@slack/bolt"
import "dotenv/config";

const app = new App({
  token: process.env.SLACK_BOT_TOKEN,
  signingSecret: process.env.SLACK_SIGNING_SECRET,
  socketMode: true,
  appToken: process.env.SLACK_APP_TOKEN,
  port: Number(process.env.PORT) || 3000,
});
  • App : 슬랙봇을 생성하기 위한 생성자, 즉 틀역할을 한다!
  • 이 App이라는 틀에는 token, signingSecret,soketMode,appToken,port를 key로 넣어준다.
  • 그러면 app이라는 이름의 봇이 생성되는 것.
  • 이제 app이라는 인스턴스(생성자 함수로 만든 객체)를 가지고 이런저런 기능을 만들면 된다~!

이렇게 봇을 생성했으니 간단한 기능으로 메시지를 입력받아 랜덤 숫자를 반환해주는 기능을 만들어보자!

// 랜덤 값 생성
const randomInteger = (): Number => {
  return Math.floor(Math.random() * 101 + 1);
};

// 메시지 입력 시 say안에 있는 내용 출력
app.message("number!", async({say}) => {
  // dice라는 변수는 randomInteger로 반환받은 숫자
  const dice = randomInteger();
  // say함수는 채널에 메시지를 보냄 
  await say(`숫자는 ${dice}입니다!`);
});

message?

  • app.message(...);
    - app은 생성자로 만든 인스턴스!
    • app에는 message라는 기능이 있음
      ex) 자동차 안에는 음성안내 기능이 있다.
    • say : 메시지를 받으면 응답
      ex) 음성안내 기능에는 say라는 속성이 있는 것
  • async/await : await 함수명의 실행이 끝날 때 까지 그 아래는 실행X

그럼 이 모든걸 어떻게 실행할까??-??

즉시 실행 함수

(async () => {
  await app.start(Number(process.env.PORT) || 3000);
  console.log("Good");
})();
  • app의 기능 중 하나인 start 기능 실행
  • async/await이기 때문에 app.start가 실행되기 전까지는 이후 코드가 실행X

즉시 실행 함수 ?-?
- 함수의 정의와 동시에 호출되는 함수
- 단 한 번만 호출되고 다시 호출될 수 x
- 즉시 실행 함수는 익명 함수를 사용하는 것이 일반적!

API란?

💡 Application Programming Interface, 프로그램들이 서로 상호작용하는 것을 도와주는 매개체.

API 역할

  • API는 서버와 데이터베이스 사이의 출입구역할.
    → 데이터베이스에는 다양한 데이터들, 정보가 저장된다. 모든 사람들이 이 데이터베이스에 접근하면 안돼!!!!!! 따라서 API는 이를 방지하기 위해 서버와 데이터베이스 사이의 출입구 역할을 하며 허용된 사용자들에게만 접근성을 부여한다.
  • API는 애플리케이션과 기기가 원활하게 통신할 수 있도록 한다.
    - 애플리케이션 ?-?
    : 우리가 흔히 알고 있는 스마트폰 어플이나 프로그램
    • API는 애플리케이션과 기기가 데이터를 원활히 주고받을 수 있도록 돕는 역할을 한다.
  • API는 모든 접속을 표준화한다!
    → API는 모든 접속을 표준화하기 때문에 기계, 운영체제 등과 상관없이 누구나 동일한 엑세스를 얻을 수 있다! 즉 API는 범용 플러그처럼 작동!

API의 유형

  1. private API
    : private API는 내부 API로 주로 회사에서 내부적으로 발행. 제 3자에게 노출X
  2. public API
    : 개방형 API로 모두에게 공개되고 누구나 제한 없이 사용할 수 있다! 주로 우리가 사용하는 API들은 대부분 public API.
  3. partner API
    : partner API는 기업이 데이터 공유에 동의하는 특정인들만 사용할 수 있다. 주로 비즈니스 관계에서 사용되는 편이고 종종 파트너 회사 간에 소프트웨어를 통합하기 위해 사용.

API의 이점

→ private API를 사용할 경우 개발자들이 애플리케이션 코드를 작성하는 방법을 표준화함으로써 간소화되고 빠른 프로세스 처리를 가능하게 한다!

API 찌르기

찌르기란?-?
API를 찌른다는 것은 데이터를 호출해 응답을 받아오는 것을 의미!

  1. async / await
    async/await에 대한 설명은 위에서 간략히 했으니 생략.
async function request() {
  const response = await fetch('https://api.github.com/orgs/nodejs',
  {
    method: 'GET',
  });
  const data = await response.json();
  console.log(data);
}
request();
  1. Promise
function request() {
  fetch('https://api.github.com/orgs/nodejs', {
    method: 'GET',
  })
  .then(response => {
    return response.json();
  })
  .then(data => {
    console.log(data);
  });
}
request();

제네릭

제네릭이란?
제네릭이란 데이터의 타입을 일반화한다는 것을 의미. 제네릭은 자료형을 정하지 않고 여러 타입을 사용할 수 있게 해준다. 이는 선언 시점이 아니라 생성 시점에 타입을 명시하여 하나의 타입만이 아닌 다양한 타입을 사용할 수 있도록 하는 기법. 한 번의 선언으로 다양한 타입에 재사용이 가능하다는 장점이 있다~! 제네릭을 사용하면 따로 타입 변환을 할 필요가 없어 서능 향상 Good!

  • 기본적인 제네릭 사용법
const example = <T>(arg: T):T => {
  return arg;
}

여기서 <T>는 Type의 약자로 제네릭을 선언할 때 T를 관용적으로 사용한다.
위의 예시에서 example은 T라는 타입 변수를 가지게 된다.
그리고 arg와 반환값의 타입은 T라는 타입변수로 동일하다.

위의 예시를 좀 더 활용해보면

const example = <T>(arg: T[]):T[] => {
  console.log(arg.length);
  return arg;
}

이제 이 함수는 T라는 변수 타입을 받고 파라미터로는 배열 형태의 T를 받는다.
example([1,2,3])이런 식의 형태로 사용할 수 있다.

  • 두 개 이상의 제네릭 사용하기
const example2 = <T, U>(v: T, u: U):[T, U] => {
  return [v, u];
}

두 변수의 타입이 다를 경우 두 가지의 타입 변수가 필요하다.
이런 경우 관용적으로 사용하는 T 다음으로 오는 알파벳을 순서대로 사용한다.

  • 제네릭 예시
  1. 파라미터 변경

잘못된 예시

function logTextLength<T>(text: T): T {
	console.log(text.length);
	return text;
}
logTextLength('hi');

위의 코드의 경우 length 부분에 T 형식에 length속성이 없기 때문에 error!

💡올바른 예시

function logTextLength<T>(text: T[]): T[] {
console.log(text.length);
text.forEach(function(text) {
		console.log(text);
	});
	return text;
}
logTextLength<string>(['hi', 'abc', 'def']);
  1. 정의된 타입 이용
interface LengthType {
  length: number;
}
function logTextLength<T extends LengthType>(text: T): T {
  text.length;
  return text;
}
logTextLength("abc"); // 가능
logTextLength(10); // '10' 형식의 인수는 'LengthType' 형식의 매개 변수에 할당될 수 없습니다.ts(2345)
logTextLength({ length: 10 });
  1. keyof
interface ShoppingItem {
  name: string;
  price: number;
  stock: number;
}

function getShoppingItemOption<T extends keyof ShoppingItem>(itemOption: T): T {
  return itemOption;
}
getShoppingItemOption(10); //'10' 형식의 인수는 '"name" | "price" | "stock"' 형식의 매개 변수에 할당될 수 없습니다.ts(2345)
getShoppingItemOption<string>('a'); // 'string' 형식이 '"name" | "price" | "stock"' 제약 조건을 만족하지 않습니다.ts(2344)

getShoppingItemOption('name'); // OK
profile
SSO
Github_qkrthdus605
이전 포스트

Slackbot개발팀 스터디 - 1

다음 포스트

Backend Session -1

0개의 댓글