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

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

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

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

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

6月がスタートしましたね！6月1日には新スタッフが入社し、オフィスも一層にぎやかになりました。 今回は先月リリースされた「空き日程機能」に関して、開発に関わった3人のエンジニアに話を聞きました！ CTO齊藤さん（通称：名人） WEBエンジニア　小川滉太さん WEBエンジニア　伊藤武さん 今回の開発の山場や工夫点、今後の改善につなげたい点など語っていただきました！ ...

https://www.wantedly.com/companies/noschool/post_articles/511612

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

フルスタック

要件定義から設計、実装〜運用まで一貫して開発したいエンジニア募集

【運営事業】 オンライン家庭教師のマッチングプラットフォーム「マナリンク」（マナリンクHP：https://manalink.jp） 【対象ユーザー】 ・オンライン家庭教師 塾や家庭教師などで指導実績があり、「個人塾経営者」、「元証券マン」や「現役バレエダンサー」などさまざまなバックグラウンドをお持ちの先生が登録しています。 オンラインでの指導のため、直接生徒のご自宅に行く必要がないため、「本業」「副業」さまざまな働き方の先生がいらっしゃいます。 ・「学びたい」生徒 メインは小学生/中学生/高校生、「学びたい」理由はさまざまです。 「中高一貫校に通っているけど、一部の教科が苦手」「英検を受けるために対策をしたい」などなど。 さまざまな理由で学校に通えない方や海外在住の日本人の生徒さんもいらっしゃいます。 1割弱ですが「社会人」の生徒さんもいらっしゃいます。 【マナリンクの特徴】 ①社会人の先生のみの「オンライン家庭教師」として登録可能 家庭教師というと「学生」をイメージしがちですが、マナリンクは経験豊富な「社会人」の先生の登録のみ。指導実績豊富で熱意のある先生に出会えます。 ②「指導してもらえるオンライン家庭教師の先生」の様々な情報が見れる 家庭教師業界の抱える問題の1つに「情報の非対称性」があります。 マナリンクでは登録している先生の様々な情報を開示することで、学ぶ側が安心・納得して先生を選べるようにしています。 例えば... ・先生の自己紹介動画（先生のしゃべっている雰囲気や指導理念が確認いただけます） ・先生の指導実績 ・先生のコース料金（マナリンクでは決まった料金プランがないため先生によって指導時間/回数/料金が異なります） そのほかにも指導した生徒さんからの口コミ、「感謝の声」も見ることができ、実際に指導を受けた生徒さんからの生の声を覗くことができます。 ③専用アプリやWEBページを使って「指導しやすい」「学びやすい」環境を提供 マッチングプラットフォームというと、「マッチングさせたらそれで終わり」というイメージが強いですが、「マナリンク」はマッチングされた後も、自社開発の専用アプリや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です！

フロントエンジニア

アーキテクチャの策定から関わりたいフロントエンド特化のエンジニア募集！

