Announcing Precomputed Reachability Analysis in Socket

Socket’s precomputed reachability slashes false positives by flagging up to 80% of vulnerabilities as irrelevant, with no setup and instant results.

Cursor + Figma MCP Server

Connect Figma directly to Cursor AI with MCP Server. Complete setup guide for design-to-code workflow, plus limitations and better alternatives.

2025-07-31のJS: Nuxt 3.18、Bun v1.2.19、SVG入門

JSer.info #743 - Nuxt 3.18がリリースされました。

Surprises and trends from this year’s Design Tools Survey results

Discover key trends from the Design Tools Survey including AI adoption, Figma’s dominance, and what’s next for UX designers in 2025.

Keeping Article Demos Alive When Third-Party APIs Die

Is there a way to build demos that do not break when the services they rely on fail? How can we ensure educational demos stay available for as long as possible?

The CSS if() function: Conditional styling will never be the same

Explore how the if() function works, see practical examples, and compare it to existing CSS conditional techniques.

opencode + kimi-k2 を動かす

Socket Now Protects the Chrome Extension Ecosystem

Socket is launching experimental protection for Chrome extensions, scanning for malware and risky permissions to prevent silent supply chain attacks.

The Math Is Haunted

A taste of Lean.

Introducing Socket MCP for Claude Desktop

Add secure dependency scanning to Claude Desktop with Socket MCP, a one-click extension that keeps your coding conversations safe from malicious packa...

OpenAI: Introducing study mode

New ChatGPT feature, which can be triggered by typing /study or by visiting chatgpt.com/studymode. OpenAI say: Under the hood, study mode is powered by custom system instructions we’ve written in …

Quoting Nilay Patel

Our plan is to build direct traffic to our site. and newsletters just one kind of direct traffic in the end. I don’t intend to ever rely on someone else’s …

Test-driven development with AI

Learn how AI transforms test-driven development (TDD) from a time-consuming chore into your secret weapon for building robust and bug-free applications.

Designing AI products that work for both users and the enterprise

Designing AI products isn’t just about users; it’s also about trust. Here’s what I learned about balancing usability with governance in enterprise UX.

Next.js 15.4 is here: What’s new and what to expect

Break down what’s new in 15.4, explore some hidden gems, and take a quick look at what’s ahead with Next.js 16.

My 2.5 year old laptop can write Space Invaders in JavaScript now, using GLM-4.5 Air and MLX

I wrote about the new GLM-4.5 model family yesterday—new open weight (MIT licensed) models from Z.ai in China which their benchmarks claim score highly in coding even against models such …

Build interactive React UIs for LLM outputs using llm-ui

Build smarter React apps with llm-ui. This guide shows how to stream Gemini API output, detect code blocks, and render syntax-highlighted content.

How to manage 20+ stakeholders without losing your mind

Practical strategies to classify, prioritize, and communicate with 20+ stakeholders so product managers can stay aligned and avoid chaos.

モジュールを外から見た振る舞いだけAIレビューさせる smoke-review

Introducing Scala and Kotlin Support in Socket

Socket now supports Scala and Kotlin, bringing AI-powered threat detection to JVM projects with easy manifest generation and fast, accurate scans.

Claude Code + Figma MCP Server

Learn how Figma MCP Server + Claude Code enables AI-powered design-to-code conversion. Setup guide, real limitations, and enterprise alternatives inside.

Why I think v0 is a great prototyping tool for designers

GenUI tools are reshaping UX workflows. See how v0 speeds up design, closes the dev gap, and challenges how we prototype.

How I debug faster with these Chrome DevTools Console features

Improve the old-fashioned debugging JavaScript workflow by effectively using some lesser-known Chrome DevTools console features.

Making a Masonry Layout That Works Today

I went on to figure out how make masonry work today with other browsers. I'm happy to report I've found a way — and, bonus! — that support can be provided with only 66 lines of JavaScript.

The Useless useCallback

Why most memoization is downright useless...

The many, many, many JavaScript runtimes of the last decade

Extraordinary piece of writing by Jamie Birch who spent over a year putting together this comprehensive reference to JavaScript runtimes. It covers everything from Node.js, Deno, Electron, AWS Lambda, Cloudflare …

TIL: Exception.add_note

Neat tip from Danny Roy Greenfeld: Python 3.11 added a .add_note(message: str) method to the BaseException class, which means you can add one or more extra notes to any Python …

Enough AI copilots! We need AI HUDs

Geoffrey Litt compares Copilots - AI assistants that you engage in dialog with and work with you to complete a task - with HUDs, Head-Up Displays, which enhance your working …

How to evaluate vibe coding tools for your enterprise

Enterprise guide to evaluating AI coding tools: two solution types, evaluation criteria, and a 7-step POC framework for teams.

AI + a16z Podcast: Vibe Coding, Security Risks, and the Path to Progress

Socket CEO Feross Aboukhadijeh and a16z partner Joel de la Garza discuss vibe coding, AI-driven software development, and how the rise of LLMs, despit...

Cookie を管理する非同期 API CookieStore

