[잔디 커넥트] 휴가 신청, 알림, 조회까지 잔디로 간단하게 관리하기

🕑 리딩타임: 11

안녕하세요 잔디 CX(고객 경험) 팀입니다.
우리 멤버들의 휴가 신청과 관리, 알림, 조회 모두 어떻게 관리하고 계시나요?

잔디에서는 휴가 신청 양식의 구글 설문지 폼으로 [신청]만 하면, 구글 스프레드시트로 모든 멤버의 연차 신청을 [관리] 할 수 있어요!
또, 신청 후에는 바로 잔디로 휴가 신청 [알림]을 받아 볼 수 있고 멤버 모두 본인의 휴가를 [조회]할 수 있습니다.

 

 

휴가 신청부터 조회, 알림까지 잔디에서 모두 해결하는 잔디팀의 방법을 공개합니다.
콘텐츠가 조금 길지만, Step1~3만 활용하면 별도 휴가 시스템 없이 잔디로 해결할 수 있어요👍👍

[Step 1] 신청 / 관리 : 휴가 사용 신청서 양식 만들기

[Step 2] 알림 : 휴가 신청 토픽과 구글 스프레드시트 연동하기

[Step 3] 조회 : 멤버들이 직접 본인 휴가 조회하기

 

[Step 1] 휴가 사용 신청서 양식 만들기


1. 신청서 양식 만들기

  • 신청서 양식은 구글 설문지를 이용합니다. 각 팀에 맞춰서 필요한 항목들로 설문지를 만들어 주세요!

 

2. 신청서 양식 만들기

  • 휴가 신청서 항목들이 완성되었다면, [응답] 시트를 생성해요.
  • 기존 스프레드시트가 있다면 기존 스프레드시트를 사용해도 되고, 새 스프레드시트를 만들어도 됩니다.

  • [설정] 에서 이메일 주소 수집을 활성화하게 되면 휴가응답 구글시트에 이메일과 함께 수집됩니다.
  • Tip : 회사에서 자주 사용하는 URL을 모아보는 잔디 북마크 기능을 활용해 보세요!
            팀 멤버들이 휴가 신청서를 찾아야 하는 번거로움을 줄일 수 있어요. (*Enterprise 플랜에서 제공)

 

3. 연차 관리를 위한 응답 스프레드시트 확인하기

  • 휴가 신청서를 [신청]하면, 우리가 만들었던 응답 시트에서 바로 확인이 가능합니다.
  • 정상적으로 휴가 신청이 들어오는지 확인을 했다면..! Incoming Webhook을 위한 두가지 설정이 필요해요!

 

4. Incoming Webhook으로 연동 할 연차 관리 시트 설정하기

4-1. 팀 멤버들의 연차 현황 만들어주세요.

  • 휴가 신청이 관리되는 휴가 신청서(응답) 스프레드시트 옆에, 새로운 시트를 생성해서 멤버들의 기본 인적 정보와 올해 연차 현황을 추가해 주세요.
  • 이름 / 이메일 / 입사 일자 / 2022년 발생 연차까지만 팀 멤버들의 연차 관리를 하고 있는 팀의 HR 담당자께서 작성해 주시면 되고, 팀 규모에 따라 사번도 추가해 주시면 좋을 것 같아요😊
  • Tip : 사번이나 이메일로 팀 내에 동명이인을 구별할 수 있답니다

 

  • 2022년 연차 시트의 사용 연차(누적)는 Sumifs 함수를 활용해서 입력할 수 있어요~!

 

4-2. 휴가 신청서(응답) 시트에, 멤버의 발생 연차 / 사용 연차(누적) / 잔여 연차 정보 를 가져올게요.

  • Incoming Webhook에서 Zapier와 연동을 하기 위해서는 1개의 스프레드시트만 연결을 할 수 있기 때문에 꼭 필요한 설정이에요!
  • 멤버들이 신청한 연차가 시트에 등록되면, 4-1에서 만들었던 ‘2022 연차 시트’에서 연차 정보를 자동으로 가져오도록 arrayformula / if / vlookup 함수를 활용해 볼게요!

  • Tip : 가장 맨 위 열인 발생 연차 / 사용 연차 / 잔여 연차에만 수식을 넣어주면 됩니다.
                   그 이후에는 데이터가 쌓이면 자동으로 계산이 되기 때문에 Drag 하지 않아도 됩니다!

