テックとハック-ノンプログラマーの勉強ブログ-

仕事・家事・子育てを「より楽しく」「より簡単に」にする仕組みやアイディアをご紹介します。

【ただいま勉強中】【GoogleAppsScript】メールのテンプレートを作る_その2_概要+初めてのコード

 こんにちは。ノンプロ研所属のきのぴぃ(@kinopy_techhack)です。ノンプログラマとしてスキルを身につけるべく勉強中です。

 昨日の記事から、やっとGASについて書き始めました。

 初めてのトピックは私が初めて書いたコードである、メール送信のテンプレートです。
 今日は、その2、と言う事で、シート自体と初めて書いた拙いコードのご紹介をさせて頂きます。

【目次】

 -作った経緯
 -スプレッドシートの説明
 -始めて書いたコード
 -工夫した所
 -コードの問題点
 -終わりに

 -作った経緯

  当時は所属する組織で企画職を担当しており、組織内で定例のメールを多く送っていました。
 そこでメールの内容をテンプレート化するべく、chrome拡張機能などを調べていたんですが、ちょうど良いものがなく。。
 ネットをさまよっていた所、見つけたのが以下のマイナビの記事でした。

news.mynavi.jp

 ・・・まだノンプロ研主催のタカハシさんの「いつも隣にITのお仕事」にも出会えていなかった頃ですね。。
 ここから見よう見まねで初めてのGoogleAppsScriptに挑んで行きました。

 -スプレッドシートの説明

 まずはスプレッドシートですが、以下の様な見た目です。

f:id:kinopy_techhack:20180420123216j:plain

 ・To、Cc、Bcc、件名、本文、署名を設けおり、該当する内容を記入しておく
 ・記入後に、左上のメールボタンを押すと送信が出来る

 一般的なメールを送るのに最低限の内容だけ用意していました。

 -始めて書いたコード

 当時なんとかメールが送れる様になったコードがこちらです。

function sendEmail(){
  // データ取得対象シートを決定
  var book = SpreadsheetApp.getActiveSpreadsheet();
  var sheet = book.getSheetByName("メール文面");
 
  // A1:A3のセル範囲を取得
  // getRange(始点:行, 始点:列, 終点:行, 終点:列,)
  var dataRange = sheet.getRange(4,3,4,7);
 
  // 値を取得
  var data   = dataRange.getValues();
  var row    = data[0];
  
  var to      = row[0]; // to送信アドレス(セル:C4)
  var subject = row[3]; // タイトル(セル:C7)
  var message = row[4]; // 本文(セル:C8&C9)
  var objArgs = {cc:row[1],bcc:row[2]}; // cc&bcc送信アドレス(セル:C5,C6)
 
  // メール送信
  MailApp.sendEmail(to,subject,message,objArgs);
}

 色々と拙い所ばかりです。。
 どこに問題があるのかを次項で具体的に記載します。

 -コードの問題点

 ①6行目のコメント「//A1:A3のセル範囲を取得」・・・コピペしてそのままになってます。
 ②8行目の「 var dataRange = sheet.getRange(4,3,4,7);」の後半の「4,7」これは前半の「4,3」のセルからの行数/列数なんですが、「4,7」のセルを指定するつもりで書いてますね。。
 ③また後半の各項目を対象セルの指定部分。配列など分かっていないので完全に見よう見まねです。
  しかも、結局それでは上手くC5からC9のセルの情報を取得出来ず、、強引にD4〜H4にコピーをしてそちらか取得しています。。

f:id:kinopy_techhack:20180420123245j:plain

 改めて見ると、何もわからない中よくがんばった、、と褒めたい気持ちと何も分からずによくやるな、、と言う呆れた気持ちですw

 -工夫した所

 とはいえ、自分なりに工夫した部分もあるので、そちらもご紹介しておこうと思います。
 ①記入欄を縦に配置し、利用者が書きやすくした。
  ・これが理由でデータが構造化されず、別セルにコピーをする羽目になるのですが。。
   ユーザー目線で考えると、横一列に書いていくよりは見やすく使いやすい(はず)。
 ②本文と署名欄を分け、関数でまとめる事で、管理をしやすくした。
 ③画像にスクリプトを貼り付け目で見てすぐわかるボタンを設置した。
  ・当時何もわからない中、これに手を出して、しかも一応動いていたのは、謎でしかないです。

 -終わりに

 いかがでしたでしょうか?

 改めて見てみると、当時は何もわかっておらず作っており、ご紹介する恥ずかしさもありつつ、、
 当時の奮闘が思い出されます。。

 明日からは実際に今日ご紹介したコードをどの様に修正していくか、のご紹介をさせていただきます。

 もしお役に立ちそうであれば、ぜひご活用下さい。