従来の JavaScript では Cookie の管理は `document.cookie` を使用して文字列で行われていました。しかし、文字列での Cookie 管理は面倒で間違いやすいです。また `document.cookie` は同期的に動作するため、Cookie の更新が完了するまでイベントループがブロックされてしまいます。さらに `document` オブジェクトに依存しているため、Web Worker や Service Worker などの非同期環境では使用できません。 このような問題を解決するために、非同期 API `CookieStore` が導入されました。`CookieStore` は非同期的に Cookie の読み書きを行うことができ、さらに Cookie の属性をオブジェクトとして扱うことができます。

How to Discover a CSS Trick

Do we invent or discover CSS tricks? Lee Meyer discusses how creative limitations, recursive thinking, and unexpected combinations lead to his most interesting ideas.

Catch frontend issues before users using chaos engineering

This article covers how frontend chaos engineering helps catch UI and UX issues before users experience them using tools like gremlins.js.

Next.js 15.4リリースなど: Cybozu Frontend Weekly (2025-07-22号)

1Password と遺言保管制度を用いたデジタル終活

筆者のように、インターネット上での生活が長く、かつエンジニアとして生きてきた人間には、一般の人には伝わりにくいデジタルの遺品が多く存在する。仮に自分が死んだ場合に、これらをどのように遺族に処分してもらうかは、なかなか難しい問題だ。筆者はこの「デジタル終活」をどうするかを、長...

Atomic Design Certification Course

Brad Frost introduced the "Atomic Design" concept wayyyy back in 2013. He even wrote a book on it. And we all took notice, because that term has been part of

How a UX redesign increased redemptions by over 58 percent

A broken OTP flow hurt trust and revenue. Here's how UX analytics helped me fix it and why every designer should track impact.

Using GitHub Spark to reverse engineer GitHub Spark

GitHub Spark was released in public preview yesterday. It’s GitHub’s implementation of the prompt-to-app pattern also seen in products like Claude Artifacts, Lovable, Vercel v0, Val Town Townie and Fly.io’s …

Deno 2.4 is here: What’s new and what to expect

Learn about the most impactful changes in Deno 2.4, including the return of a first-party bundler and new spec-aligned ways to handle assets.

Migrating Tanstack Start from Vinxi to Vite

Update your TanStack Start project from Vinxi to a Vite-based setup, including dependency adjustments and configuration file updates.

Why PMs must help architect distribution, not just adapt to it

PMs need to move beyond feature delivery to help shape distribution strategy. Learn how org design can support this shift.

Building Scalable APIs with Node.js and TypeScript

In this post, we’re gonna break down how to build scalable APIs using Node.js and TypeScript without overcomplicating things.

a11y 上の理由で Deprecated になった HTML と ARIA まとめ

I Drank Every Cocktail

Adam Aaronson drank his way through all 102 cocktails on the IBA cocktails list - published by the International Bartenders Association since 1961, with the most recent update in 2024. …

親にエンディングノートを書いてもらう

親の年齢に限らず、生きているうちにやってもらった方がいい、たった 1 つのこととして、エンディングノートの作成がある。終活は、それをどのくらい準備しておくかで、本人以上に遺族の負担が格段に減るからだ。

Toptal’s GitHub Organization Hijacked: 10 Malicious Packages Published

Threat actors hijacked Toptal’s GitHub org, publishing npm packages with malicious payloads that steal tokens and attempt to wipe victim systems.

Introducing OSS Rebuild: Open Source, Rebuilt to Last

Major news on the Reproducible Builds front: the Google Security team have announced OSS Rebuild, their project to provide build attestations for open source packages released through the NPM, PyPI …

Announcing Toad - a universal UI for agentic coding in the terminal

Will McGugan is building his own take on a terminal coding assistant, in the style of Claude Code and Gemini CLI, using his Textual Python library as the display layer. …

1KB JS Numbers Station

Terence Eden built a neat and weird 1023 byte JavaScript demo that simulates a numbers station using the browser SpeechSynthesisUtterance, which I hadn't realized is supported by every modern browser …

Arcjet product philosophy: products & primitives

How do you design a security product for developers when they allegedly don't care about security?

discord から claude-code を操作する(一時的な)サーバーを建てる

Surveillance Malware Hidden in npm and PyPI Packages Targets Developers with Keyloggers, Webcam Capture, and Credential Theft

Socket researchers investigate 4 malicious npm and PyPI packages with 56,000+ downloads that install surveillance malware.

What are the AI-proof skills every frontend developer needs?

The AI freight train shows no signs of slowing down. Seven senior developers discuss how frontend devs can make themselves indispensable in the age of AI.

A First Look at the Interest Invoker API (for Hover-Triggered Popovers)

Chrome 139 is experimenting with Open UI’s proposed Interest Invoker API, which would be used to create tooltips, hover menus, hover cards, quick actions, and other types of UIs for showing more information with hover interactions.

Passkey への道 #10: 1Password 導入セミナー

先日、Passkey 啓蒙の一環で、まだパスワードマネージャを導入してない人に対する「1Password 導入セミナー」を実施した。その内容を再収録したものを公開する。ざっくりと、前半が一般ユーザ、後半が開発者向けの内容となっている。動画及び資料は、啓蒙目的であれば自由に使...

npm ‘is’ Package Hijacked in Expanding Supply Chain Attack

The ongoing npm phishing campaign escalates as attackers hijack the popular 'is' package, embedding malware in multiple versions.