이제 준비 끝! 잔디로 알림을 받을 수 있도록 잔디 커넥트 연결을 하러 가볼까요~??

 

[Step 2] 휴가 신청 토픽과 구글 스프레드시트 연동하기


1. 휴가 신청 알림을 받을 수 있는 토픽 생성, 잔디 커넥트 Incoming Webhook 연동하기

1-1. (Step 1에서 만든 구글 스프레드시트를 연동할) 토픽 우측 상단에 플러그 모양의 [잔디 커넥트] 버튼을 누른 후에 [연동하기]를 클릭해 주세요.

1-2. 잔디 커넥트 항목 중 하단에 있는 [Webhook 수신 (Incoming Webhook)] 의 [연동 항목 추가하기] 버튼을 클릭해 주세요.

  • 커넥트 세부 사항을 설정해 주세요.
  • 연동할 토픽이 제대로 설정되어 있는지 확인해 주세요.
  • 웹훅의 프로필 사진과 이름을 설정해 주세요.

 

  • Webhook URL은 [복사하기] 버튼을 클릭해 클립보드에 저장합니다. (*Zapier 설정 시 Webhook url 필요)
  • 연동할 토픽이 제대로 설정되어 있는지 확인해 주세요.

 

2. Zapier에서 JANDI 연동하기

  • Zapier는 구글 스프레드시트, 잔디, 지메일 등등 여러 서비스를 연결하도록 도와주는 웹 서비스 연동 플랫폼입니다. Zapier 페이지로 접속 및 계정을 만든 후, 아래의 방법을 따라 셋팅해주세요 :) 
  •  플랜에 따라 사용 기능이 상이하며 무료 플랜의 경우 Zap 5개, 한 달에 Task(알림) 50개까지 이용할 수 있습니다. 

3. Zapier에서 Zap 만들기

 3-1. 메인 화면 좌측 상단의 [Create Zap!] 버튼을 클릭해주세요

  • Zap은 Zapier 서비스의 연동 항목의 단위에요.
  • Zap은 이벤트가 발생하는 Trigger, 이벤트에 대한 알림을 발송하는 Action 두 단계로 구성되어 있어요.

 

3-2. Trigger 단계에서 구글 시트(Google Sheets) 앱을 선택해주세요

 

3-3. Trigger Event 설정해주세요

  •  New Spreadsheet Row로 새로운 행 내용이 들어올 때마다 알림 받기로 선택할게요.
    새로운 휴가 신청이 들어올 때마다 새로운 시트에 행이 입력되기 때문에 알림을 받는 형식이에요.
    완료 후 [CONTINUE] 버튼을 클릭해 다음 단계로 넘어갈게요!

 

  • 구글 계정을 로그인해서 연동해요

 

  • 휴가 신청이 정리되고 있는 구글 스프레드시트(Spreadsheet)와 세부 워크시트(Worksheet) 항목을 선택해 주세요. 완료 후 [CONTINUE] 버튼을 클릭해 다음 단계로 넘어갈게요. 

 

  • Test tigger 버튼을 눌러 정상적으로 데이터들이 연결되었는지 확인해 주세요. 테스트가 정상적으로 진행되지 않으면 연동이 잘되지 않고 에러가 나는 경우가 많아요.
    테스트로 샘플 데이터까지 연결된 것을 확인되면 [Continue] 버튼을 클릭해 다음 단계로 넘어갈게요.

 

