先生の予定を確認して授業お問い合わせが可能に！空き日程公開機能開発ストーリー　前編

6月がスタートしましたね！6月1日には新スタッフが入社し、オフィスも一層にぎやかになりました。

今回は先月リリースされた「空き日程機能」に関して、開発に関わった3人のエンジニアに話を聞きました！

CTO齊藤さん（通称：名人）

WEBエンジニア　小川滉太さん

WEBエンジニア　伊藤武さん

今回の開発の山場や工夫点、今後の改善につなげたい点など語っていただきました！

NoSchoolではエンジニア採用も積極的に行っているので、興味ある方は「話を聞きに行きたい」からご連絡ください！

-今回は初めての3人同時にお話をお伺いします！今回リリースした機能の内容を簡単に教えて下さい！

先生の予定が無い空き時間を指定してオンライン指導のお問合せができる機能です。

名人：2月にリリースしたカレンダー機能により、先生の授業予定がマナリンク上に登録されています。本機能により、先生の授業予定が登録されていない時間帯をサイト上から保護者様が確認することができ、時間指定でお問合せができます。これまではオンライン家庭教師に問い合わせする際に初回授業の日程を一緒に送付したり、問い合わせの途中で予定をすり合わせする必要がありましたが、今回の機能実装により、お問合せからの初回授業の日程調整の手間を省くことができ、生徒様（保護者様）からのお問合せのハードルを下げることが目的です。

-確かに日程問い合わせするのって面倒ですよね。これは生徒さん（保護者様）のお問い合わせに対するハードルが下がりそうです。インタビューを読んでいただいている向けに実際に画像で見せていただけますか？（以下の画像はテスト画面の画像になります）

名人：先生一覧画面で先生の直近7日間の空き日程を見ることができます。空いている時間を希望日程としてお問合せができるわけです。ちなみに先生がこのオプションをONにしていないと表示はされません。

空き日程の○がついているところをクリックすると時間帯を1時間単位で選択できます。もちろんマナリンク上で授業登録している時間帯は表示されません。

空き日程を選択すると次に指導コースを選択する画面が以下のように開きます。

時間を指定してお問合せができます。先生へのお問合せ希望フォームのタイトルが時間指定になっていることがわかります。 結構ここポイントです。

‐おー画期的ですね！開発を始める前に、技術的に一番ネックだと思ったことはなんですか？

伊藤：無料体験空き日程公開機能は、スタートプランの先生だけが利用できます。（マナリンクでは先生が登録する際、スタートプラン/エキスパートプランを選んでもらいます。）

そして、その権利を持つ先生が公開機能をオンに設定することで、空き日程公開機能が利用できる。 権利を有しているか＆機能をオンにしているかの組み合わせで、空き日程機能の利用可否が決まるという事象を抽象化して、今後追加予定のスタートプランの先生だけが利用できる新機能に対しても、利用可否を算出するコードを横展開できるように設計するのが難しそうだと感じましたね。

‐小川さんはどうでした？

小川：ログインしていないユーザーを会員登録画面にリダイレクトさせる処理で、リダイレクト元の画面に応じて会員登録完了後に戻ってくるページを分岐させる部分がネックになるんではないかと感じましたね。

例えば、ログインしていないユーザーが操作しているものとして

先生一覧画面 → (任意の先生の希望時間を選択する) → 指導コース選択画面（ここでログインしていない場合に弾かれ会員登録画面にリダイレクトする） → 会員登録画面 → (会員登録する) → (認証してねメールが届く) → (メール内の認証ボタンを押す) → メール認証しました画面（ここでどこの画面に戻すかを判断する） → 指導コース選択画面(元の画面)に戻ってくる

という感じに、本当にできるかな～と思ってました。

‐ちなみに今挙げていただいた、「技術的に一番ネックだったこと」は開発を初める前と開始後でGAPはありましたか？

伊藤＆小川：特になかったですね。

‐なぜGAPが生まれなかったか教えてもらえますか？

伊藤：常日頃から、朝会や1on1で自分の課題についてアドバイスを名人さんや他のスタッフからもらってるので、自身の技術力の課題点を自身で理解していた部分が大きかったですね。

小川：ログインしていないユーザーをリダイレクトさせ元の画面に戻ってこさせるという処理の大枠は既に以前に実装がなされていたため、今回自分がやらなければならないことは、複数あるリダイレクト元の画面をどのように判断し分けて元の画面に戻すかという部分の設計を中心に考えることが主な作業だったのと、実装前に予め名人さんに設計相談を行なっていたため、あまり手戻りや追加工数の発生等なく実装を進めることができたたのでGAPは感じなかったですね。

‐CTOの日々の存在が大きかったようですね...今回の開発において、山場はどの辺にありましたか？

伊藤：技術的に一番ネックだと思ったことはなんですか？と同じになるのですが、今回の機能＆権限という概念をモデル化するのが難しかった。また、限定機能は今回が初めてなので、具体例が1つしかない中、抽象化してモデルを作成するのが山場でしたね。そもそも、現在は存在していない具象も含むモデルを作成することは良い事なのか？ どこまで抽象化するのが適切なのか？ などについて自論を持っていなかったので、考えることに時間がかかりました。

あとは 空き日程表示クエリが従来は一人の先生に対してのみ対応していたが、複数の先生を一度に取得できるように変更した部分ですね。一人を前提にかかれている取得クエリを複数人用に書き換えるのが難しかったですね。

バックエンドを実装することがこれまで多かったので、フロントエンドを実装するのが少し苦労しました。

小川：私は２つありますね。

まず、非ログインユーザーのリダイレクト処理周り。

「A画面で会員登録画面にリダイレクトしたら会員登録後はA画面に戻す」というような処理を組む際、一番はじめ、バックエンド側で「toAPage: boolean」や「toBPage: boolean」などとして、戻したい画面に関する情報をそれぞれフラグで持っておき、それをもとに判定をする方針を取ろうとしていたが、バックエンド側が「APage」や「BPage」などの実際にどういった画面があるかの情報を持っているのは違和感があると思ったので、バックエンド側では「backPage: string」のように「戻す画面」を文字列として持つだけにとどめておき、この「戻す画面」の指定はフロント側で指定するようにすることで、バックエンド側では特定の画面情報に関する知識を持つことなく、フロント側のみで戻したい画面の指定と、その指定した画面へのリダイレクト処理を行わせることができるようになった。

もう1つはWebフロントとアプリでESLintの設定やPrettier設定が一部異なっている箇所などがあったところを統一し、できるだけ開発時の体験が揃うように努めました。

今回は文字数の関係でここまで！後半は6/7(水)に公開予定！

現在NoSchoolではエンジニア採用を強化中！いろいろな開発や改善をおこないながらご自身も成長していきませんか？

興味ある方、「話を聞きに行きたい」ボタンからでもいいですし、応募から直接質問いただいてもOKです！皆様の応募お待ちしております！