Critical Vulnerability in Popular npm form-data Package Used Across Millions of Installs

A critical flaw in the popular npm form-data package could allow HTTP parameter pollution, affecting millions of projects until patched versions are a...

Convert Figma to Angular Code Using AI

Stop manually converting Figma designs to Angular. Fusion AI generates clean Angular code from Figma files, handles variants, and respects your design system.

Here’s how I’d design a mega menu — with 3 great examples

Designing a mega menu isn’t just about listing links. It’s about helping users move fast, with confidence. These 3 websites show us how it’s done.

Angular has grown up — and the best is yet to come

It’s never been a better time to be an Angular dev. Reflect on the highlights of Angular's evolution from its early days to the v20 release.

5 books that transformed my day-to-day life as a PM

These five books helped me grow as a product manager by improving my mindset, habits, leadership, and decision-making.

`ratatui`と`tokio`で作るTUIの基本

AIコーディングハンズオンの講師をやりました(株式会社DeNA様の事例)

Bun 1.2.19 Adds Isolated Installs for Better Monorepo Support

Bun 1.2.19 introduces isolated installs for smoother monorepo workflows, along with performance boosts, new tooling, and key compatibility fixes.

Textual v4.0.0: The Streaming Release

Will McGugan may no longer be running a commercial company around Textual, but that hasn't stopped his progress on the open source project. He recently released v4 of his Python …

Code review in the AI age

AI hasn't replaced developers; it's promoted them to architects. Learn how to review AI-generated code and use tools that create review-friendly diffs.

Iterator helpers: The most underrated feature in ES2025

Unlock the power of iterator helpers in ES2025 to write memory-efficient, lazy JavaScript pipelines that scale from streams to infinite data.

A Primer on Focus Trapping

Focus trapping is about managing focus within an element, such that focus always stays within it. The whole process sounds simple in theory, but it can quite difficult to build in practice, mostly because of the numerous parts to you got to manage.

2025-07-21のJS: Nuxt 4.0、Next.js 15.4、npmのパッケージメンテナーを狙ったフィッシング

JSer.info #742 - Nuxt 4.0がリリースされました。

Leader Spotlight: Creating an environment of genuine curiosity, with Nora Keller

Nora Keller talks about embracing non-linear paths, trusting the team, and keeping product grounded in real user needs.

Coding with LLMs in the summer of 2025 (an update)

Salvatore Sanfilippo describes his current AI-assisted development workflow. He's all-in on LLMs for code review, exploratory prototyping, pair-design and writing "part of the code under your clear specifications", but warns …

Quoting Armin Ronacher

Every day someone becomes a programmer because they figured out how to make ChatGPT build something. Lucky for us: in many of those cases the AI picks Python. We should …

私のキャリアに影響を与えたコンピューター・IT の定番書籍

現代は知らないことがあればすぐにインターネットで調べたり、AI に質問できる時代です。このような時代において本を読む必要はあるのでしょうか？答えは Yes です。なぜなら、検索をしたり AI に質問をするためには、ある程度の基礎知識が必要だからです。この記事では私のキャリアにおいて影響を与えたであろうコンピューター・IT の定番書籍を紹介します。

Kiroとコンテキストエンジニアリングの時流

Kiro(kiro.dev)は、AWSが開発したIDE型のコーディングエージェントです。CursorやWindsurfのようなVS Codeフォークエディタに分類されます。現在はパブリックプレビュー中で、サインアップするとKiroでClaude Sonnet 3.7 とClaude 4 Sonnetを利用できます。 KiroThe AI IDE for prototype to productionKiro Kiroの特徴は、スペック駆動開発、エージェントフック、ステアリングファイルといった独自の機能を通じて、ソフトウェア開発のライフサイクル全体を支援します。それぞれ見ていきましょう。 スペック (Specs)駆動開発 Kiroの中核をなすのが「スペック＝仕様書」機能です。これは、ユーザーが入力した大まかな指示（例：「ユーザー認証機能を追加して」）をもとに、AIが「要件定義」「設計」「タスクリスト」という3段階のドキュメントを自動で生成するものです。 Markdownファイルが.kiro/specs/${task}/配下にタスク単位で生成されます。

Active Supply Chain Attack: npm Phishing Campaign Leads to Prettier Tooling Packages Compromise

Popular npm packages like eslint-config-prettier were compromised after a phishing attack stole a maintainer’s token, spreading malicious updates.

npm Phishing Email Targets Developers with Typosquatted Domain

A phishing attack targeted developers using a typosquatted npm domain (npnjs.com) to steal credentials via fake login pages - watch out for similar sc...

Knip Hits 500 Releases with v5.62.0, Improving TypeScript Config Detection and Plugin Integrations

Knip hits 500 releases with v5.62.0, refining TypeScript config detection and updating plugins as monthly npm downloads approach 12M.

Getting Creative With Versal Letters

A versal letters is a typographic flourish found in illuminated manuscripts and traditional book design, where it adds visual interest and helps guide a reader’s eye to where they should begin.

Leader Spotlight: Navigating a complete product redesign, with Tyler Stone

Tyler Stone, Associate Director, Product at Sensor Tower, talks through how he’s led Sensor Tower through a complete product redesign.

