王道か邪道か？ タイムスタンプによるステート管理
Reactによるステート管理では、ある状態が変化したら付随して他の状態も変化してほしい場合があります。例えば、次のような場合を考えます。 チェックボックスが1つある。 チェックボックスの初期状態は、HTTP APIから取得したデータによって決まる。 ユーザーはチェックボックスを操作できる。 APIからデータを再取得する場合があり、その場合はチェックボックスの状態が再取得されたデータに従ってリセットされる。 皆さんは、このような要件をどのように実装するでしょうか。 やりがちな実装 まず、やりがちな実装を見てみましょう。 const apiData = useApiData(); const [isChecked, setIsChecked] = useState(false); useEffect(() => { setIsChecked(apiData.isChecked); }, [ap
GitHub CLI Extension でユーザーが使用してる言語のリストを取得
$ gh langs octocat +------------+---------+ | LANGUAGE | LINES | +------------+---------+ | Ruby | 204,865 | | CSS | 14,950 | | HTML | 4,338 | | Shell | 910 | | JavaScript | 48 | +------------+---------+ | TOTAL | 225,111 | +------------+---------+ https:github.com/octocat has 8 repositories Last updated after 2023-07-26 はじめに 複数のプロジェクトが organization に紐付いていて、 EM とかをやっていると人事から「あれ？うちってなんの言語使ってるんだっけ？」
Anyone can Access Deleted and Private Repository Data on GitHub ◆ Truffle Security Co.
You can access data from deleted forks, deleted repositories and even private repositories on GitHub. And it is available forever. This is known by GitHub, and intentionally designed that way. This is such an enormous attack vector for all organizations that use GitHub that we’re introducing a new term: Cross Fork Object Reference (CFOR). A CFOR vulnerability occurs when one repository fork can ac
真にチラつかないダークモードをついに実現したぞ。実現方法と気付きを書く | stin's Blog
真にチラつかないダークモードをついに実現したぞ。実現方法と気付きを書く2024/07/14 14:36 nextjsreact このサイトはダークモードに対応しています。なぜならダークモードは基本的人権だからです(要出典)。 しばらく、サイトに訪問した直後ライトモードとダークモードが切り替わってチラつく現象が発生していました。これを改善したので、実装方法と気付いたことを残しておきます。 ダークモードの実装方法一般に、ダークモードの実装方法は3タイプあります。 OSによるモード設定を反映する メディアクエリー@media (prefers-color-scheme: dark)を使うと、OS側でダークモードを指定している時だけ有効になるスタイルを書くことが出来ます。 JavaScriptでも判定が必要な場合はmatchMedia("(prefers-color-scheme: dark)")
話題のローコードツール「Dify」で生成AIアプリを作ってみよう！ - Qiita
Difyって何？ 少し前から話題の、プログラミングなしで生成AIアプリケーションを開発できるOSSです。 「Dify すごい」 でSNSを検索すると、驚き屋さんがみんな驚いています。このゴールデンウィークはAmazon BedrockとDifyの話題でもちきりでしたね。 元々は「GPTビルダーのOSS版ね。はい解散」という感じだったのですが、最近追加された「ワークフロー」機能がすごく便利のようです。 ちょっとしたアプリなら、ローコードで簡単に作れてしまうとのこと。 最近は自分でPCやサーバー準備して動かさなくても、SaaS版が公式から準備されたようです。無料プランもあります。 やってみた サインアップ 公式サイト右上の「Get Started」からサインアップします。 GitHub連携すると、いきなり開発画面に辿り着きました！いいUX。 「（いち？）から作成」よりワークフローを作ってみまし
LGの洗濯機がなぜか1日3.6GBもデータ通信をしていると持ち主が困惑、LGが調査に乗り出す
LGのスマート洗濯機が、1日に3.6GBもの膨大なデータを通信をしていると報告するX(旧Twitter)の投稿が大きな話題となりました。 Homeowner Baffled After Washing Machine Uses 3.6GB of Internet Data a Day https://www.newsweek.com/homeowner-baffled-washing-machine-uses-3-6gb-internet-1862675 Your washing machine could be sending 3.7 GB of data a day — LG washing machine owner disconnected his device from Wi-Fi after noticing excessive outgoing daily data traf
You Don't Need Next.js | ドクセル
[beta] Next.jsクイズ2 • <p>にはなにが表示されるでしょうか？ /app/page.tsx "use client"; import { useCallback, useEffect, useState } from "react"; export default function Home() { const [date, setDate] = useState(); const fetchDate = useCallback(async () => { const response = await fetch("/api"); const data = await response.json(); setDate(data.date); }, []); useEffect(() => { fetchDate(); }, [fetchDate]); return ( <
Content-Disposition の filename という地雷。 (1個の観点で17個の脆弱性を見つけた話) - ぶるーたるごぶりん
English ver: https://gist.github.com/motoyasu-saburi/1b19ef18e96776fe90ba1b9f910fa714#file-lack_escape_content-disposition_filename-md TL;DR 1つのブラウザ、1つのプログラミング言語、15個の { Web Framework, HTTP Client ライブラリ, Email ライブラリ / Web Service 等} で脆弱性を見つけました。 見つけた脆弱性は、全て 1つの観点で発見した (多分 50-80 くらいのプロダクトの調査をした)。 RFC の記載では、（かなりわかりにくく）この問題に対する要件が記載されており、WHATWG > HTML Spec の方はしっかりと書かれているといった状況にある。 この問題は、 Content-Dispo
Python 3.8 の概要 (その1) - Assignment expressions - atsuoishimoto's diary
古来、Pythonでは「代入は文であるべき！」と一貫して主張してきました。 C言語などでは、代入は足し算や掛け算と同じ、値を計算する「式」で、たとえば a = (b=100) / 2; と書くと、b には 100 を代入し、a に 100/2=50 を代入します。1+1 は 2 という値になる 式 ですが、b=100 も同様に値が 100 となる 式 なのです。 Pythonでは、代入は式ではないので、こういう書き方はできません。 Pythonの代入は、足し算などの演算子の仲間ではなく、if や for のような制御文の仲間で、あまり自由な書き方は出来ないのです。 Python FAQ では、その理由として Python の式中での代入を許さない理由は、この構造によって起こる、他の言語ではありがちで見つけづらいバグです: if (x = 0) { // error handling } e
私の考えるReact Queryベストプラクティス - Qiita
はじめに こんにちは。株式会社HRBrainでインターンをしている安井です。 この記事では今業務で採用しているReact Queryの特性を生かした設計を考察してまとめていきます。 本記事はHRBrain Advent Calendar 2022の24日目の記事です。 前提 本記事で使用するライブラリ等のversion React: v18.2.0 TypeScript: v4.9.3 React Query（TanStack Query）: v4.19.1 axios: v1.2.1 vite: v4.0.0 React Queryはv4から名前が変更されTanStack Queryとなりましたが、記事の中ではReact Queryと呼ぶこととします。 使用するOpenAPIの定義 https://jsonplaceholder.typicode.com/posts また、本記事で使用す
Parse, don’t validate
Historically, I’ve struggled to find a concise, simple way to explain what it means to practice type-driven design. Too often, when someone asks me “How did you come up with this approach?” I find I can’t give them a satisfying answer. I know it didn’t just come to me in a vision—I have an iterative design process that doesn’t require plucking the “right” approach out of thin air—yet I haven’t bee
Web の仕様を眺めるシリーズ prefers-reduced-data | Offers Tech Blog
Offers を運営している株式会社 overflow の あほむ でございます。 本記事は Chrome Platform Status からなんとなく Proposed なステータスのフィーチャーを取り上げて、そのプロポーザルを眺めてみるシリーズです。前回は CSS Custom Highlight API でした。 prefers-reduced-data データーセーバー設定を検出するメディアクエリ 今回は Media Queries Level 5 prefers-reduced-data を眺めてみます。本当に眺めるだけで深入りしないので概要のみのライトな記事とご認識ください。 Editor's Draft ですが Working Draft にもあがっています。Chrome Platform Status で Proposed ですが仕様がリリースされてからはそれなりの年月が
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HARPA AI | AI Agent for Your Browser
Valibot: The modular and type safe schema library
1Password のオートコンプリート機能をサービス提供側で無効化する
Bardeen AI: Workflow Task Automation Software
20230118 kazaneya TeckTalk3 Data Standards and Open Data Initiatives by the Digital Agency of Japan
Obsidian - Sharpen your thinking
GitHub - vectordotdev/vector: A high-performance observability data pipeline.
Jsonnet - Jsonnet Configuration Language
