React 18に備えるにはどうすればいいの？ 5分で理解する - Qiita
React 18はReactの次期メジャーバージョンで、2021年の6月にalpha版が、11月にbeta版が出ました。また、Next.js 12でもReact 18のサポートが実験的機能として追加されました。React 18の足音がだんだんと我々に近づき、アーリーアダプターではない皆さんの視界にもいよいよReact 18が入ってきたところです。 特に、React 18ではServer-Side Rendering (SSR) のストリーミングサポートが追加されます。現在ReactでSSRを行いたい人の強い味方としてNext.jsが存在しているわけですが、Next.js 12でもReact 18を通してストリーミングの恩恵を受けることができます（Next.jsではSSR Streamingと呼んでいるようです）。また、厳密にはReact 18とは別ですが、React Server Comp
2020年に立ち上げたWebフロントエンド構成の振り返り
こんにちは、よしこです。 株式会社ナレッジワーク というスタートアップで、2020年4月の創業時から一人目のフロントエンドエンジニアをしています。 初期に考えて組み上げたスタックで1年半ほど開発・運用してみて、なかなか快適に日々開発ができているので 新規開発のプロダクト立ち上げ時にどのようにフロントエンドを構築したのか？ 立ち上げから1年以上開発・運用を続けてきた今、それらの選択はどうだったのか？ を記事にして振り返り、公開したいなと思いました。 （プロダクトの内容はステルスで進めていてあまり対外的な発信ができないので、かわりに技術的なところはどんどんオープンにしていきたいなという気持ちがあります） いろいろな項目ごとに振り返りたいので、この記事は各項目を横断するindexとして項目ごとの概要を簡単に説明し、深堀りは項目ごとに追って詳細な記事を書いていく予定です！ 前提 プロダクトとしての
Reactベストプラクティスの宝庫！「bulletproof-react」が勉強になりすぎる件
Reactアプリケーションのアーキテクチャの一例として公開されているGitHubリポジトリ「bulletproof-react」が大変勉強になるので、私自身の見解を交えつつシェアします。 ※2022年11月追記 記事リリースから1年ほど経過して、新しく出てきた情報や考え方を盛り込んだ続編記事を書いていただいているので、こちらも併せて読んでいただければと想います（@t_keshiさんありがとうございます！）。 ディレクトリ構造が勉強になる まずはプロジェクトごとにバラつきがちなディレクトリ構造について。 ソースコードはsrc以下に入れる bulletproof-reactでは、Reactに関するソースコードはsrcディレクトリ以下に格納されています。逆に言えば、ルートディレクトリにcomponentsやutilsといったディレクトリはありません。 たとえばCreate Next Appで作成
[メモ] Node.jsで開発するにあたっての基礎知識まとめ - Qiita
はじめに この記事は自分がNode.js未経験の状態からNode.jsのプロジェクトに携わって学んだことを忘れない様にメモしておくための記事です。 今はプロジェクトを離れてNode.jsに関わっていないため、思い出すためのメモとしてまとめました。 各ツールの役割を解説する事で、開発時に知識として必要なキーワードを効率よく知る事を目的としています。 私自身常に最新の情報を追えていた訳ではないので、情報としては古い可能性があるかもしれませんのでご注意を。 また、ツールの導入の仕方はバージョンアップによって変わる事があり、都度公式の最新の情報をチェックすべきであり、かつ今回の趣旨ではないため省略します。 実際こちらの記事を記載中にバージョンアップによって色々と変わったツールが散見されました。 より詳しい情報が欲しい方には 私はある程度自力で試行錯誤しながら学んだ後でこの本に出会ったので、本の内容
![[メモ] Node.jsで開発するにあたっての基礎知識まとめ - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/1381921ab94f316189d30dc041d9ff9d8d271c16/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCJUUzJTgzJUExJUUzJTgzJUEyJTVEJTIwTm9kZS5qcyVFMyU4MSVBNyVFOSU5NiU4QiVFNyU5OSVCQSVFMyU4MSU5OSVFMyU4MiU4QiVFMyU4MSVBQiVFMyU4MSU4MiVFMyU4MSU5RiVFMyU4MSVBMyVFMyU4MSVBNiVFMyU4MSVBRSVFNSU5RiVCQSVFNyVBNCU4RSVFNyU5RiVBNSVFOCVBRCU5OCVFMyU4MSVCRSVFMyU4MSVBOCVFMyU4MiU4MSZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMUUyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9ZjdjMDQwZGNkZmQ5NzZhZTYwNzMzOWYwYTRkYjA5NTY%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBmcm9tX1Vua25vd24mdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTUwOTJiNjAwOTJkZTIwMTFkZWU5N2IyNGI1YzkzZmI2%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D8a3f41848d302086769bd1781b5c3d87)
東京ラビットハウス - BOOTH
技術書典などで技術同人誌を出しています。実践プロトタイピング 〜Webフロントエンド＆バックエンドでプロトタイピング〜(¥ 1,000), TypeScriptとクリーンアーキテクチャで最高の開発者体験（DX）(¥ 700), Effective React Hooks(¥ 1,000), Universal JavaScript FRAMEWORKS 電子版(¥ 1,000), マッハレビュー 39本勝負 -未映像化作品こそ読め！-(¥ 0), マッハ新書: 暗号技術を完全に理解した気になれる本(¥ 500), JavaScriptで覚える暗号通貨入門#1 Bitcoin完全に理解した
くるみ割り書房 ft. React - BOOTH
「仕事で使える React 本」といえばコレ❗ 超・実践的な React が学べると評判の『りあクト！』シリーズ。 技術同人誌として異例の累計 2.5 万部を突破、現在 BOOTH 技術書カテゴリでも上位を独占しています。 現場のエンジニアの方々から絶大な支持をいただき、各社で読書会が開かれたり、新人研修用の教材として使われたりしています。 フロントエンド初心者の新人とその先輩の会話によって解説が進むので頭に入りやすく、React 学習時に引っかかりやすいポイントや抱きがちな疑問に対しても丁寧にフォローしていきます。 どこよりもわかりやすく、どこよりも実践的な React 本の決定版との自負を持って提供しています。 🔔 くるみ割り書房をフォローしていただくと、新刊・更新情報や紙の本の入荷状況などをメッセージで随時お知らせします。
より良いReactJS開発者になるための10のヒントとコツ - Qiita
より良いReact開発者になり、より優れたコードを書き、コーディング面接で抜き出るため、Reactの技量を改善するすぐに使える知識です。 さあ、皆さん。始めましょう。 1. Reactフックを使った関数コンポーネント フックはReact v16.8で導入され、Reactの関数型プログラミングを大きく向上させました。Reactフックで、クラスコンポーネントの代わりに関数コンポーネントが使えますし、使うべきです。しかし...関数コンポーネントとステートとは？ライフサイクルメソッドとは？ 怖がる必要はありません。Reactフックを使えばできます。 例をいくつか見てみましょう。 これは、クラスを使う従来の方法です。次のようにuseStateフックが使えます。 簡単に見えますか？その通りです！useStateフックを使って、初期状態を空の文字列（''）に設定し、現在の状態（value）とその状態を変
フロントエンドエンジニア(React)の技術質問 - Qiita
What is this 記事？ この記事は、Webフロントエンドエンジニア(React)として働いてきた私が今まで受けてきた面接での技術質問と受け答えをまとめていくものです。Vueの人は置き換えて読んでみてください。 色々質問はあったが多く聞かれたものをまとめています。 指摘などありましたらコメントください。 2022/8/28追記 この記事を書いてから1年弱経ち、内容の更新が必要だと思う箇所があるので折を見て更新したい。単に私の回答を示しているだけなので、回答は模範解答を保証しておらず、丸呑みはせず、自分ならこう答える！という答えを各自模索してみてください。現在、採用側としてフロントエンジニアの面談にも入るようにもなり、考えが変わってきたからです。 質問集(基本編) ・React Hooksはどのような問題を解決しているのか？ 複雑になりがちなクラスコンポーネントを減らせる。 また、フ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
aws amplify