3-4. Action 단계에서 잔디(JANDI) 앱을 선택해주세요

 

  • Action Event는 자동으로 Send Incoming Webhook으로 선택되어요. 완료 후 [CONTINUE] 버튼을 클릭해 다음 단계로 넘어갈게요.

 

  • JANDI account를 선택해야 하고, 잔디 계정 로그인이 필요해요.

 

  • 잔디로 알림을 받을 Webhook 정보를 설정해요!
    Webhook URL 부분에는 위의 [Step 2] 1번 단계에서 복사해 놓은 잔디 웹훅 URL을 그대로 붙여 넣어요.

 

 

  • [TEST & CONTINUE] 버튼을 눌러 정상적으로 잔디 메시지가 들어오는지 테스트를 진행해요!

 

  • 이제 마지막입니다~! [Turn on Zap] 을 클릭하게 되면 우측 상단이 On으로 변경된 걸 확인할 수 있어요.
    그럼 설정해놓은 잔디 토픽으로 알림 설정까지 모두 완료👏👏

 

  • 토픽에 연동된 웹훅은 언제든지 중단 / 수정 / 삭제도 가능해요!

 

[Step 3] 멤버들이 직접 본인 휴가 조회하기


잔디 멤버들은 HR팀의 문의 없이 본인의 휴가를 잔디 내에서 직접 조회할 수 있어요!

잔디팀은 Team Incoming Webhook을 생성해서, JANDI (나와의 대화)로 개인별 휴가 조회 수신이 가능하도록 설정되어 있어요. (*유료 플랜에서 제공)

[Step 2] Incoming Webhook은 연동된 토픽방에서 알림 메시지를 보내서 개인을 타겟팅하지 않고 메시지가 전송되어요.
하지만 Team incoming Webhook은 메시지를 개별 타겟팅해서 멤버의 개인 채팅 JANDI에 메시지를 보낼 수 있어요. 즉, 본인 휴가를 언제든지 마음껏 조회할 수 있다는 뜻! 이 되겠죠? 😁

이제, Team incoming Webhook을 위한 Google Apps Script와 Outgoing Webhook 설정에 대해서 안내드릴게요!
개발자가 아닌 잔디 사용자분들도 쉽게따라 하실 수 있게 소개할 테니, 천천히 한 단계씩 함께해요!

 

1. Team incoming Webhook을 위한 Google Apps Script을 활용하기

  • Apps Sctipt를 실행하기 위해서는 팀 멤버들의 연차 정보가 정리된 스프레드시트가 필요해요
  • Step1에서 만들었던 2022 연차 시트를 사용해 볼게요.

 

 1-1. Google Apps Script 활용할게요!

  • 2022 연차 시트에서 확장 프로그램 > Apps Script 메뉴를 클릭해 주세요

 

  • 제목은 클릭하여 어떤 프로젝트인지 알 수 있도록 자유롭게 이름을 변경해 주세요

 

  • 아래의 코드를 그대로 복사 후 편집기에 붙여 넣을게요
  • 코드와 아래 이미지를 비교해서 입력하시면 쉽게 이해하실 수 있습니다 👇👇

[코드]