【運営事業】 オンライン家庭教師のマッチングプラットフォーム「マナリンク」（マナリンクHP：https://manalink.jp） 【対象ユーザー】 ・オンライン家庭教師 塾や家庭教師などで指導実績があり、「個人塾経営者」、「元証券マン」や「現役バレエダンサー」などさまざまなバックグラウンドをお持ちの先生が登録しています。 オンラインでの指導のため、直接生徒のご自宅に行く必要がないため、「本業」「副業」さまざまな働き方の先生がいらっしゃいます。 ・「学びたい」生徒 メインは小学生/中学生/高校生、「学びたい」理由はさまざまです。 「中高一貫校に通っているけど、一部の教科が苦手」「英検を受けるために対策をしたい」などなど。 さまざまな理由で学校に通えない方や海外在住の日本人の生徒さんもいらっしゃいます。 1割弱ですが「社会人」の生徒さんもいらっしゃいます。 【マナリンクの特徴】 ①社会人の先生のみの「オンライン家庭教師」として登録可能 家庭教師というと「学生」をイメージしがちですが、マナリンクは経験豊富な「社会人」の先生の登録のみ。指導実績豊富で熱意のある先生に出会えます。 ②「指導してもらえるオンライン家庭教師の先生」の様々な情報が見れる 家庭教師業界の抱える問題の1つに「情報の非対称性」があります。 マナリンクでは登録している先生の様々な情報を開示することで、学ぶ側が安心・納得して先生を選べるようにしています。 例えば... ・先生の自己紹介動画（先生のしゃべっている雰囲気や指導理念が確認いただけます） ・先生の指導実績 ・先生のコース料金（マナリンクでは決まった料金プランがないため先生によって指導時間/回数/料金が異なります） そのほかにも指導した生徒さんからの口コミ、「感謝の声」も見ることができ、実際に指導を受けた生徒さんからの生の声を覗くことができます。 ③専用アプリやWEBページを使って「指導しやすい」「学びやすい」環境を提供 マッチングプラットフォームというと、「マッチングさせたらそれで終わり」というイメージが強いですが、「マナリンク」はマッチングされた後も、自社開発の専用アプリやWEBページを使うことで 「学びやすい」「指導しやすい」環境を提供しています。 例えばこんな機能があります！ ・授業時間外も「先生」とやり取りできる「チャット機能」 ・「授業日や時間を忘れてた！」を防止する「カレンダー機能」 ・宿題の出し忘れやお子様の学習状況を確認できる「宿題提出機能」

株式会社NoSchool

フルスタック

要件定義から設計、実装〜運用まで一貫して開発したいエンジニア募集

【運営事業】 オンライン家庭教師のマッチングプラットフォーム「マナリンク」（マナリンクHP：https://manalink.jp） 【対象ユーザー】 ・オンライン家庭教師 塾や家庭教師などで指導実績があり、「個人塾経営者」、「元証券マン」や「現役バレエダンサー」などさまざまなバックグラウンドをお持ちの先生が登録しています。 オンラインでの指導のため、直接生徒のご自宅に行く必要がないため、「本業」「副業」さまざまな働き方の先生がいらっしゃいます。 ・「学びたい」生徒 メインは小学生/中学生/高校生、「学びたい」理由はさまざまです。 「中高一貫校に通っているけど、一部の教科が苦手」「英検を受けるために対策をしたい」などなど。 さまざまな理由で学校に通えない方や海外在住の日本人の生徒さんもいらっしゃいます。 1割弱ですが「社会人」の生徒さんもいらっしゃいます。 【マナリンクの特徴】 ①社会人の先生のみの「オンライン家庭教師」として登録可能 家庭教師というと「学生」をイメージしがちですが、マナリンクは経験豊富な「社会人」の先生の登録のみ。指導実績豊富で熱意のある先生に出会えます。 ②「指導してもらえるオンライン家庭教師の先生」の様々な情報が見れる 家庭教師業界の抱える問題の1つに「情報の非対称性」があります。 マナリンクでは登録している先生の様々な情報を開示することで、学ぶ側が安心・納得して先生を選べるようにしています。 例えば... ・先生の自己紹介動画（先生のしゃべっている雰囲気や指導理念が確認いただけます） ・先生の指導実績 ・先生のコース料金（マナリンクでは決まった料金プランがないため先生によって指導時間/回数/料金が異なります） そのほかにも指導した生徒さんからの口コミ、「感謝の声」も見ることができ、実際に指導を受けた生徒さんからの生の声を覗くことができます。 ③専用アプリやWEBページを使って「指導しやすい」「学びやすい」環境を提供 マッチングプラットフォームというと、「マッチングさせたらそれで終わり」というイメージが強いですが、「マナリンク」はマッチングされた後も、自社開発の専用アプリやWEBページを使うことで 「学びやすい」「指導しやすい」環境を提供しています。 例えばこんな機能があります！ ・授業時間外も「先生」とやり取りできる「チャット機能」 ・「授業日や時間を忘れてた！」を防止する「カレンダー機能」 ・宿題の出し忘れやお子様の学習状況を確認できる「宿題提出機能」

株式会社NoSchool