Cloudflare Workers Tech Talks in Kyoto #1 に行ってきたメモ #workers_tech

Community Showcase (Q2 2025)

An update on what the community has been up to in Q2 of 2025

Open Source Maintainers Feeling the Weight of the EU’s Cyber Resilience Act

The EU Cyber Resilience Act is prompting compliance requests that open source maintainers may not be obligated or equipped to handle.

Scraping and vibe coding a schedule app for Open Sauce 2025 entirely on my phone

This morning, working entirely on my phone, I scraped a conference website and vibe coded up an alternative UI for interacting with the schedule using a combination of OpenAI Codex …

12 UX design examples that show how to stop user errors before they happen

Learn how top products like GitHub, Google Calendar, and Medium prevent user errors with smart UX. Get 12 practical examples to inspire your next design.

How to build better AI apps in React with MediaPipe’s latest APIs

Build an AI-powered object detection app in React using MediaPipe's latest Tasks API, run models in-browser with no backend setup.

Quoting Terence Eden

The modern workforce shouldn't be flinging copies to each other. A copy is outdated the moment it is downloaded. A copy has no protection against illicit reading. A copy can …

Getting Clarity on Apple’s Liquid Glass

Gathered notes on Liquid Glass, Apple’s new design language that was introduced at WWDC 2025. These links are a choice selection of posts and resources that I've found helpful for understanding the context of Liquid Glass, as well as techniques for recreating it in code.

自力で時差計算をしろと言われたら。あるいはDSTによる変換の曖昧性について。

AI won’t fix bad thinking — use it to challenge you instead

AI agrees too easily. That’s a problem. Learn how to prompt it to challenge your thinking and improve your product decisions.

Crates.io Implements Trusted Publishing Support

Crates.io adds Trusted Publishing support, enabling secure GitHub Actions-based crate releases without long-lived API tokens.

Fell in a hole, got out.

This is an absolutely fascinating entrepreneurial war story by Medium CEO Tony Stubblebine, describing how they went from losing $2.6 million per month in 2022 to being monthly profitable since …

How to Get Security Patches for Legacy Unsupported Node.js Versions

unsupported Node.js versions leave your applications vulnerable to security risks, performance issues, and compliance violations.

How to build unified AI interfaces using the Vercel AI SDK

Learn how to use the Vercel AI SDK to build modern, multimodal frontend apps with streaming, function calling, image analysis, voice output, and generative UI.

Shipping WebGPU on Windows in Firefox 141

WebGPU is coming to Mac and Linux soon as well: Although Firefox 141 enables WebGPU only on Windows, we plan to ship WebGPU on Mac and Linux in the coming …

Documenting what you're willing to support (and not)

Devious company culture hack from Rachel Kroll: At some point, I realized that if I wrote a wiki page and documented the things that we were willing to support, I …

How to prep for a software dev interview: Advice from a dev leader

Interviewing for a software engineering role? Hear from a senior dev leader on what he looks for in candidates, and how to prepare yourself.

What I Took From the State of Dev 2025 Survey

State of Devs 2025 survey results are out! Sunkanmi Fafowora highlights a few key results about diversity, health, and salaries.

Unison 言語から、「次」の言語を考察したい

Leader Spotlight: Building an audience-segmented product strategy, with Chrissie Lamond

Chrissie Lamond, VP of Product at Mansueto Ventures, talks about how she builds product experiences across audience segments.

Passkey への道 #9: ユーザに求められる令和のアカウントリテラシ

サービスは、ユーザを守るために Passkey をサポートし、ユーザの移行を促す努力をする必要があった。このプロセスに対して、ユーザはまったくの受動的態度でいることはできない。では、ユーザはいったい何をリテラシとして身につけ、どう自分の身を守っていくべきなのだろうか?

Tracking Protestware Spread: 28 npm Packages Affected by Payload Targeting Russian-Language Users

Undocumented protestware found in 28 npm packages disrupts UI for Russian-language users visiting Russian and Belarusian domains.

What to do when users just want the old version back

Change is tough. Here’s how to help your users adapt when all they want is the old version back.

Next.js real-time video streaming: HLS.js and alternatives

Set up real-time video streaming in Next.js using HLS.js and alternatives, exploring integration, adaptive streaming, and token-based authentication.

AI compliance: A core product competency you shouldn’t skip

AI governance is now a product feature. Learn how to embed trust, transparency, and compliance into your build cycles.

AWS の エージェント IDE Kiro を使ってみた

Kiro は AWS が開発した IDE 内蔵型の AI コーディングエージェントです。Kiro の特徴は単なるバイブコーディングにとどまらず、スペックを使用して仕様駆動開発でアプリケーションを開発できることです。この記事では Kiro を使ったアプリケーション開発の流れを紹介します。

Leader Spotlight: Designing for trust and managing user expectations, with Rachel Bentley

Rachel Bentley shares the importance of companies remaining transparent about reviews and where they’re sourced from to foster user trust.

Passkey への道 #8: サービスにとって「移行」のゴールは何か?

パスワード + TOTP は限界を迎え、Passkey へ移行しなければ、サービスがユーザを守りきれなくなった。逆を言えば、サービスがユーザを守りたいと思うのであれば、Passkey を提供しないわけにはいかない時代に突入している。では、令和のこの状況において、サービスはど...

