前にもここにぽちぽちと書いたりしたけれど、1年とすこし前。こどもたちが大きくなって手狭になったのをきっかけにマンションからいまの家に住み替えたのです。で、住み替えたのはいいけれど、あたらしい家はともかく広く、そして築古の家だったので、断熱性能も高くない。つまり、マンション時代とくらべて、光熱費がドカンと上がったんですね。おりしも世界はエネルギー価格高騰の時代。出てきた電気代にほんと目ん玉飛び出るかとおもったんですよ…。 冷暖房効率がもともと悪いうえに、暖房としてエアコンをつかっていたのでなおさらです。毎月これではやってられん、なんとかせんといかん、ということで、あわてて家庭用太陽光発電の導入を決めました。せっかくじぶんで持ってる建物だし、ね。 家庭用太陽光発電。まあ賛否両論というかえらく嫌われているというか、人によっては本当にボロクソ言われていて。でもまあそんななかいろいろ調べてみると、少

東京とその近郊にお住まいのみなさん。 みなさんは「東京をやって」いますか？ 先日、ある場所で「東京をやっていこうとしている人たち」というフレーズを耳にした。 その時フレーズが暗に指し示していたのは、たとえば、タワマンに住んでいるパワーカップルの人たちだったりした。 ただ東京に住んでいるのでなく、彼／彼女らは「東京をやっていこうとしている」というのだ。どういうことか。 正反対の人々を連想すれば理解しやすいかもしれない。東京には「東京をやっていこう」としているわけではない人たちも住んでいて、そちらは二種類に大別できる。 ひとつは、東京をやっていこうとしていなくても自動的に東京的なライフスタイルや佇まいになる人たち。親の代から都内やその近郊の邸宅に住んでいて、なんの屈託もなく東京で暮らしている人たちだ。 もうひとつは、首都圏の不動産持ちではなく「東京をやっていこう」としているわけでもない人たち、

本日10X Culture Deckの組織・人事パートをアップデートしました (以下はその一部です)。 この2022/10をめがけて10Xという企業組織の進化を進めてきた、そのアウトプットの片鱗になります。 本記事ではこの組織のアップデートの背景として私が考えたことをお伝えするために書いています。 最近の私の時間投資

mutexの桝田です！ Reactのデータフェッチに、Vercel社が提供する「SWR」やTanStackコミュニティが提供する「React Query（TanStack Query）」が使われることが多くなってきています。 これらのライブラリは単なるフェッチだけでなく、キャッシュやデータの更新を担ってくれます。また、Reactが志向する「宣言的」な記述を体現できることも大きなメリットです。 本稿では、（我々が採用する）React Queryにフォーカスし、React Queryを使って実現している状態管理について説明します。SWRを普段お使いの方に関してもかなり共通する部分が多いのではないかと思います。 1. 対象読者 Reactのデータフェッチライブラリの使用を検討している方 普段SWRやReact Queryを使用している方 普段Reactを使用するすべての方

2022年度リクルート エンジニアコース新人研修の講義資料です

「フロントエンドLT会 - vol.8」で発表したスライドです。 https://rakus.connpass.com/event/255095/

2022/08 スクラムフェス仙台でプレゼンテーションしたスライドです。 https://confengine.com/conferences/scrum-fest-sendai-2022/proposal/17013/5000dai ソフトウェア開発者としてのキャリアやスキルをどのように広げていくかについて悩むことは多いと思います。日々技術は変化していっているのに自分の勉強がおいつかなくて、まわりのすごい人たちに焦り、何もできていない自分にがっかりする。自分はそんな日々を過ごしてきました。 ですが、そこからほんの少しずつでも視点をずらしてジェネラリストという道を選び、ソフトウェア開発に徐々に貢献できるようになり、自信をもてるようになったことも事実です。 ソフトウェア開発者として、アジャイルコーチとしてジェネラリストを選択した理由、ジェネラリストとしてやっていることなど、具体的な経験を交え

