Laravelで作ってたサイトをReact/ReduxでSPA化してみた。フリーランスWEBエンジニア多分フロントエンドエンジニア寄りのフリーランスWeb制作者のサイトです。他バンドでギター弾いたり、max/mspいじったり等もしております。お気軽にお問い合わせください。ホームbandお問い合わせサイトマップMenuSidebarPrevNextSearchRSSFeedlyホーム>webLaravelで作ってたサイトをReact/ReduxでSPA化してみた。25/02/2020TwitterFacebookGoogle+LinkedInPocket感想がてらの宣伝です。#迷言WordStacksは心に響いた名言。した何気ない言葉を共有できる無料&登録不要の・投稿サービスです。2020名言投稿アプリみたいな感じのつもり今のところ少々アクセスはあるものの投稿とかはなかなかしてもらえてない。理想は勝手に賑わってくれたらいいのだけど、そんなうまくはいきませんですよねぇ。投稿して頂いても良いのですよ。Let’s登録プリース、ビバ投稿。先っちょだけでいいから登録してみてください。技術的な事は何も書いて無いです。アーキテクチャがどうとかはよく分からないしベストプラクティスがなんだとか意識高い話も知らない。使ってみた、とこんなんやってみた、とかのかるい感想です。割でネガティブな感想多いかも、文句ばっかりおじさん。頑張らないとなー、とイヤイヤながら頑張り中。テストコードLaravelAPI化Laravelについてはとりあえず全部API化したつもり。誰も見てないだろうし。言い訳しつつgoolgeとTwitterのログインがあれば一旦はいいかと諦め中。postmanあんまりやった事ない作業だったのでAPIをリクエストする際どうやってエラーとか見ればいいのか最初よくわからなかったけどもpostman使うと結構はかどりました。https://www.getpostman.com/laravelで作った時の前記事Laravel使ってみたのでRailsとざっくり比較(個人開発)FirebaseLaravel関係ないけど、途中でFirebaseってのを知ってこっちのが手軽そうで良かった?のかなとも思ってはいる。React/Reduxjqueryでいいやおじさん(30半ば)なのだけども、react使う仕事の依頼が入りそうなのもあっていいかげんやらないとなーと頑張って試してみました。軽い気持ちでちょっくらやってみっかと始めたら客仕事の合間にやってたってのもあるけどあれもやりたいこれもやりたいってやってたら2ヶ月ぐらいかかってしまった。Reactとりあえず使ってみた感想としては流石人気のフレームワークなだけあって慣れると使いやすい。日本語の情報が少ない気がするのでgoogle翻訳さんにはよく頼りました。一人作業で、そこまで気にしてソース書いてる訳ではないのですがそれでもjqueryに比べてかなり整理して作れると思います。当然だとは思いますが初回の表示とかページ遷移も体感はかなり早くなりました。styled-components折角component指向だしcssもまとめたい、ので多分Reactでやるなら使った方がいいのかなとは思うただ、csscombとかが対応してないっぽくて微妙に快適でない。エディタの設定頑張ればいいだけかも、ですが。SSR今はSSRは不要とかって情報も見かけた気がするのでshare用のOGPとかだけview(blade)わけて切り替えればいいや、と思ったのだけどもどうなんだろう?ちょっと様子見中ですが更新してまだ一週間たってないから誤差の範囲の可能性もあるけど微妙にアクセスさがった気がもする。やった方がいいような気はしてる単純に作りが駄目なだけかもだけど入れるとしたらlaravel-server-side-renderingとかなのかな?やった事ないからしらんけど。ReduxReact自体は以前Vueとか軽ーく触っての前知識とかコンポーネント指向ってやつが多少頭にあったのでわりとすっと入ってきたのですが、Reduxはあんまり馴染みの無い概念?というかなんというかだったので結構慣れるのに時間がかかりました。今も若干思ってるけど、でもまぁきっと必要な事なんでしょう。hooksっていうのがあるのを知って、hookでやった方が簡単便利。余談(フロントのフレームワーク)angularとかbackboneとかvueとか試したり仕事でも多少は利用する事はあるにはあるのだけど、この辺りすぐ移ろうのでほんとやめてほしい。別にどれもかわらねぇだろうって気はしなくもない。流行色みたいに誰か偉い人がこのフレームワークで行っちゃいましょう。決めてくれたらいいのにな。React/Reduxのまとめ文句ばっかりだけど、React使うならReduxは使った方がいいだろうなーとは思いました、ただ慣れるまでが面倒よね。慣れてしまえば管理はしやすいと思います。今慣れた所でしばらく時間がたった時に自分で書いたにもかかわらずなんだっけコレ?現象がおこりそうで怖い。仕事では基本言われなきゃ今後もしばらくはjquery使うとは思う。codeに乗り換えました。エディタ変えると最初はストレス溜まる、けど慣れればまぁそこそこ快適です。Typescriptついでにtypescript使ってみました。Angular1ぐらいの頃にかるく触ってみたのだけども、まぁなんというか面倒くさいな、っていう印象でした。Googleに採用されたりして最近盛り上がってるっぽい様子なので再度チャレンジしてみました。使ってみた結果としてはやっぱり面倒だなって印象は変わりません。ググった記事みてもベタ褒めなのが多いので若干言いづらいけど、ただただ面倒。ツヨツヨの方に怒られそう。僕が使いこなせてないって話なだけかもですが、チームで動いてるような人だと違うのかなぁインターフェースとかジェネリクスとか無くても動くんだから別に無くて良くない?って思っちゃう。あとlinterでいちいち怒られるのが気になっちゃうので途中から大分ゆるめにしてました。テストコードアクセスあるかどうかもわからない適当個人開発にテストなんてやってられないぜ。laravelもreactテストコード書いてませんがやった方がいい、というか受注仕事とかだとまず必要だろうなーというのはなんとなく実感しました。気づいてない所でエラーとかおこってる箇所結構ありそうだなーと、テスト書きましょう。