Contagious Interview Campaign Escalates With 67 Malicious npm Packages and New Malware Loader

North Korean threat actors deploy 67 malicious npm packages using the newly discovered XORIndex malware loader.

A guide to UX documentation: Recording your design process

Documentation may not be your favorite part of the UX design process, but it’s crucial to the success of any design project.

Setting Line Length in CSS (and Fitting Text to a Container)

The many ways to juggle line length when working with text... including two proposed properties that could make it easier in the future.

We’re Moving! NodeSource Distributions Now Have a New Home - With Extended Support

Today, we're announcing a key change to how we serve and support our Node.js binary distributions, and it comes with something new: Extended Support.

Astroで動的なパスの画像を扱う

Leader Spotlight: Scaling an ecommerce business within a broader organization, with Michal Ochnicki

Michal Ochnicki talks about the importance of ensuring that the ecommerce side of a business is complementary to the whole organization.

Passkey への道 #7: そして Username-Less へ

Apple が突如発表した Passkey。実態は「WebAuthn の秘密鍵を iCloud で共有」するサービスだった。そして、業界は本格的な Password-Less に向けて進んでいく。

Happy 20th birthday Django! Here's my talk on Django Origins from Django's 10th

Today is the 20th anniversary of the first commit to the public Django repository! Ten years ago we threw a multi-day 10th birthday party for Django back in its birthtown …

サンドボックス環境を MCP サーバーで提供する Container Use

AI コーディングエージェントは便利ですが、任意の Bash コマンドを実行できるため、ユーザーのシステムに影響を与える可能性があります。Container Use は MCP サーバーとして動作し、AI コーディングエージェントにサンドボックス環境を提供します。この記事では Container Use の利用方法について紹介します。

Passkey への道 #6: タブーを破った Apple

TOTP/WebAuthn は、バックアップコードの適切な保管方法が示されないまま、移行だけが推し進められた。YubiKey などの物理 Authenticator の扱いとして、「二本登録して、片方は普段使い、もう片方は貸金庫へ」などと、かなり無理のあるベストプラクティス...

crates.io: Trusted Publishing

crates.io is the Rust ecosystem's equivalent of PyPI. Inspired by PyPI's GitHub integration (see my TIL, I use this for dozens of my packages now) they've added a similar feature: …

Meet Socket at Black Hat and DEF CON 2025 in Las Vegas

Meet Socket at Black Hat & DEF CON 2025 for 1:1s, insider security talks at Allegiant Stadium, and a private dinner with top minds in software supply ...

2025-07-12のJS: TypeScript 5.9 Beta、i18nとローカライズ、Node.jsのモダンな機能

JSer.info #741 - TypeScript 5.9 Betaがリリースされました。

v0 の SDK を試してみる

v0 は Vercel が開発した AI ベースの Web アプリケーション・UI 生成ツールです。v0 のプラットフォーム API を使用すると、v0 の機能を自身のコードから利用できます。この記事では v0 TypeScript SDK を使用して、v0 のプラットフォーム API を試してみます。

Passkey への道 #5: 2FA/WebAuthn

Infostealer は、ユーザの権限でインストールされ、ユーザがアクセスできるあらゆる情報を盗んで去っていく。そこから、どんなに暗号化して保存しても、使用時には平文にしないといけない「パスワード」という文字列を守り抜くのは非常に難しい。であれば、最初から文字列に頼らなけ...

When is low-code the right choice? Here’s how to decide

Wondering if low-code is right for your next project? This guide breaks down use cases, trade-offs, and a decision framework for developers.

Comparing AI app builders — Firebase Studio vs. Lovable vs. Replit

Compare Firebase Studio, Lovable, and Replit for AI-powered app building. Find the best tool for your project needs.

Scroll-Driven Sticky Heading

I was playing around with scroll-driven animations, just searching for all sorts of random things you could do. That’s when I came up with the idea to animate main headings and, using scroll-driven animations, change the headings based on the user’s scroll position.

GitHub Copilot NESの内部実装が公開、そして続・AIエディタ戦争

Copilot NESとは Copilot NES（Next Edit Suggestions）は2025年2月にリリースされたGitHub Copilotの内部機能です。コードの変更に連動して必要となる次の編集を予測し、タブキーを押しているだけで複数箇所にわたる修正を提案してくれます。通常のコード補完がカーソル位置の続きのコードを予測するのに対して、Copilot NESは「エディタ上の編集操作」の単位で続きを予測して補完します。 GitHub Next | Copilot Next Edit SuggestionsGitHub Next Project: Can we improve Copilot code completion by suggesting the next logical change, wherever it is in your project?GitHub Next この仕組みはCopilot NESの元ネタであるCursor Tab(Copilot++)によって実用化されましたが、Cursorはプロプライエタリなソフトウェアなので内部の詳細が分かり

How I use Claude Code (+ my best tips)

I switched from Cursor's agents to Claude Code weeks ago and I'm not going back. Here's how I use it and my best practical tips

Postgres LISTEN/NOTIFY does not scale

I think this headline is justified. Recall.ai, a provider of meeting transcription bots, noticed that their PostgreSQL instance was being bogged down by heavy concurrent writes. After some spelunking they …