じゅじゅ @jujulife7 完全無料で学べる有名企業のエンジニア研修資料（最新版）をまとめました。 エンジニアの方にお勧めなのは勿論ですが、総合職・デザイナー職がエンジニアと円滑にコミュニケーションとるための基礎知識が求められる時代かと思うので、文系職の方も是非保存して勉強みてください。 pic.twitter.com/sDek1U43q5 2022-07-21 22:50:52

いろいろと窮屈そうに生きているあの人のために、 今は少し気楽に生きている自分のロジックを思いつくままにアウトプットしてみようと思った。 偉そうに見えても、笑って許して。 「ちょっと」を毎日。 現状を変える一発逆転があると思うかもしれないけど、どうやら近道はないみたいです。 毎日少しずつ、少しずつ努力を積み重ねるしかない。まったく人生ってやつは。まったく。 毎日努力している人にはどんな天才も絶対に及ばない。断言していいです。 大事なのは毎日（毎日じゃなくてもいいんだけど、常日頃）続けること。 とにかく結果を焦らない。落ち着けって。 今日の努力が実を結ぶのは、だいたい1年後。のんびり行くしかないですよ。 ちょっとだけやる。「ちょっと」が超大事。 ダイエットしようと思って、いきなり5キロ走るから辛くなる。初日は着替えて玄関出るところで終了。 だけど、やろうと思ったらその日のうちにやる。絶対やる。

本記事は React best practices and patterns to reduce code を提供元の事前許可を得たうえで翻訳したものです。 元の記事に従いタイトルに「ベストプラクティス」と含んでいますが、実際にはベストプラクティスは規模や状況によって大きく異なります。 チームの状況にあわせて参考にしていただければと思います。 ===== これは全3パート中の第1パートとなる記事です。 パート1（この記事）パート2パート3 私は数年に渡っていくつかのプロジェクトで、React.jsを使った取り組みに参加してきました。様々なプロジェクトに取り組む中でいくつかの共通するパターンを見出したため本ブログでご紹介いたします。それではいきましょう。 1. reduxのactionsとdispatcherのためにカスタムフックを作成する私はreduxを使うことを好んではいませんが、いくつ

今日は「GitLabで学んだ最高の働き方」ということで発表していきたいと思います。 私、伊藤と佐々木はGitLabでソリューションアーキテクトをやっている者です。 GitLabは、オンプレミス用のソフトウェアと、GitLab.comも長年やっておりますのでぜひ使ってください。去年めでたく上場しましたので、さらにいろんな機能を追加して強力なDevOpsプラットフォームとして展開していきたいと思っています。 このセッションで共有したい内容の背景、これは個人的にGitLab社に参画した理由のひとつでもあるのですが、製品が魅力的であることともうひとつ、GitLabはご存じの通り、ご存じない方もいるかもしれませんが、従業員全員がリモートワークをしている企業です。 そこなら最先端のやり方での働きができるのではないか、という仮説が私の中にありまして、入社しました。 で、実際どうだったかというと、はい、最

GraphQL スターターパック | Prisma + NestJS + Next.JS製 個人ブログサイトをCloud Runで運用しよう 「GraphQLの仕様はなんとなく知っているけど、それを使ってどうアプリを作るのかいまいちイメージがわかない」 この本はそんなスキマを埋めるべく書きました。 近年ではReactをはじめフロントエンドの選択肢が豊富になっており、フロントエンドとバックエンド間のやりとりにはより汎用的かつ効率的な方法が求められます。 GraphQLはその選択肢のひとつです。本書では NestJS で GraphQLバックエンドを実装し、それをNext.jsから利用して、個人ブログサイトを構築してみます。 GraphQL開発の流れを体験し、ご自身のアプリ開発に役立ててください。 v1.10 refactor github deploy

本書『サバイバルTypeScript』は実務でTypeScriptを使う開発者のための入門書です。そして、このページはTypeScriptの特徴を最速で把握できるよう、数百ページからなる本書のコンテンツをつまみ食いした要約です。 » 本書ついて詳しく知る » とにかく今すぐTypeScriptを書いてみたい TypeScriptとは​JavaScriptのスーパーセットとなるプログラミング言語。静的型付け言語であり、プログラムの正しさが静的に検査できる。ライブラリやIDEなどの開発環境が充実しており、大きなエコシステムを持っている。Microsoftが2012年に開発し、オープンソースで公開した。» TypeScriptの特徴について詳しく知る » TypeScript誕生の背景について詳しく知る TypeScriptはJavaScriptのスーパーセット​スーパーセットとは、元の言語との