var SHEET_NAME = "2022 연차"; // ★휴가 정보가 저장된 시트의 이름
function doPost(e) {
  var jsonString = e.postData.getDataAsString();
  var jsonData = JSON.parse(jsonString);
  var requestEmail = jsonData.writerEmail;

    // GET Vacation Information by email
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var vacation_sheet = ss.getSheetByName(SHEET_NAME); // 휴가 정보 시트에 접근

  var rangeVacation = vacation_sheet.getRange('B:I'); // 휴가 정보에 접근
  var vvalues = rangeVacation.getValues();

  // 조회 정보
  var vname = "";
  var vtotal = 0;
  var vused = 0;
  var vrest = 0;
  for (var row in vvalues) {
    // E열 이메일이 똑같으면, 휴일 정보 가져오기
    if(vvalues[row][3] == requestEmail){
      vname = vvalues[row][2]; // D열 영어 이름
      vtotal = vvalues[row][5]; // G열 총 휴일
      vused = vvalues[row][6]; // H열 사용(누적) 일
      vrest = vvalues[row][7]; // I열 남은 휴일
      break;
    }
  }

  // 조회 결과: 휴가 정보 만들기
  var vacation_info = "총 휴일 : " + vtotal +"\n"
    + "사용(누적)일 : " + vused + "\n"
    + "남은 휴일 : " + vrest;

  // ★team incoming URL 
  var jandi_incoming_url = "https://wh.jandi.com/connect-api/team-webhook/11316364/6ed909fd2961e1c515e18d0cf4cc6ea2"; 

  // SEND TO JANDI(나와의 대화)
  var jandi_formData = {
      "teamId" : 11316364, // ★팀 아이디
      "WebhookToken": "6ed909fd2961e1c515e18d0cf4cc6ea2", // ★웹훅 토큰
      "email": requestEmail, // 받는 사람 email
      "body": "2022 휴가 조회", 
      "connectColor":"#00C473",
      "connectInfo": [{"title": vname, "description": vacation_info }],// vname: 조회한 사람 이름, vacation_info: 휴가 정보
  };

  var jandi_options = {
    "method": "POST",
    "contentType" : "application/json",
    "headers": {
      "Accept": "application/vnd.tosslab.jandi-v2+json",
    },
    "payload": JSON.stringify(jandi_formData),
    "followRedirects": true,
    "muteHttpExceptions": true
  };

 

  • 코드 내용 중, 위 표시된 부분 중 Team incoming Webhook을 위해 TeamId와 WebhookToken 두 개의 정보가 필요해요!
    TeamId와 WebhookToken은 잔디 [1:1 문의하기] 를 통해 발급해드리고 있어요😊

 

  • 스크립트를 모두 작성한 후에는 상단의 저장하기 버튼을 꼭!! 눌러주세요.

 

  • 우측 상단 [배포] > [새 배포] > 유형 선택 옆 [톱니바퀴] > [웹앱]을 선택해 주세요. 

 

  • 설명은 자유롭게 작성하고, 엑세스 권한은 [모든 사용자]로 설정 후 [배포] 버튼을 눌러주세요.
    배포 후 생성된 웹앱 URL은 복사해두세요. (*복사된 URL은 Outgoing webhook URL로 사용됩니다)

 

2. Outgoing Webhook 만들기

잔디로 돌아와서 JANDI (나와의 대화)에 Outgoing Webhook을 설정해 주는 단계가 남았어요.

  • 토픽 우측 상단에 플러그 모양의 [잔디 커넥트] > [연동 항목 추가하기] >Webhook 발신(Outgoing Webhook) [연동 항목 추가하기]를 클릭해 주세요.

 

  • URL , 시작 키워드, 연동 프로필 설정 내용 작성 후, [연동 항목 추가하기]를 클릭해 주세요 
    • URL : 1-1번에서 Apps Script에서 복사한 웹 앱 URL을 붙여주세요.
    • 시작 키워드 : 메시지 발송 시 이용할 키워드를 설정해 주세요. (*예시 /휴가)
    • 연동 서비스 프로필 설정 : 메시지 발송 웹훅임을 구분하기 위해 Webhook의 이름을 변경해 주세요 (*예시 휴가알리미)

이제 모든 웹훅 설정이 완료되었습니다! 설정한 웹훅을 실행해 보겠습니다 :) 

 

3. 설정한 웹훅 실행해 보기

  • JANDI (나와의 대화) 메시지 입력창에 설정했던 /휴가 (/키워드) 입력 후 전송해 볼게요
  • 2022년 연차 시트와 같은 본인의 휴가 정보를 받아볼 수 있어요👍

지금까지 휴가 신청과 관리, 조회, 알림까지 잔디로 간단하게 관리하는 방법을 알아보았는데요!
이 방법을 응용하면, 아래 예시처럼 다양한 방법으로 활용할 수 있습니다.

  • 멤버들의 명함 제작 신청
  • 비용 품의서 신청 알림 받기
  • 직무 교육 신청 

이 글이 도움이 되었기를 바라며 또 유용한 잔디 사용법을 들고 찾아오겠습니다.

잔디를 사용하면서 궁금한 점이 생기시면, 언제든지 잔디 메뉴의  [1:1 문의하기]로 연락주세요!