Leader Spotlight: Building an effortlessly personal healthcare experience, with Christina Valls

Christina Valls shares how her teams have transformed digital experiences at Cedars-Sinai, including building a digital scheduling platform.

AI Agentのアウトプットに『Next.jsの考え方』を反映するプラクティス

Passkey への道 #4: 文字列の限界

パスワードと TOTP の問題は、「人間が入力する必要がある」ことだった。対策は Autofill であり、そのためにもパスワードマネージャ相当が必要になる。では、パスワードマネージャを使っていれば、パスワードと TOTP で十分なのだろうか?

Why I don’t trust WCAG 2.2 and what I’m hoping from 3.0

You can follow WCAG 2.2 and still build inaccessible products. Here's what I want from WCAG 3.0.

Gemini CLI tutorial — Will it replace Windsurf and Cursor?

Discover how to use Gemini CLI, Google's new open-source AI agent that brings Gemini directly to your terminal.

Grok 4がリリース

xAIのGrok 4が公開されました。 Introducing Grok 4, the world's most powerful AI model. Watch the livestream now: https://t.co/59iDX5s2ck — xAI (@xai) July 10, 2025 モデルカード コンテキストウィンドウは256,000トークンです。Claude 4 Sonnetが200,000トークン。 Models / Grok 4 「Grok 4 Code」って何なの コーディングモデルの名前です。Claude Code的なCLIではなさそうです。OpenAIでいうCodex（モデルの方）になります。Redditのスレによると「Cursorで使える」というメッセージがコンソールにでていたらしいです。 Grok 4 by

React & TypeScript: 10 patterns for writing better code

This article explores several proven patterns for writing safer, cleaner, and more readable code in React and TypeScript.

Stress-testing AI products: A red-teaming playbook

Red-teaming reveals how AI fails at scale. Learn to embed adversarial testing into your sprints before your product becomes a headline.

Leader Spotlight: Building a human-focused AI product, with Cory Bishop

Cory Bishop talks about the role of human-centered design and empathy in Bubble’s no-code AI development product.

Passkey への道 #3

パスワードだけでの認証に限界が訪れ、TOTP を用いた 2FA が普及した。しかし、これでもまだ、全くもって不完全であることが、フィッシング詐欺の増加によって証明された。

Open Source CAI Framework Handles Pen Testing Tasks up to 3,600× Faster Than Humans

CAI is a new open source AI framework that automates penetration testing tasks like scanning and exploitation up to 3,600× faster than humans.

Infinite Monkey

Mihai Parparita's Infinite Mac lets you run classic MacOS emulators directly in your browser. Infinite Monkey is a new feature which taps into the OpenAI Computer Use and Claude Computer …

Convert Figma to Tailwind CSS using AI

Convert Figma design files into clean, responsive Tailwind CSS code with Fusion AI. Streamlines the design-to-code process for production-ready results.

I designed by committee — and here’s what went wrong

Design thrives with feedback, but dies by consensus. Learn how to set boundaries, take control, and build UX with backbone.

5 product leaders on reducing friction in mobile-first experiences

Learn how to reduce mobile friction, boost UX, and drive engagement with practical, data-driven strategies for product managers.

100 Exercises To Learn Rust をやった

Leader Spotlight: Emphasizing clear, thoughtful documentation, with Jim Naylor

Jim Naylor shares he views documentation as a company’s IP and how his teams should use it as a source of truth.

Passkey への道 #2

「パスワード」が認証の最重要要素で、いかにそれを死守するかを「サービス側」「ユーザ側」双方で考え続けてきたのが、平成の認証だった。ところが、それは早々に破綻し、「パスワードだけでの認証」に限界が来た。そこで、導入されたのが二要素認証(2FA: 2-Factor Auth)だ。

uv cache prune

If you're running low on disk space and are a uv user, don't forget about uv cache prune: uv cache prune removes all unused cache entries. For example, the cache …

Deno 2.4 Brings Back deno bundle, Improves Dependency Management and Observability

Deno 2.4 brings back bundling, improves dependency updates and telemetry, and makes the runtime more practical for real-world JavaScript projects.

Designers write good copy — but not the kind users actually need

This isn’t about grammar or style. It’s about making sure the words do something — guide, calm, clarify, convert.

A PM’s guide to calculated risk-taking

Act fast or play it safe? Product managers face this daily. Here’s a smarter way to balance risk, speed, and responsibility.

Devcontainers, Little Snitch, macOS TCC - protecting developer laptops

How we implement different layers to secure our developer laptops & environments: Devcontainers, outbound firewall, macOS Transparency Consent and Control framework, and SSH agent for Git keys.

AstroでPDFファイルからルートを生成したい

Leader Spotlight: Improving predictability using agile, with Emmett Ryan

Emmett Ryan shares how introducing agile processes at C.H. Robinson improved accuracy of project estimations and overall qualitative feedback.

Passkey への道 #1

まず、今使われているパスワード認証について、これがなぜ問題で、なぜ Password-Less が求められているのかを振り返っていこう。

Checkbox UI design: Best practices and examples

The checkbox is one of the most common elements in UX design. Learn all about the feature, its states, and the types of selection it offers.

New CVE Forecasting Tool Predicts 47,000 Disclosures in 2025