経緯 ここ6,7年くらいはバックエンドに関してはRails + EC2/ECSあたりのAWS環境を中心に過ごしてきたが、昨今はフロントエンドでReact/Vue + TypeScriptを書く機会も増えている。なのでこの際NestJS等でバックエンドを書けるようになれば言語のコンテキストスイッチの切り替えが容易になりそうと思った(ちなみにモバイルアプリはFlutterで書くのでDartだが、ではDartでバックエンドを書くかと言われると一人でそんな勇気はないわ...となるのでひとまず置いておく) 最近はinputとoutputを型注釈によって守れたりすることの主に開発体験方面への恩恵が個人的に大きくて、Rails以外で安住の地を見つけたいとは予々思っていた。なので先に挙げたNestJSに全ベットするわけではないにしろ何かしらフレームワークは試していきたい。 AppEngineは大昔に少し触

初めましてカナザワと申します。 普段は映像やグラフィックデザインのお仕事をしています。 今回はBlenderを使ったセルルックアニメーションや、映像作りにも使えるエフェクト表現について書...

ゲームエンジンや3Dソフトウェアを利用して高度な表現ができるこの時代でも、プリミティブな描画や動き、アルゴリズムから学べることは多い。それらをJavaScriptで書くクリエイティブコーディングという形で学べる手引書が本書となる。

そう感じている。 毎朝、改札で止まっているおじさんがいる。先にカバンから出すなどして準備しておけばよいものを、必ず直前で立ち止まってガサゴソしているため非常に目立つし、「邪魔だろ」と叫びたくなる。出社すると業務の半分くらいは「てめーがやれ」と言いたくなるようなことであり、会議の9割くらいは「それ今？」と思う。 退社してスーパーで買い物をしていると、お刺身のパックを見て「イカで空いたとこ埋めるんじゃないよ」と思い、広告の品という黄色のポップを見て「いつもこの値段だろうがよ」とパネルになった香取慎吾の胸倉を掴みたくなる。レジではおばあちゃんがリュックサックからセカンドバッグを取り出し、セカンドバッグから巾着袋を取り出し、巾着袋から財布を取り出し、律儀に小銭を探す後期高齢者特有のマトリョーシカを展開していた。帰る前にコンビニに寄ると、いつもいる店員さんに「クイックペイで」と伝え、毎回Edyを用意

Reactアプリケーションのアーキテクチャの一例として公開されているGitHubリポジトリ「bulletproof-react」が大変勉強になるので、私自身の見解を交えつつシェアします。 ※2022年11月追記 記事リリースから1年ほど経過して、新しく出てきた情報や考え方を盛り込んだ続編記事を書いていただいているので、こちらも併せて読んでいただければと想います（@t_keshiさんありがとうございます！）。 ディレクトリ構造が勉強になる まずはプロジェクトごとにバラつきがちなディレクトリ構造について。 ソースコードはsrc以下に入れる bulletproof-reactでは、Reactに関するソースコードはsrcディレクトリ以下に格納されています。逆に言えば、ルートディレクトリにcomponentsやutilsといったディレクトリはありません。 たとえばCreate Next Appで作成

ソウゾウの Software Engineer をやっています、@mookjp です。 8/10 の記事「メルカリShopsの技術スタックと、その選定理由」では、メルカリ Shops のアーキテクチャについて、その全体像を紹介しました。 この記事では、そのうちの BFF（Backend for Frontend） レイヤとして用意した GraphQL サーバについて、NestJS を使った実装例を交えて紹介します。 GraphQL とは GraphQL サーバ周辺の構成 NestJS とは GraphQL Module NestJS で Code First なスキーマ定義をする Object types の定義 Query と Mutation の定義 GraphQL スキーマの生成 スキーマの Breaking Change （破壊的変更）を防ぐ DataLoader を使って Bat