ゆめみのフロントエンドコーディング試験の題材で React の勉強をしました - Mitsuyuki.Shiiba
ちょっと前にツイッターで見かけた、ゆめみのフロントエンドコーディング試験 フロントエンドコーディング試験 「RESAS API を使用して、都道府県別の総人口推移グラフを表示するSPAを作る」っていうお題 React の勉強をするのにちょうどいい題材だなぁって思ったのでやってみた。課題を公開してるってことは「やってみてもいいよ」ってことかなと思ってるんだけど、もし違ったら GitHub のリポジトリーを private にするので連絡ください 1週間でやらないといけないところを2ヶ月近くやってるし、コミットログも特に何も考えずにポイポイ書いたから、全然だめなんだけど、でも、色々勉強になったので、とてもよかった。楽しかったー！ つくったもの こんな感じ これでおわりにするー pic.twitter.com/K8zhrRUp54— Mitsuyuki Shiiba (@bufferings)
デザイナーでも分かる範囲のReact、その書き方と学び方 - Qiita
これは何 「デザイナーもReact書いてくださいよ」って空気になったときに読むと役立つかもしれない記事です 基本的に筆者が学んだ流れを記載しています そのため、世間一般のベストプラクティスではないと思います エンジニアの方から見ると邪道な流れ・説明の仕方かもしれませんが、デザイナーに教える上での分かりやすさを重視していますのでご了承ください この記事の中で使っているコードはこちらのリポジトリで公開しています コミットを辿ってもらえれば、各セクションの内容が全て見れます ※言い訳がましいですが、筆者もReactに精通している程ではなく「デザイナーにしては割と知ってる」レベルです もし説明に間違いや不足があれば編集リクエストをお願いします 対象読者 Web or UIデザイナー HTMLとCSSは普通に書けるけど、Reactはほぼ全く触ったことがない人 1人で完全に実装したいってほどではないけ
React を深く知るための入り口
Reactに対する見方をアップデートする 国内外の優れた開発者の方による React の各論の記事は枚挙にいとまがありません。しかし、React の入門を一通り終えた方に向けの浅く広い総論はあまり見かけません。 React の公式ドキュメントのトップページに掲載されている短い3つの文章があります。この React の本質を表現した文章を掘り下げることが、初学者のステップアップにつながるのではないかと考え、各章に対して注釈を加えました。 React について少し深く知ることで、さらに React を好きになったという方を一人でも多く増やしたい。その思いから本記事を執筆しました。 本記事は React の考え方を知ることで、React に対する見方をアップデートすることを目的としています。 Reactとは何か。それはUIを構築するためのJSライブラリである React公式ドキュメントの一文 R
Vue.jsやReactなど、JavaScriptライブラリのコードスニペットを利用できるVS Codeの拡張機能 -Snipsnap
サポートしているJavaScriptライブラリの一覧（上記以外にもたくさんあります） Snipsnapは現在のプロジェクトで使用している言語やパッケージに基づいて、ライブラリで使用可能なスニペットをナビゲートし、必要なスニペットを選択します。 Snipsnapのインストール Snipsnapのインストールは、VS Code Marketplaceから。 VS Codeで開いたら、「Install」をクリック Snipsnapの使い方 Snipsnapは、手動でアクティブ化する必要はありません。ワークスペースフォルダにpackage.jsonファイルが含まれ、すぐに使用できます。トリガーが必要な場合は、コマンドパレットのReload Windowを使用します。 設定 利用可能な設定オプションは、スニペットのリクエストから特定のライブラリを除外することだけです。Snipsnapはロックファイル
Webpackを一歩一歩確実に理解してReact + TypeScript環境を作る (2022/10/31 追記) - Qiita
2022/10/31 追記 2022年時点ではWebpackでReactの環境を構築するより、Viteを用いて環境構築するほうがメジャーになっています。 筆者としても新規開発するならWebpackより、Viteの方で構築することをおすすめします。 ViteではReactのビルド用設定はPluginとしてパッケージされており、Webpackのように設定が必要ではありません。 下記はWebpack v4の話であり、すでに過去の物となっています。 ※自分のブログに投稿したのものと同じです。 https://mr-ozin.hatenablog.jp/entry/2020/06/20/043243 動機 毎回 npx create-react-app で React アプリを生成していて Webpack の勉強から逃げていたが、いい加減向き合いたいと思ったため。 昔 Webpack に入門しようと
ReactはなぜFiberで書き直されたのか？Reactの課題と将来像を探る
先日行われたFacebookの開発者向けイベント「F8」で、React Fiberの発表が行われていました。 といっても、React関連の新しいプロダクトが発表されたというわけではなく、Reactが一から書き直されたということのようです。 ReactはなぜFiberで書き直されねばならなかったのか？Fiberが解決しようとした課題は何なのか？ その答えを聞くために、React Fiber現状確認というブログエントリで大変詳細にFiberの事を解説されていた小林徹 (Twitter: @koba04)さんに、実際のところを詳しく伺ってきました。 React Fiberとはなんなのか、そしてReactの将来像を探ってみます。 React Fiberとは？ 白石 React Fiberってなんですか？まずは概要を教えてください。 小林 Facebookが先日のF8カンファレンスで発表した、Rea
React+Redux未経験者のプロジェクト受入 - Qiita
自己紹介 渡辺 貴明 EngFrontend follow me! アジアクエスト株式会社 フロントエンドエンジニア 今日の話 React未経験者が、 Reduxのプロジェクトにスムーズに参加するため 何をしたか？ 想定する状況 ソースはreact-redux-universal-hot-example を元に複雑にした感じ 大事 アーキテクチャはこんな感じ これから物量をこなす段階 新しく人を追加する ES5のjsはできるがReact触ったことない 必要なこと Reactを覚える必要がある Reduxも覚える必要がある BFFでのAPIの叩き方も覚える必要がある ES2015も覚える必要がある 問題 Reactだけ覚えても仕事に入れない 丁寧に覚える時間はない しかし、覚えないと渡せる仕事がない やったこと 専用のチュートリアル的なものを作成 最小構成のサンプルを作って真似して書いてもら
FluxとDDDの統合方法 - かとじゅんの技術日誌
おはこんばんにちは、かとじゅんです。 久しぶりにブログを書く…。最近、趣味でAngular2やらReactやらやっています。やっとWebpackになれました…。 さて、今回のお題は「FluxとDDDの統合方法」について。Angular2を先に触っていましたが、FluxといえばやはりReactだろうということで途中で浮気してReactで考えています。Angular2でもできるはずですが、今回はReactで統合方法*1について考えてみたいと思います。一つ断っておくと、FluxはDDDと統合することを想定していない設計パターンなんで云々とかはここでは考えていません。それはこのブログ記事を読む読まないに関わらずご自身で判断されてください。ソースコードについては、Githubへのリンクを一番下に書いてあるので興味がある人は参考にしてみてください。 Fluxって何？ まず基礎ということで、Flux i
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
