毎日更新

44日目 個人開発記⑦-結局Laravel-

こんにちは。

今日は個人開発記を。

いよいよ先週あたりから実装を再開しましたが、序盤からかなりつまづいていております。

今回の個人開発の技術面でのテーマは、「React-ReduxでSPA」なので、バックエンドにはなるべく工数かけたくないという理由で慣れているLaravelをチョイス。

Laravelはコマンド1発で認証系が完成します。そうしてできた認証系からapiをつかった非同期処理に書き換えることにし、まずはログイン機能から。

、、、いざやってみると、めっっっっちゃむずい!!!

Laravelが!!!!!!(そっち?

もちろんReactでのアプリは初めてなので、そっちもそっちでうまくいかない。

UdemyでReact-Redux-Hooksの講座を受講したのでその完成コードを参考に実装しようとしましたが、いきなりReduxまで組み込もうとしたらワケワカランになって手が止まってしまいました。動画ではまずReduxなしで実装し、それをReduxに書き換えるという手順でやっていたので、今回のログイン機能の書き換えも動画を見ながらReduxなしでまずは取り掛かってます。

https://www.udemy.com/course/react-hooks-101/

そんな感じで動画を見ながらフロントはなんとか実装できるのですが、そもそもSPAの設計がわかりません。

「Laravel x ReactでSPA」の記事なんてほぼ皆無です。Vueの記事なら多数ヒットするので、それを見ながら必要に応じてReactに読み替えながらなんとか、、、、ならなかった。泣

結局、メンターさんの助けを借りながら、5時間くらいかけて「ログイン機能の実装+ログイン判定メソッドを動かす」ところまでこぎつけました。

「非同期で認証機能にアクセスするには、axiosのHTTPリクエストヘッダーの"Authrization"にBearerトークンを仕込まないといけない」なんて、自分じゃどうやってもたどりつけんわ。。

api認証にはsanctamというライブラリ?を使いましたが、認証方法にもいろいろあるようで、なにを使えばいいのか素人には全く分からない。結局、現場でLaravel x Reactを使っている知人に教えてもらって知ることができました。

https://readouble.com/laravel/7.x/ja/sanctum.html?header=%25E8%25AA%258D%25E8%25A8%25BC

Laravelでのアプリ制作は数回やったので、もうLaravelで詰まることなんてそうそうないだろうと思ってたけど、とんでもなかった。SPA用のAPIとして使うとなると別物と考えてよいですな。まだまだ修行が足りぬ。

ただ今日で「Reactを使って非同期で認証を行う」という実装の「0→1」フェーズは突破したので、こっからどんどんいきます!いやーほんとしんどかった!

ただ土日は来週月曜の社内LTの準備しないと。今回のテーマは「サービス名の決め方」でいきます。お金もらってサービス名つけたことある人ってエンジニアには少ないはずなので、多少なりとも提供できるものはあると思う。

よし、寝よう。

おわり。

  • この記事を書いた人

きわっち

元食品メーカー製造マンが未経験からwebエンジニアになりました。 エンジニアとして0から成長していく過程を発信していきたいと思っています。