この記事の目的株式会社NoSchoolでオンライン家庭教師マナリンクの開発にJOINしたので、コードや設計などの感想を述べてみる。入社エントリがわり。テンション高めです。 この記事の想定読者アーリーステージベンチャーの開発に興味がある人PHP/Laravel + (Nuxt.js + Next.js) + Expo(ReactNative) + AWS のフルスタック開発体制に興味がある人今の所バックエンドを触ることが多いためそのウェイトが高めです。逆にExpoやインフラ周りについては情報少なめです。JOINしたチームはエンジニア4名くらいでサーバ/フロン...

背景小ネタです。先日以下のようなバグ改修タスクでソースレビューを担当しました。「全画面モーダルを実装したら、グローバルメニューより上に表示されてしまった。なのでz-indexを修正しました！」我々が開発しているマナリンクでは、画面右上の自分のアイコンをクリックするとメニューが表示されます。ところが全画面モーダルを実装したら、モーダルがメニューよりも上に表示されてしまい、モーダル表示中にメニューを操作できなくなってしまったとのこと。最初のPull Requestの時点では、以下のような差分になっていました。 <div- className={'z...

会社で複数の新規事業を立ち上げる機運が高まったことをきっかけに社内向けUIライブラリを開発し、限定公開して利用を始めました。本記事ではReactで社内向けUIライブラリを開発・ビルド・公開・布教するためのアレコレを共有します。以下のような話題について知りたい方に特に読んでほしいです。Private Packageの作り方、配布の方法のイメージがつかない方CommonJSとES Modules、今はどちらでビルドするのがいいのか知りたい方ライブラリの作り方について網羅的に知りたい方 前提利用側のアプリケーションはNext.js固定を前提とするTailwind CSS...

React Hook Form、便利ですよね。とはいえReactのFormライブラリ自体は複数あるはずで、今はReact Hook Formが人気だけどそのうち覇権が移ることもあるのではと思い、以下のようなツイートをしてみたところ、思いのほか反応がありました。https://twitter.com/Meijin_garden/status/1742738322198569302という流れで以前から仲良くさせていただいているアセンド株式会社の方にお声がけいただいて、あれよあれよというまにconnpassが立ち上がりました。https://ascend.connpass.com/ev...

はじめにこんにちは。kouです。自分は普段の開発業務ではフロントエンド及びバックエンドのどちらもを触ることが多いのですが、元々はフロントエンドに興味関心があってフロントエンドを中心に学習をしていたこともあり、バックエンド技術に関しては相対的に見てまだまだ広い知見がありません。そんな自分が、最近業務内でMySQLのWITH句を使用する機会があり、SQLの可読性向上の観点からとても有用なものだと感じたので、今回はその紹介をします。 WITH句とはWITH句とは、SQL（主にサブクエリ）の実行結果に対して名前をつけて一時的な仮想テーブルを作成し、それをメインクエリ内から参照でき...

はじめにこの記事はこちらの素晴らしい記事を拝見し、私も書こうと思った記事となります。筋肥大目的で筋トレを始めて約6年程度の体験＆健康に関する学習で得た知見を元に書いています。筋トレ3年目頃から、筋肥大よりも健康志向になったので記事の内容は健康に重きを置いた内容となっております。エンジニアリングにも全く関係ないので、皆様暇な時に読んでください。と言いたい所ですが、日常的に運動をしていない不健康なエンジニアは必ず読んでください。また、私が仕事よりも本気で取り組んでいるジム勧誘活動によって、弊社社員のジム加入率は80%を超えています。熱心で粘着質な勧誘、そしてプロテイン服用の強制...

はじめに昨年2023年は、株式会社NoSchoolのCTOとして、オンライン家庭教師マナリンク（https://manalink.jp/ ）に関わる開発、エンジニアリングマネージャー、採用、UIデザイン、運用保守、PMなどを兼任していました。本記事では、エンジニアリングマネージャー（以下EM）を兼任していて考えたことをまとめていきます。シリーズA前後のスタートアップという特異な状況かつ、マネジメントしたメンバーも3人と小規模なためあまり参考になる知見か分かりませんが、現時点での自分の考え方の備忘録的な意味も込めてまとめておきます。 考えたことまとめそれでは早速矢継ぎ早に考...

はじめにこんにちは。kouです。2023年も残り僅かとなりました（現在 2023/12/31 21:19 🙂）。現在自分が所属している会社(株式会社NoSchool)には昨年の8月に転職したので、2023年は丸1年間がっつり「オンライン家庭教師マナリンク（弊社が開発・運営しているサービス）」の開発に携わるという1年でした。そんな2023年にマナリンク開発を通して学んだことや所感を、年の瀬の振り返りとして残しておこうと思います。 2023年の技術的な学び一覧2023年のマナリンク開発を通じた学びを簡単にですが一覧にまとめました。https://x.com/ogakuzu...

この記事は Laravel Advent Calendar 2023 21日目の記事です。 疑問caseに対応する値を定義する方法は2種類があるが、どちらで記述するのが良いのか？① BackedEnumenum SIGNAL:string{ case RED='赤'; case YELLOW='黄'; case BLUE='青';}② PureEnumenum SIGNAL{ case RED; case YELLOW; case BLUE; public function label():string{ ...

この記事はTypeScript アドベントカレンダー2023 16日目の記事です。 背景会社で新規サービスを立ち上げるにあたり、AWS CDKの導入にチャレンジしています。これまで1つの事業に注力してきましたためIaCはほとんど進めていませんでしたが、アセットを活かしつつ複数のサービス展開を見据えていく背景があり、AWSでベーシックなインフラを立ち上げることがある程度誰でも簡単にできるようにIaC化したいなということで取り組んでいます。AWS CDKを採用した理由は端的にいえば、TypeScriptでインフラ定義が書けることです。社内では現在全員がTypeScriptの実装が可能...

※ この記事は React Native Advent Calendar 2023 の 11日目の記事です。目次背景アプリ側の実装と解決策Expo Imageとは？サーバー側の実装どれくらい早くなったのか？おわりに※今回の測定に関しては、弊社のネットワーク速度の影響もありますので、必ずしもこれぐらいの速さになるということはありません。そちらをご了承の上お読みいただければと思います。 1. 背景弊社のアプリには、チャット機能があるのですが、そこで送られた画像はモーダルとして見ることができたり、送られた画像を拡大表示して見たりすることが可能です。サービスの特性上、生...

背景AWSメインでアプリケーションを構築しており、ほとんどのデータはRDS（Aurora）に保存、アプリケーションサーバー（Laravel）もFargate上で動作している一部のデータだけリアルタイム通信が必要だった背景からFirestoreに保存されているこの度、Firestore上に保存されているデータを集計することで特定のユーザーの行動量を「多い」「普通」「少なめ」の3段階で評価しフロントに表示する要件ができたFirestore上に保存されている集計対象のデータは累計70万件を超える当然ながらFirestoreは複雑な集計クエリをサポートしていないため、Larave...

免責事項社内向けに展開するように雑にまとめましたNext.jsの知見が深くない人がリードしてPoCを立ち上げなきゃいけなくなったが、社内的にはNext.jsを推奨しているみたいな場面を想定していますなので自信ないところも多いですが割と断言するように心がけて書いていますPoCの立ち上げ想定なので、jest/Storybookなど内部品質面についてあまり深く書くことを避けていますほぼ自分の知識だけで書いており私見も多いですし、そもそも自分自身がトップクラスの知識や視座を有しているわけでもないので、まずは以下の話を理解はした上で、踏襲するかどうかは別途他記事やGitHub...

以下のイベントで登壇した内容です（元スライドをSlidevで作成しています）。https://devguil.connpass.com/event/290596/ お話する内容ESLintのルール設定にこだわる意義関わっているプロダクトで見つけた課題OSSにコントリビュートした内容 対象読者ESLintを使ったことはあるけど、使う意義があまりわかっていない方ESLintのルールを自前で実装するイメージが湧いていない方OSSコントリビュートのハードルが高いと思っている方 自己紹介名人Twitter(X): 名人｜マナリンクCTOZenn: h...

!【記事を書き終えてから気付いてしまったこと】この記事自体を書き終わった後に思ってしまったのですが、今回のこの型注釈の話、型を付ける恩恵がそんなになかったですね。実装当時は stdClass のインスタンスである $item からプロパティアクセスをしようとした際に、SELECTで指定した値に関する補完が出ないのは不便だなあと感じて補完が出るよう試行錯誤していたのですが、PHPDocを利用して半ば出来レース的に型注釈を付けているだけになっていたことに後から気付きました🫣結局のところ、この記事では「stdClassクラスのインスタンスに対して、PHPDocで型を付ける方法が分かるよ...

結論Before$this->assertDatabaseHas('users', ['id' => 1]);After$this->assertDatabaseHas(User::class, ['id' => 1]);他にも、様々な形でテーブルを指定することが可能です。下記の書き方は全て同じ挙動をします。$this->assertDatabaseHas('users',*);$this->assertDatabaseHas(new User(),*)$this->assertDatabaseHas((new Use...

YouTube埋め込みって、するだけでLighthouseスコアが低下して悲しい気持ちになりますよね。なので研究としてLighthouseスコアを低下させない対策を調べたり試しました。最終的に、特定のケースでのみ低下不可避という結論に至りました。 結論YouTube埋め込みがファーストビューにあり、スマホ対応も必須な場合、Lighthouseスコアの低下は避けられない※もし回避する方法を見つけている方がいれば教えてください 検証結果以下のサイトとGitHub Repoに公開済みです。サイト内、コード内に説明は特に無いので本記事の内容と合わせて見ていただければと思います。h...

社内で1年以上、「10分勉強会」という取り組みを続けており、延べ80回以上開催してきました。本記事では、これまで開催したときの発表ネタを一挙公開します（多すぎて書くのが大変なのである程度選抜したうえで、フロントエンド・ネットワーク編として一旦まとめました）。こんな方にぜひ読んでいただきたい記事です。社内で勉強会をやりたいけど、どんなネタを採用すればいいのだろう？弊社の場合はかなりライトなネタで続けています。ぜひ参考にしてください！マナリンクの勉強会にお邪魔してみたい！ありがとうございます！ゲスト参加を常に歓迎しておりますので、本記事を読んでこんなネタ聞きたい、あんな...

はじめにこんにちは。kouです。昨年8月1日、株式会社NoSchool に入社し、オンライン家庭教師サービス『マナリンク』の開発に本格的に携わり始めてちょうど1年が経過しました。この1年間、マナリンクの開発に携わる中で様々な学びがありました。今回、入社1年という区切りにこの1年間の学びを、簡単にですが並べてみようと思います。この1年間で学んだことは多くありますが、それらを全て挙げるのはキリがない上に、記事としても読みにくいものになってしまうため、中でも学びが大きかった部分に絞って紹介します（今回は主に設計とテスト周りについて取り上げています）。 自己紹介本題に入る前に...

対象読者サービスコンテナ,サービスプロバイダ,ファサードの使い方をざっくり理解しているDI(依存性の注入)について理解しているphpunitを利用したことがあるモックの使い所は理解しているが、肝心のLaravelでの実装方法が分からない 目次モックのパターン一覧なぜFacadeは簡単にモックできるのか モックのパターン一覧Facadeがなぜ簡単にモックできるのかを理解するために、まずはモックのパターン一覧を紹介します。モッククラスを作成して、モック対象のクラスと差し替えるMockeryを用いて、モックインスタンスを作成して、モック対象のクラスと差し...