[5:4] 短期予報のみ [5:4] 短期予報と週間予報（デザインA） [5:4] 短期予報と週間予報（デザインB） [16:9] 短期予報のみ [スマホ横長全画面] 短期予報のみ
天気予報つき時計 by ritsuka
[5:4] 短期予報のみ [5:4] 短期予報と週間予報（デザインA） [5:4] 短期予報と週間予報（デザインB） [16:9] 短期予報のみ [スマホ横長全画面] 短期予報のみ
axios ソフトウェアサプライチェーン攻撃の概要と対応指針 - GMO Flatt Security Blog
2026年3月31日、HTTP クライアントライブラリ axios の npm パッケージが侵害されました。攻撃者はメンテナの npm アカウントを乗っ取り、マルウェアを含むバージョン 1.14.1 および 0.30.4 を公開しました。axios は npm エコシステムで週間約1億ダウンロードを誇る主要パッケージです。本記事では公開情報をもとに、事象の概要を記録します。また、対応指針を示します。 TL;DR - 対応指針 axios への直接依存に限らず、間接依存（transitive dependency）でも postinstall フックは発火します。 自身のプロジェクトが axios を直接利用していなくても、依存ツリーのどこかに axios が含まれていれば影響を受け得ます。npm ls axios で確認してください。 npm ls axios や lockfile により
design-loop: Claude Codeを使ったブラウザベースのビジュアル編集ツール
Claude Codeを使ったブラウザベースのビジュアル編集ツールとして、design-loopを作りました。 GitHub: https://github.com/azu/design-loop 左パネルに開発中のサイトのプレビュー、右パネルにClaude Codeのターミナルが表示されます。プレビュー上の要素をクリックすると、その要素のコンポーネント情報やスタイルがClaude Codeに渡されます。 インストール curl -fsSL https://raw.githubusercontent.com/azu/design-loop/main/install.sh | sh 使い方 ソースコードがあるディレクトリで、開発サーバーがすでに起動している場合は、--urlでURLを指定するだけで起動できます。 design-loop --url http://localhost:3000
Date is out, Temporal is in
Time makes fools of us all, and JavaScript is no slouch in that department either. Honestly, I’ve never minded the latter much — in fact, if you’ve taken JavaScript for Everyone or tuned into the newsletter, you already know that I largely enjoy JavaScript’s little quirks, believe it or not. I like when you can see the seams; I like how, for as formal and iron-clad as the ES-262 specification migh
Three.jsとCurl Noiseで動かす3Dパーティクル表現 - ICS MEDIA
3Dを用いたウェブサイトでは、パーティクルを使った表現をよく目にします。メインのビジュアルにパーティクルのアニメーションを重ねることで、サイトの視覚的な印象を強めることができます。 この記事では、パーティクル表現を用いたウェブサイトの事例を紹介しつつ、数ある表現手法の中でも3D空間を漂うパーティクル表現をThree.jsを使って実装します。なお、本記事のデモにはThree.js r181とTypeScriptを使用しています。 事例紹介 サイト『Heidelberg Materials』では、パーティクルを使って3Dオブジェクトが描画されています。さらに周囲にも無数のパーティクルがゆっくりと漂っています。3Dオブジェクトにマウスを合わせるとパーティクルが一瞬散るエフェクトも見られます。 ▼ サイト『Heidelberg Materials』 サイト『Utsubo』では、走るチーターの周辺に
自分のWebサイトをスケルトン仕様にする - Lambdaカクテル
した www.3qe.us こいつは暖かみのある手打ちHTMLで作られており、AIはおろか補完といった冷たいテクノロジ〜を利用していない。なんか勘で書いて勘で動いている。 スケルトンにしたい 1990〜2000年代、あらゆるモノがスケルトンになっていたマジで謎の時代。 www.nintendo.co.jp PlayStation 2 オーシャン・ブルー【メーカー生産終了】 ソニー・インタラクティブエンタテインメントAmazon openmedia.jp 自分はそういう時代にガキ時代を過ごしたので、今もスケルトンが大好きである。 blog.3qe.us blog.3qe.us てかなんで今の製品はそんなにスケルトンにしなくなったのだろう。最近はリバイバル的にスケルトンなものも増えてる気がするけど。 そういうわけで自分のサイトもスケルトンにしよう、という話に、異動した最初のオンライン飲み会でな
Bunに入社した
Sosuke is one of JavaScriptCore’s most prolific contributors, and will help us make JavaScript faster and Bun more compatible with Node https://t.co/G1BKUophlO — Jarred Sumner (@jarredsumner) August 18, 2025 8月15日にUbieを退職し、8月18日からJavaScriptランタイムを開発しているBunで働いている。住居は引き続き茨城県つくば市。 僕は直近１年半くらい余暇時間のほとんどをJavaScriptCoreの開発に費やしていて、それがBunの目に止まったらしい。いきなりBunのリクルーターからTwitterのDMで連絡をもらって、すぐにCEOのJarredと話すことになった。 J
p5.jsによるクリエイティブコーディング入門 - ICS MEDIA
ウェブ技術を用いたクリエイティブコーディング環境にはさまざまなものがありますが、プロトタイピングや2D表現には、Canvas 2DをラップしたJavaScriptライブラリ「p5.js」が非常に便利です。この記事ではp5.jsの強み、便利な関数と作例を紹介し、自分で作成した作品の公開方法について解説します。 p5.jsとは p5.jsは、ウェブ上でグラフィカルな表現ができるJavaScriptライブラリで、基礎的なプログラミングの知識さえあれば手軽に創作を始められるのが魅力です。 またp5js.orgが提供しているウェブエディターを使うと、環境構築なしにブラウザ上でクリエイティブコーディングが始められます。たった数十行のみのコードでもメディアアート作品のような出力が得られる、とても興味深いライブラリです。今回はp5.js Web Editorを使って簡単なアニメーションを制作しましょう。
TypeScriptのコンパイラをGo言語でネイティブ化、10倍速にした「TypeScript Native Previews」が公開
TypeScriptのコンパイラをGo言語でネイティブ化、10倍速にした「TypeScript Native Previews」が公開 マイクロソフトは、TypeScriptのコンパイラを始め各種ツール群をGo言語に移植することでコンパイラの処理速度を10倍速にした新バージョンとなるTypeScriptのプレビュー版「TypeScript Native Previews」の公開を発表しました。 Today we're announcing previews of the native port of TypeScript! These nightly previews will be available on npm and the VS Code marketplace! npm install -D @typescript/native-preview npx tsgo --vers
Wake up, Remix!
At React Conf last summer we announced that Remix was going to "take a nap". Remix v2 had become such a thin wrapper around React Router that an artificial separation developed between the two projects. We simplified the projects by moving the bundler and server runtime code from Remix directly into React Router v7, merging everything that made Remix great into React Router v7 “framework mode”. We
TypeScript で MCP サーバーを実装し、Claude Desktop から利用する
MCP（Model Context Protocol）とはアプリケーションが LLM にコンテキストを提供する方法を標準化するプロトコルです。MCP を使用することで、LLM は外部ツールやサービスからコンテキストを取得するだけでなく、コードの実行やデータの保存など、さまざまなアクションを実行できるようになります。この記事では MCP サーバーを TypeScript で実装する方法を紹介します。 MCP（Model Context Protocol）とはアプリケーションが LLM にコンテキストを提供する方法を標準化するプロトコルです。多くの LLM ではユーザーに適切な回答を提供するために追加のコンテキスト情報を必要とします。例えば、今日の天気の情報をユーザーから求められたとしても LLM が学習したデータにはその情報は含まれていないため、正確な回答ができません。このような状況では L
マイクロソフト、TypeScriptのコンパイラなどをGo言語に移植することで10倍の処理速度に
マイクロソフトのテクニカルフェローで、TypeScriptのリードアーキテクトであるアンダース・ヘルスバーグ（Anders Hejlsberg）氏は、TypeScriptのコンパイラを始め各種ツール群をGo言語に移植する「Project Corsa」を実施中であり、結果としてコンパイラの処理速度などが約10倍速になることを明らかにしました。 これによりTypeScriptからJavaScriptへの変換が高速になり、コードエディタでTypeScriptを記述するときの補完や検索などのコードアシスト機能も迅速になるなど、さまざまな開発者体験が向上すると説明されています。 ヘルスバーグ氏はTurbo Pascalの作者であり、その後もDelphi、C＃などの優れたプログラミング言語の開発に携わってきたことで知られています。 TypeScriptの処理速度やスケーラビリティに課題 TypeScr
JavaScriptがブラウザでどのように動くのか | メルカリエンジニアリング
実際にコードを用いてスタック領域とヒープ領域の概念を説明します。 person オブジェクトを宣言した時、JavaScript エンジンはオブジェクトの実体をヒープ領域にメモリ割り当てを行い、ヒープ領域にある実体への参照をスタック領域にメモリ割り当てを行います。 const person = { name: 'Taro', age: 24 }; 次のように新しい変数(newPerson)に再代入をすると参照がコピーされ、newPerson も person もヒープ領域に割り当てられた同じ実体に対する参照を持ちます。 const newPerson = person; Object.assign を使って新しいオブジェクトを生成するのは、参照コピーをしないための方法の一つで、よく使われる手法の1つです。 function getName(person) { return person.na
then() を export した結果ｗｗｗ - Object.create(null)
Promise と Thenable Promise が ECMAScript の言語仕様に追加されたのは ES2015 ですが, Promise ライクなオブジェクトはそれ以前からも広く使われてきました (jQuery の Deferred など). そういった Promise ライクなオブジェクトとの互換性のため, Promise の仕様は本物の Promise と Promise ライクなオブジェクトを混ぜて使えるようになっています. 具体的には, Promise ライクなオブジェクトは一般に Thenable という共通のインターフェースを持つことになっています. オブジェクトが Thenable であるために必要なのは「then() という名前のメソッドを持っている」という一点のみです. もし Promise を解決 (resolve) するときに使われた値が Thenable
CORSガイドの決定版 | POSTD
無垢な仔猫の写真を集めたウェブサイトを訪問したと想像してみてください。かわいい仔猫達の写真の背後には、このウェブサイトの強大な力が隠れています。誰かがウェブサイトにアクセスすると、サイトのオーナーはその訪問者のネット上の行動に関するあらゆる情報を入手できます。その中には、銀行取引情報、SNS上の投稿やメッセージ、メール、オンラインの購買データなどが含まれます。あなたが受ける信用面や金銭面の損害はどれほどのものになるでしょうか。あなたのメッセージが流出し、銀行口座のお金が使い込まれるかもしれません。しかし幸いなことに、実際にはそのような状況は起こりません。それは、SOPとCORSのお陰なのです。 目次 Ajax（Asynchronous JavaScript And XML） インターネットがジャングルではない理由 認証情報を「含める」vs「含めない」 CORSルールの定義 クロスオリジンリ
イージング関数チートシート
イージング関数は、時間の経過に伴うパラメーターの変化率を指定します。 現実の物体は、即座に動いたり停止したりすることはなく、一定の速度で動くこともほとんどありません。引き出しを開けるとき、私たちは最初に引き出しをすばやく引き出し、それが外に出てくるにつれてゆっくりと動かします。床に向けてなにかを（例えばペンのような）放すと、最初に重力によって下に向かって加速し、床に当たった後上に跳ね返ります。 あなたの必要なイージングを選択して、あなたのプロジェクトの中で使用してみてください。
ISO-2022-JPの自動判定によるクロスサイト・スクリプティング(XSS)
サマリ ISO-2022-JPという文字エンコーディングの自動判定を悪用したクロスサイト・スクリプティング(XSS)攻撃について説明する。これは、文字エンコーディングを適切に指定していないウェブコンテンツに対して、文字エンコーディングをISO-2022-JPと誤認させることでバックスラッシュが円記号と解釈されることによりエスケープ処理を回避する攻撃である。本稿で紹介する攻撃は、従来からのセキュリティベストプラクティスである「文字エンコーディングの明示」に従っていれば影響を受けることはない。 はじめに クロスサイト・スクリプティング対策として、記号文字のエスケープ処理に加えて、コンテンツの文字エンコーディングをレスポンスヘッダやmetaタグで明示しましょうと言われてきました（参照）。その背景として、UTF-7という文字エンコーディングを悪用したXSSの存在がありました。この攻撃については以下
これがフロントエンドで話題になった記事！ ICS MEDIAの2024年 - ICS MEDIA
ICSはフロントエンドを専門とするウェブ制作会社ですが、オウンドメディアとして技術情報発信サイト「ICS MEDIA」を運用しています。このサイトは開設から10年目をむかえましたが、今年は「国内のウェブ水準を前進させる記事を。話題のテーマも、他のサイトでは読めないニッチな技術も」をテーマとしてやってきました。そんなICS MEDIAにとっての2024年を、あらゆる数値を使って多角的にレポートします。 今年はどの記事がもっとも読まれたのでしょうか？ 今年執筆した記事で上位10記事をピックアップしました。 1位 : フキダシ作例 HTML・CSSで実装するかわいいフキダシのアイデア 24,708 PV HTMLとCSSだけで作るかわいい吹き出しデザインを取り上げた記事です。マスキングテープ風などの凝ったスタイルからシンプルな角丸まで、応用範囲が広いオリジナルサンプルを豊富に掲載しています。 ユ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
TypeGPUとは何か｜TypeGPU入門
Dockerでバインドマウントするのやめません？もうCompose Watchでいいでしょ？Docker composeの新機能を使い倒そう
