React + TypeScript: Apollo Clientで操作エラーを扱う - Qiita
Apollo ClientはReactで使える状態管理ライブラリです。ローカルとリモートのデータをGraphQLで扱えます。本稿は公式サイトの「Handling operation errors」にもとづく、操作エラーをどう扱ったらよいかについての解説です。Apollo Clientでクエリを使うための基礎はすでに学んだことが前提となります(まだの方は先に「React + TypeScript: Apollo ClientのGraphQLクエリを使ってみる」をお読みください)。ドキュメントの邦訳ではなく、日本語で説明し直しました。原文から省いた部分もあり、逆にわかりにくいところは補っています。 Apollo ClientがGraphQLサーバーで操作を実行するとき、さまざまなエラーに遭遇するかもしれません。Apollo Clientは、エラーの種類に応じて正しく扱えるよう、エラーが起こった
実装例から見る React のテストの書き方 - Cybozu Inside Out | サイボウズエンジニアのブログ
2024/04/17: 更新 内容を更新した記事を書きましたので、よかったらこちらも併せて、ご覧ください。 zenn.dev こんにちは！フロントエンドエキスパートチームの@nus3_です。 kintone のフロントエンド刷新プロジェクト（フロリア）では、品質を保ったまま開発を加速させるためにフロントエンドのテストを積極的に行っています。 今回はそんなフロントエンドのテストの実装例をいくつか紹介します。この記事がフロントエンドのテストを行う上での参考になれば幸いです。 テストに使用する主なパッケージ コンポーネントのテスト 補足: Testing Library の記法をチェックしてくれるeslint-plugin-testing-library カスタムフックのテスト 補足: React v18 では @testing-library/react の renderHook を使う 参考
React Flow めっちゃいいぜ
はじめに 今回の記事の結論はタイトル通り『React Flowめっちゃいいぜ』です。 こんにちは。株式会社Red Frascoの根本(github: tkcel )と申します。普段はフロントエンドを主に担当することが多いです。 この前個人開発中に以下の壁にぶち当たりました。 React（Next）でぐりぐりできるフローチャートみたいなものを作るにはどうすればいいのか？ 描画系のサービスはcanvasで作る方がいいのか？DOMに落とし込む方がいいのか？ 同じような悩みを持っている方がたくさんいる気がする（？）のですが、なかなか日本語検索でヒットしないので、今回記事を書こうと思いました。 React Flowとは？ まずは、公式サイトからの翻訳から。 ノードベースのエディターとインタラクティブなダイアグラムを構築するための高度にカスタマイズ可能な React コンポーネント MIT ライセンス
Reactの技術質問！！これで面接を圧倒すべし！
最近フロントエンドの副業案件の面接を受けていて、聞かれた技術質問や準備しておいた方が良い質問をまとめます。(実務経験 約2年) 今回何回か面接をしましたが、正直技術質問って普段普通に実装していてもそれを言語化して答えるのって結構難しいです。 面接はコミュ力ではなくて準備力です！ しっかり準備して挑みましょう！ 前提 面接を受けたときのスキル感は下記です。 フロントエンドが主戦場で、api周りはNode.jsで基本的なApiであれば対応可能。 インフラはそこまで経験なしといった感じです。 応募ポジション: フロントエンドエンジニア 応募先のフロントエンドスタック: Next.js, TypeScript 実務経験: 1年8ヶ月 言語、フレームワークの実務経験年数 Nuxt.js(Vue) ... 1年8ヶ月 Next.js(React) ... 半年(個人開発では2年触っている) TypeS
Roasting 0ktapus: The phishing campaign going after Okta identity credentials
Multi-factor authentication (MFA) is often implemented as a form of enterprise identity security to protect organizations against credential theft , dictionary attacks, and brute force techniques. But what if MFA is intercepted by a fraudster? In the cyber arena, where there is a continuous arms race with offensive and defensive strategies trying to outcompete each other, techniques that overcome
Reactでセレクトボックスを実装する方法【コピペ→書き換えるだけ】 - Qiita
序 Reactでセレクトボックスを実装する方法です。 調べて時間がかかったので、自分用も兼ねて記事にしました。 サンプルコード(そのままコピペ) export const App = (props) => { const arr = ["りんご","みかん","ぶどう","いちご"] let txt = "みかん" function method(data){ txt = data } return ( <> <select onChange={(e) => method(e.target.value)} value="0"> {arr().map((data, index) => { return <option value={data}>{index + 1}. {data}</option>; //選択肢はこんなかんじ // 1.りんご // 2.みかん // 3.ぶどう // 4.
MS、管理者の認証情報を悪用する「MagicWeb」について警告
印刷する メールで送る テキスト HTML 電子書籍 PDF ダウンロード テキスト 電子書籍 PDF クリップした記事をMyページから読むことができます Microsoftは米国時間8月24日、2020年に発生したSolarWinds製品に対するサプライチェーン攻撃の背後にいたハッキンググループが、企業の認証システムをバイパスする新たな手法を用いていると警告した。 この攻撃者らは、Microsoftが「MagicWeb」と呼ぶ極めて特殊な手法を用いることで、セキュリティ防御策をすり抜け、ネットワーク内に確固たる足掛かりを築けるようになる。ただし、Microsoftが追跡しているこのハッキンググループ（同社は「Nobelium」と呼んでいる）は今回、サプライチェーンを狙った過去の攻撃とは異なり、MagicWebによって管理者の認証情報を悪用する攻撃を展開している。 米国と英国は、Nobel
React + Rails + AWS Fargate の構成を実現したい - 05 バックエンドのテスト整備編(RSpec) - Qiita
bundle exec rspec .F Failures: 1) Task#valid? タイトルがnilの場合 is expected to be falsy Failure/Error: it { is_expected.to be_falsy } expected: falsey value got: true # ./spec/models/task_spec.rb:16:in `block (4 levels) in <top (required)>' Finished in 0.03577 seconds (files took 0.72953 seconds to load) 2 examples, 1 failure Failed examples: rspec ./spec/models/task_spec.rb:16 # Task#valid? タイトルがnilの場合
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
TECHFUND、プログラミング言語「Rust」の財団へ加盟を発表
Tips for Using TypeScript With React in a Large Code Base
9/23開催「Rust.Tokyo 2022」セッションとスケジュールが公開、参加登録も開始 | gihyo.jp
Twilio Hackers Scarf 10K Okta Credentials in Sprawling Supply Chain Attack
How to Memoize Functions and Values in JavaScript and React
Interacting with form data using Next.js and Hygraph
NYFDS Cybersecurity Regulation Address MFA Hurdles - Duo