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

湿気を感じる日々が続きますね。通勤路の紫陽花も色づいてきました。

今回は先日公開した「空き日程公開機能開発ストーリー」の「後編」をお送りします！

今回も前回と同様、CTOの名人さん、Webエンジニアの小川さん、伊藤さんに話を聞きました！

前編をまだ読んでない！という方はこちらから！

現在NoSchoolはエンジニアを大募集！是非気になる方いましたら話を聞きたいからご連絡いただき、まずはカジュアルにお話しましょう！それでは後半戦いってみましょう！

-前回は今回の空き日程機能の開発での山場などをお伺いしました。今回、開発にあたって技術的な工夫点があれば教えて下さい！

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

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

‐開発中に個人として気をつけていたことはありますか？

小川：今回Webフロントとアプリを同時に作るということを初めて本格的に体験しました。普段Webフロントの方ばかり触っていたので、アプリのことは殆ど分かっていなかった部分がありました。同じReactという技術を基盤としているだけあって、基本的なコードの構造はどちらもお同じように使い回すことができることに気づき、できる限りアプリとWebフロントの構造が近くなるように実装を進めました。

伊藤：バグを生じさせないようにテストを書きやすい設計にし、クラスの影響範囲を小さくしつつ、細かくテストすることを心がけていました。 また、空き日程公開機能をオンにできる条件が複数あるので、様々な箇所にロジック分散しないように気をつけていました。

‐今回は3名で主に担当して開発されていたと思いますが、リリース前とリリース後に「エンジニアチーム」として技術的な面で変わったことはありましたか？

小川：Webフロント開発(Next.js)と、アプリ開発(React Native)が殆ど同じ構成で開発できることに気付けたことによって、Webフロントとアプリのディレクトリ構成を近付けていきたい機運が高まったことはチームとして技術的に変わったことというか意識が変わってきたのかなと思います。

‐今回の機能のリリース前とリリース後に「個人」として成長した部分はありましたか？

小川：今回Webフロントの画面(主にNext.js)と合わせて、アプリ(React Native)の画面も一緒に作成するということを初めて本格的に行なったのですが、大きく上げると2つ成長した・学びになった点があると思います。

• アプリに本格的にトライするのは初めてだったということもあり、アプリ開発の全体感を知ることができた点
• Webフロント(Next.js)とアプリ(React Native)が、どちらも同じReactを基盤としている技術なだけあって、一方で書いたコードが殆どそのままもう片方に適用できる体験がとても快適で、このWebフロントとアプリのディレクトリ構成をもっともっと近付ければ、より快適にWebとアプリを開発するスピードが上がるのではないかということに気付けた点

伊藤：モデリングをする際に、抽象化する範囲について自論を持てたのが個人的な成長ですね。抽象と具象とメリット/デメリットに関して、じっくり思考することが出来ました。

‐今回リリースした空き日程機能が80%の完成度だと仮定して、残りの20％でどのように発展していきたいかなどあれば教えて下さい！

伊藤：モデリングを行い、そのモデルをコードで意図通りに表現できている自身がない。なので、設計をもっと上手くできるようになりたいです。 モデリング自体もまだまだ伸ばせる余地があると思うので、難しいタスクをこなす中でモデリング力を高めていきたい。 加えて、限られたリソースの中で、継続的にモデルをブラッシュアップする方法が上手く見いだせていないので、改善したいなと思っています。

小川：この機能自体の話ではないですが、現在のマナリンクの表側はNext.jsという技術で実装されているところと、Nuxt.jsという技術で実装されている箇所がそれぞれあり、今回の苦労ポイントであった、ログインしていないユーザーがリダイレクトして会員登録作業をした後元の画面に戻ってくる、という部分はこの2つの技術を横断して遷移処理を組む必要があり、ここの横断時にページのパス(URL)を型安全にすることができないなどのもどかしさを覚える点があったりしたので、現在進行系で進めているNuxt.jsからNext.jsの画面移行作業をより推し進めたいなと感じました。

皆さんありがとうございました！この機能実装で、オンライン家庭教師と生徒さんのマッチングがより進むといいですね！

Nuxt.js→Next.jsへの移行などより良い体験をオンライン家庭教師、生徒さんにしていただくために機能実装を進めていきたいと考えています！！是非NoSchoolに興味をもっていただけましたら「話を聞きに行きたい」ボタンからご連絡下さい！ざっくばらんにお話しましょう！以下の求人から応募いただいてもOKです！