【入門】フロントエンドのテスト手法まとめ - Qiita
はじめに 自分は2021年に新卒でweb系の開発会社にフロントエンジニアとして入社し2022年で2年目になります。 実務ではReact×TypeScriptを利用したフロント周りの開発をメインで行なっていなす。 今回は実務でNext.jsプロジェクトにテストを導入することになり「React-Testing-Library」と「Jest」について改めて学び直したのでその内容を紹介します。 はじめに「React-Testing-Library」と「Jest」の概要を説明しその上で具体的なテストコードを何パターンか書いていきます。 この記事の対象者 フロントエンドのテストの概要を知りたい人 React-Testing-LibraryとJestについて知りたい人 具体的なテストの書き方を学びたい人 なお本記事では、React-Testing-Libraryの具体的な書き方についてをメインにしている
Reactハンズオンラーニング 第2版 - hitode909の日記
ひさしぶりに学習した。 Reactは2015年くらいには、趣味でVRハウスを作ったり、QRコードを読めるページを作ったり、仕事でも使ったり、React鳥貴族っていう名前のただの飲み会に行ったりと、しばらくは触っていたのだけど、チームの異動があって、最近は主にjsx-domという、JSXを書いてBabelを通すとcreateElementに変換してくれる、という独特の世界観のJSXを書いたりしていた。 jsx-domは、Styled Componentsを使えたり、useRefを使えたりと、ちょっとReactのエッセンスは吸われているものの、単にcreateElementしてくれるだけで、差分レンダリングとかは当然できない、という、シンタックスシュガーとしてJSXを使える、というもので、偶然発見して、React非導入アプリケーションにとっては便利じゃん、って使っていたけど、身の回りに使ってる
Reactハンズオンラーニングを読んだので感想
はじめに この記事はこれからReactやJavaScriptを0から学びたいと思う人に向けての記事です。 こちらの本を紹介したいなという、ただの布教記事です。 自分もそれなりにJavaScriptを書いて、Reactを勉強してきたと思っていましたが こちらの本を読んで、まだまだ序の口だったのだなと感じました。 もちろん、何年もJavaScriptを書いてきて、ここに書いてある事は常識だぜ！っていう人もいるかと思います。 ただ、最初にも書いたように、0から学ぼうとしている人に向けてなので そういった人にはとても有益な本になるのではないかと思います。 こちらのスクラップに自分で理解するためにコードのメモなどもとってあるので、参考にしてみてください。 本の構成について ツールの紹介 から始まります。 Github React Dev Tools Node などの説明があります。 JavaScri
React を深く知るための入り口
Reactに対する見方をアップデートする 国内外の優れた開発者の方による React の各論の記事は枚挙にいとまがありません。しかし、React の入門を一通り終えた方に向けの浅く広い総論はあまり見かけません。 React の公式ドキュメントのトップページに掲載されている短い3つの文章があります。この React の本質を表現した文章を掘り下げることが、初学者のステップアップにつながるのではないかと考え、各章に対して注釈を加えました。 React について少し深く知ることで、さらに React を好きになったという方を一人でも多く増やしたい。その思いから本記事を執筆しました。 本記事は React の考え方を知ることで、React に対する見方をアップデートすることを目的としています。 Reactとは何か。それはUIを構築するためのJSライブラリである React公式ドキュメントの一文 R
React テスト応用、テストに悩む人へ
2022-05-06 更新 「React でコンポーネントテストを書くといいらしい、 React Testing Library や jest でサンプルを参考に書いてみたが 現実どうやってプロダクトコードに合わせていけばいいか分からない」 そういった方が対象となる本を目指しています。 いろいろ調べて実践したものの下記のように感じた方に適しているかもしれません。 - 結局テストで何を担保しようとしているか分からない - React のテストでハマっているか、Jest でハマっているか分からない - モックとかスパイとかアプリケーションとは遠い出来事も多くてピンとこない 誤り・ご指摘あればフィードバックいただけると嬉しいです。 無料で配布していますが、気に入ったらサポートなどいただけると今後もこの本をアップデートし拡張していく気持ちになれるのでよろしくお願いします。
【React+TypeScript】Netflixのクローンを作るチュートリアル
【注意！】 2024年4月末にこちらの本の内容を大幅リニューアルしました！ https://note.com/terry10/n/nf0674af97617 ※こちらのZennのBookも5/7を目安にリニューアル内容を反映する予定です 多くの人に手に取って欲しいので、リニューアル後は期間限定で無料配布も検討しています。 こちらのツイートで無料配布について告知しています！ ↓ https://x.com/teriteri_code/status/1783358352447414464 --- React+TypeScriptを使ったNetflixの映画一覧を表示するアプリケーションのチュートリアルです。 学べる事 - ReactのFunctionComponent（関数コンポーネント）とTypeScriptの使用 - React Hooksによるstate管理 - TypeScriptで外
TypeScript で書く React コンポーネントを基礎から理解する - Qiita
この記事は Recruit Engineers Advent Calendar 2019 の 23日目の記事です。 TypeScript のプロジェクトで React コンポーネントを書いていると、コンパイラに怒られることがたびたびあります。ネット上にあるサンプルコンポーネントが JavaScript で書かれていると、プロジェクトにもってきたときにコンパイルできないということはよくあるんじゃないでしょうか。any でコンパイラを黙らせることもできますが、せっかく TypeScript を使っているので、安全に解決したいよねってことでこのような記事を書きました。 型定義は @types/react@16.9.17 にしたがっています。目次をみて、この程度のことはもう知っているよという方は react-typescript-cheatsheet をみてください。React + TypeScr
いまからはじめるReact - Qiita
この資料は 11/16(土)開催の勉強会 いまからはじめるReact の資料になります。 React未経験者/初学者向けに チュートリアルを通してReact(およびHooks)について学ぶためのものです。 そのため、サンプルコードには例外処理などが不十分な箇所があります。ご注意ください。 Reactとは？ Reactとは Facebookが中心となってオープンソースで開発されている ユーザーインターフェースを構築するためのJavaScriptライブラリです。 (2019/10/30現在、v16.10.2 が公開されています) React – ユーザインターフェース構築のための JavaScript ライブラリ https://ja.reactjs.org/ コンポーネント(部品)を作成し、これらを組み合わせることでSingle Page Applicationのような複雑なユーザーインター
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