CVEForecast.org uses machine learning to project a record-breaking surge in vulnerability disclosures in 2025.

The Best AI Coding Tools in 2025

Discover the best AI tools for coding in 2025 and transform how you build with these powerful coding assistants.

A guide to wrapper vs. container classes in CSS

A breakdown of the wrapper and container CSS classes, how they’re used in real-world code, and when it makes sense to use one over the other.

Better CSS Shapes Using shape() — Part 4: Close and Move

The shape() function's close and move commands may not be ones you reach for often, but are incredibly useful for certain shapes.

Leader Spotlight: Balance vs. compromise in product management, with Suvrat Joshi

Suvrat Joshi shares the importance of viewing trade-off decisions in product management more like a balance than a compromise.

Passkey への道 #0

フィッシング詐欺や Infostealer を用いた金融サイトの乗っ取り詐欺などは、その被害総額が 5000 億円 を突破してもなお拡大し続けている。米国で発生した 2024 年のオンライン詐欺被害は 166 億ドル に達した。証券や銀行サービスからは「FIDO 認証登録の...

I Shipped a macOS App Built Entirely by Claude Code

Indragie Karunaratne has "been building software for the Mac since 2008", but recently decided to try Claude Code to build a side project: Context, a native Mac app for debugging …

速習 Claude Code

BlackHole 2ch を Mac から削除する

値の補間計算を簡潔に記述できる CSS の `progress` 関数

CSS の `progress` 関数は、2 つの長さの値の間の進捗を計算するための数学関数です。流体タイポグラフィやレスポンシブなレイアウト調整に利用できます。流体タイポグラフィは `clamp` 関数を使用して実装することもできますが、`progress` 関数を使用することでより意図を明確に記述できます。この記事では、CSS の `progress` 関数の構文と使用例について解説します。

Serving 200 million requests per day with a cgi-bin

Jake Gold tests how well 90s-era CGI works today, using a Go + SQLIte CGI program running on a 16-thread AMD 3700X. Using CGI on modest hardware, it’s possible to …

CSS Modules の拡張構文について

CSS Modules は、CSS をローカルスコープ化する仕組み。*.module.css に CSS を記述すると、bundler がクラスセレクターなどをユニークなものへと変換してくれる。クラスセレクターなどが *.module.css ファイルごとに異なる名前に変換され、擬似的にローカルスコープ化が実現される。 developer.hatenastaff.com CSS Modules では、基本的には CSS の標準の構文をそのまま利用する。しかし、一部 CSS Modules 独自の構文がある。実際どのようなものがあるのかというのを、紹介する。 CSS Modules の公式ドキュ…

AI Agentのコマンド実行にTouch IDを使った「人間の確認」を挟むCLIツール confirm-pam を作った

macOS で Touch ID を使った「人間の確認」ができるシンプルな CLI ツール confirm-pam を作りました。

How to build a web-based AI agent with Stagehand and Gemini

Learn how to build a browser-based AI agent with Stagehand and Gemini to automate tasks like navigation, extraction, and interaction using natural language.

Browserslist-rs Gets Major Refactor, Cutting Binary Size by Over 1MB

Browserslist-rs now uses static data to reduce binary size by over 1MB, improving memory use and performance for Rust-based frontend tools.

2025-07-04のJS: ECMAScript 2025、Rspack 1.4、Deno 2.4、Bundle Sizeの改善

JSer.info #740 - ECMAScript 2025 が正式にリリースされました。

8 More Malicious Firefox Extensions: Exploiting Popular Game Recognition, Hijacking User Sessions, and Stealing OAuth Credentials

Eight new malicious Firefox extensions impersonate games, steal OAuth tokens, hijack sessions, and exploit browser permissions to spy on users.

TIL: Rate limiting by IP using Cloudflare's rate limiting rules

My blog started timing out on some requests a few days ago, and it turned out there were misbehaving crawlers that were spidering my /search/ page even though it's restricted …

I built something that changed my friend group's social fabric

I absolutely love this as an illustration of the thing where the tiniest design decisions in software can have an outsized effect on the world. Dan Petrolito noticed that his …

The MCP client for design handoffs

MCP clients let AI agents connect to your tools, but most are either chat-only or IDE-only. Fusion bridges design and dev workflows.

I’ve designed with data — here’s what we’re getting wrong

Over-optimizing for data can kill creativity in UX. Learn how to bring intuition and empathy back into your design process.

Getting started with Claude 4 API: A developer’s walkthrough

This guide explores how to use Anthropic's Claude 4 models, including Opus 4 and Sonnet 4, to build AI-powered applications.

Official Go SDK for MCP in Development, Stable Release Expected in August

The official Go SDK for the Model Context Protocol is in development, with a stable, production-ready release expected by August 2025.

Designing drag and drop UIs: Best practices and patterns

Let's explore why and when to use drag and drop, discussing real-world examples, platform-specific considerations, and accessibility tips.

What scarcity taught me about designing for attention

Scarcity drives attention — if used right. Learn how to apply ethical, psychology-backed scarcity in your UX workflows and interfaces.

t-wada vs テスト大好郎

