1年以上にわたる初めての技術書の商業執筆活動を終えての感想と今後挑戦したいという方へ -TypeScriptとReact/Next.jsでつくる実践Webアプリケーション開発 -｜たまにゃん｜note

サンプルアプリの開発本で実際に準備するサンプルアプリの元ネタですが、以下のNext.js Commerceを利用する事としました。理由としては検索、一覧、詳細、投稿、ログイン等アプリケーション開発における基本となる要素が詰め込まれており一通り実装する事で実力がつくと良い題材だと思ったからです。ソースコードなどは…

React のエンジニアが Jetpack Compose を勉強してみた – ┗┐＜(՞ਊ՞)＞┌┛

育休前は React と go をよく書いていましたが、育休が終わって Android の仕事につくことになったので、Jetpack Compose の勉強をしました。といっても自分ばズブの素人というわけではなく、Jetpack Compose が導入される前には Android のエンジニアで、確かマルチモジュールが世の中に出始めたかな〜ぐらいの時代で W…

HTMLとCSSの人が、Reactを学ぶのにぴったりな最高の一冊！ 解説がていねいで、すごく分かりやすい

HTMLとCSSだけではキャリアアップの限界を感じている、JavaScriptを今より使えるようになりたい、Next.jsやReactも気になるけどどこから手をつければよいか分からない、そんな人にお勧めの解説書を紹介します。 最近ではCSSにもReactの存在が感じられるようになり、FigmaでもReactを理解している方が便利だったりします…

React状態管理ライブラリ Zustandを使ってみた | DevelopersIO

こんにちは。データアナリティクス事業本部 サービスソリューション部の北川です。 Zustandとは ZustandはReactの状態管理ライブラリの一つです。シンプルで使いやすく、他の状態管理ライブラリと比べてもコード量が少ないです。 ちなみに同じ状態管理ライブラリ、jotaiもPoimandresが提供しています。 Jotaiに関しては…

React Server Componentsの仕組み：詳細ガイド | POSTD

React Server Components（RSC）は、ページの読み込みパフォーマンスやバンドルサイズのほか、Reactアプリケーションの書き方に近い将来大きな影響を与えることになる、素晴らしい新機能です。 Plasmicでは、Reactのビジュアルビルダーを開発しており、Reactのパフォーマンスには大きな関心を持もっています。 当社のク…

Chakra UIを薄く軽量に使う

はじめに この記事で説明しているChakraProviderの使い方は公式ドキュメントで推奨されているものではありませんのでご了承ください。 概要 ＠chakra-ui/reactではなく@chakra-ui/providerのChakraProviderを使う themeはextendThemeを使わずcomponentsのthemeを外す @chakra-ui/cliで必要な分だけの型生成を行う 実装例…

pixiv SketchのSSRをFluxibleからNext.jsにリプレースしました！ – pixiv inside

pixiv SketchのWeb版はReact + FluxibleでSSRを実現していました。 今回、FluxibleというライブラリをRedux Toolkit + Next.jsでリプレースした話をさせていただこうと思います。 このリプレースで狙った効果は、クライアントサイドのパフォーマンス向上と、開発容易性・メンテナンス性の向上の2つです。 背景 Next.js化…

【入門】フロントエンドのテスト手法まとめ – Qiita

はじめに 自分は2021年に新卒でweb系の開発会社にフロントエンジニアとして入社し2022年で2年目になります。 実務ではReact×TypeScriptを利用したフロント周りの開発をメインで行なっていなす。 今回は実務でNext.jsプロジェクトにテストを導入することになり「React-Testing-Library」と「Jest」について改めて学び直し…