キャップ野球向けイベントカレンダー作ってみました。【12/12 update】

React googleapi Netlify

キャップ野球向けイベントカレンダー

https://cap-calendar.netlify.com/

最近キャップ野球関係のサービスをいくつか作っているのですが、

キャップ野球・全国大会非公式特設サイト
野球リーグスコア管理システム ver3α
優勝ラインシミュレーター

まだ普及途上にあるマイナースポーツなので、色々広報手段が足りないようで「こんなイベントカレンダー欲しい」という声を聞いたので作ってみました。

検討した仕組み

マイブームというわけではないのですが、個人開発ではDBレスのサービスを作ることが多いです。スキーマの設計が面倒なのと個人でデータを持ちたくないのが....。

最近作った主なDBレスサービス

キャップ野球・全国大会非公式特設サイト
ドラフト風画像作成サービス「ドラフトなう!」
アニメランキング作成サービス「Annict Access 3」
音楽ランキングメーカー
優勝ラインシミュレーター
ボウリング幹事アプリ「bowling party manager」

timetree

カレンダー共有ということで一番最初に考慮したのがtimetree。
ただし、外部公開されているAPIの中にカレンダーに登録されているイベントの一覧を取得するAPIがないことがわかり(19/12/7時点)、採用を断念しました。

google calendar API

定番のカレンダー。ただし、現在公開されているv3 APIはOAuth必須となっている。極力ユーザに余計なアクションをさせたくなかったので選択肢から外しました。

google public calendar

googleカレンダーには誰でも閲覧できる「公開カレンダー」があり、
その仕組みを調べていたところ、OAuthなしでデータを取得できるという結論に達しました。

イベントの種類タグ

イベントの種類を分類するために、イベントのタイトルにタグをつけてもらう方式にしました。
例：【イベントの種類】【イベントの場所】タイトル

強敵、正規表現....

エンジニアとして避けては通れない道なのはわかっているのですが、1つめの【】の中は取得できるものの、繰り返しの取得ができず、

(ノ｀Д)ノ彡 ┻━┻　←こんな感じになりました

結局文字列を再帰的に検索するという力業で解決しました。
文字列処理はHSP時代に腐るほどやったんや....

findTag=(str,tags)=>{
    console.log(tags)
    let beginIdx = str.indexOf('【');
    let endIdx = str.indexOf('】');
    if(beginIdx !== -1 && endIdx !== -1){
      let tagStr = str.substring(beginIdx + 1,endIdx);
      tags.push(tagStr);
      this.findTag(str.substring(endIdx + 1,str.length),tags);
      return tags;
    }else{
      return tags;
    }
  }

ロースキルでごめんなさい。