先日一部のClaude Codeユーザーの間で「プロンプトに”t-wadaさんの推奨する進め方に従ってください”と書くとテスト駆動開発のプラクティスを実践してくれる」というTIPSが話題になっていました。 なるほど、TDDやテスト駆動開発という言葉は広まりすぎて「意味の希薄化」が発生し、曖昧な理解のまま自動テストやテストファーストと混同され、それがLLMの学習データにも影響したが、人名を与えるとLLMに「具体的な参照点」を与え、より具体的なプログラミングスタイルに限定させる効果があったのか pic.twitter.com/p6SCPj8YdA — Takuto Wada (@t_wada) June 25, 2025 これは確かに面白い現象で、現にClaudeに直接質問するとt-wadaさんの知識を持っていることがわかります。そこから連想してClaude CodeがTDDをするトリガーとして使えるのなら面白いなと思い色々試してみました。 （ところでこの翌日、最近バイブコーディングにはまってSmalltalkのライブラリをLLMで書いているKent Beckも自著のタイトルを

AI dev tool power rankings & comparison [July 2025 edition]

Which AI frontend dev tool reigns supreme in July 2025? Check out our power rankings and use our interactive comparison tool to find out.

Pivot or perish: Why product agility determines market survival

Great product managers spot change early. Discover how to pivot your product strategy before it's too late.

11 prompting tips for building UIs that don’t suck

Most people are using AI coding tools wrong. Here are 11 practical tricks that actually work for frontend development

AI Agentが回答に困った時にSlackで人間に助言を求められるMCPを検証した

AI ShiftのTECH BLOGです。AI技術の情報や活用方法などをご案内いたします。

Mandelbrot in x86 assembly by Claude

Inspired by a tweet asking if Claude knew x86 assembly, I decided to run a bit of an experiment. I prompted Claude Sonnet 4: Write me an ascii art mandelbrot …

Leader Spotlight: Human empathy in the age of AI, with Thach Nguyen

Thach Nguyen, Senior Director of Product Management — STEPS at Stewart Title, emphasizes candid moments and human error in the age of AI.

TIL: Using Playwright MCP with Claude Code

Inspired by Armin ("I personally use only one MCP - I only use Playwright") I decided to figure out how to use the official Playwright MCP server with Claude Code. …

Claude CodeのHooksでタスク完了メッセージをデスクトップ通知する

Claude CodeではNotification設計でベル音を鳴らすことができますが、私は音量をゼロにしてMacを使っているため、デスクトップのバナー通知で視覚的に知らせてほしいと思っていました。一部のユーザーは、osascriptやterminal-notifierのコマンド呼び出し指示を各自CLAUD.mdに記載してこれを実現させているようですが、毎回推論コンテキストに載せるに抵抗があり、そこまでは手を出せていませんでした。 しか昨日リリースされたHooks機能は、まさにこの用途に最適でした。ドキュメントにもカスタム通知を設定する例が載っています。 Hooks - AnthropicCustomize and extend Claude Code’s behavior by registering shell commandsAnthropic すでにHooksのさまざまなユースケースが公開されていて、例えばファイルのフォーマッタやSlack・LINEへの通知などを行っているユーザーがいます。 Claude Code の Hooks で作業が終わった後にフォーマッターを

PlanetScale's classy retirement

Sometimes a service with a free plan will decide to stop supporting it. I understand why this happens, but I'm often disappointed at the treatment of existing user's data. It's …

A custom template system from the mid-2000s era

Using LLMs for code archaeology is pretty fun. I stumbled across this blog entry from 2003 today, in which I had gotten briefly excited about ColdFusion and implemented an experimental …

Announcing PlanetScale for Postgres

PlanetScale formed in 2018 to build a commercial offering on top of the Vitess MySQL sharding open source project, which was originally released by YouTube in 2012. The PlanetScale founders …

Convert Figma to Next.js using AI

Convert Figma design files into clean, responsive Next.js code with Fusion AI. Streamlines the design-to-code process for production-ready results.

How API client automation can save you hours in development

Learn how OpenAPI can automate API client generation to save time, reduce bugs, and streamline how your frontend app talks to backend APIs.

The Gap Strikes Back: Now Stylable

Styling the space between layout items — the gap — has typically required some clever workarounds. But a new CSS feature changes all that with just a few simple CSS properties that make it easy, yet also flexible, to display styled separators between your layout items.

Where your focus is actually going (and how to get it back)

Guard your focus, not just your time. Learn tactics to protect attention, cut noise, and do deep work that actually moves the roadmap.

Leader Spotlight: Data-driven vs. human-centered decision making for product design, with Rumana Hafesjee

Rumana Hafesjee talks about the evolving role of the PM in today’s "great hesitation," explores reinventing yourself as a leader, and the benefits of fractional leadership.

Using Claude Code to build a GitHub Actions workflow

I wanted to add a small feature to one of my GitHub repos - an automatically updated README index listing other files in the repo - so I decided to …

Claude Code の Hooks で作業が終わった後にフォーマッターを実行する

Claude Code hooks は Claude Code のライフサイクルの特定のタイミングで実行されるユーザー定義のシェルスクリプトです。hooks を使用することで、コードのフォーマットを常に実行することができます。この記事では hooks を使用してコードの変更後に prettier が実行されるように設定してみましょう。

Give footnotes the boot

I hate footnotes, and hopefully by the end of this, you will too.