(Translated by https://www.hiragana.jp/)
canvasの人気記事 95件 - はてなブックマーク

検索けんさく対象たいしょう

並ならび順じゅん

ブックマーク数すう

期間きかん指定してい

  • から
  • まで

1 - 40 件けん / 95件けん

新着しんちゃく順じゅん 人気にんき順じゅん

canvasの検索けんさく結果けっか1 - 40 件けん / 95件けん

canvasに関かんするエントリは95件けんあります。 javascript、 AI、 プログラミング などが関連かんれんタグです。 人気にんきエントリには 『クリエイティブコーディングの教科書きょうかしょ』などがあります。

canvasの関連かんれんエントリー

  • クリエイティブコーディングの教科書きょうかしょ

    ゲームエンジンや3Dソフトウェアを利用りようして高度こうどな表現ひょうげんができるこの時代じだいでも、プリミティブな描画びょうがや動うごき、アルゴリズムから学まなべることは多おおい。それらをJavaScriptで書かくクリエイティブコーディングという形かたちで学まなべる手引てびき書しょが本書ほんしょとなる。

      クリエイティブコーディングの教科書

    • Haystack

      Haystack’s AI pinpoints the best order to review your diffs so you can jump straight into reviewing. No more puzzling over complex pull requests! Haystack’s AI pinpoints the best order to review your diffs so you can jump straight into reviewing. No more puzzling over complex pull requests!

        Haystack

      • JavaScriptで任意にんいのHTML要素ようそをPicture-in-Pictureする

        みなさんはPicture-in-Picture(PiP)という機能きのうを使つかったことがありますか。PiPは動画どうがコンテンツなどを浮遊ふゆうする小しょう窓まどに表示ひょうじする機能きのうです。小しょう窓まどはウィンドウの外側そとがわを自由じゆうに移動いどうできます。 デスクトップが賑にぎやかになりがちなPCでもPiPは大だい活躍かつやくなのですが、特とくにスマートフォンにおいては数少かずすくない「ウィンドウ」機能きのうになります。Androidはもちろん、iOS14も対応たいおうしたことで話題わだいになりました。 これによってスマホ一いち台だいあれば、ソシャゲの公式こうしき生放送なまほうそうを見みながらソシャゲのイベントを周回しゅうかいする地獄じごくのような行為こういが可能かのうになりました。 利用りよう者しゃという視点してんから見みると非常ひじょうに便利べんりなのですが、開発かいはつ者しゃから見みると動画どうがしか表示ひょうじできないのはなかなか使つかい所しょが難むずかしくなります。そこで、この機能きのうを使つかって好すきな情報じょうほうを表示ひょうじできないか実験じっけんしてみました。 PiP機能きのうの対応たいおう環境かんきょう Chrome 70 Firefox 71（制限せいげん付つき） mac

          JavaScriptで任意のHTML要素をPicture-in-Pictureする

        • tldraw

          A free and instant collaborative whiteboarding tool.

            tldraw

            • canvasの関連かんれんエントリー

          • Gemini の新しん機能きのう 「Canvas」入門にゅうもん： アイデアをカタチにする活用かつよう法ほうをわかりやすく徹底てってい解説かいせつ！｜Gemini - Google の AI

            こんにちは、Google の AI「Gemini（ジェミニ）」の公式こうしき note 編集へんしゅう部ぶです。 「いいアイデアが浮うかんだ！ でも、それを形かたちにするには、時間じかんも手間てまもかかって大変たいへんそう…」 企画きかく書しょやウェブサイトの作成さくせい、ちょっとした息抜いきぬきのためのゲーム開発かいはつ、あるいは日々ひびの業務ぎょうむを効率こうりつ化かするアプリケーションのアイデア。せっかくのひらめきも、いざ具体ぐたい的てきにまとめようとすると、少すこし気きが重おもくなってしまうことはありませんか。 そんな時ときに心強こころづよい味方みかたとなるのが、Gemini アプリに追加ついかされた新しん機能きのう「Canvas」です。Canvas は、皆みなさんのアイデアを整理せいりし、文章ぶんしょう作成さくせいからプログラミングコードの記述きじゅつまで、コンテンツを生うみ出だすプロセスをスムーズにサポートします。 この記事きじでは、「Gemini の Canvas って何なに？」 という基本きほん的てきな疑問ぎもんから、具体ぐたい的てきな使つかい方かた、どのような場面ばめんで役立やくだつかまで、初心者しょしんしゃの方ほうにもわかりやすく

              Gemini の新機能 「Canvas」入門： アイデアをカタチにする活用法をわかりやすく徹底解説！｜Gemini - Google の AI

            • 絶対ぜったいに画像がぞうをダウンロード&スクレイピングさせないWebページを本気ほんきで作つくってみた - blog.potproject.net

              巷ちまたで話題わだいになっているこの話題わだい、画像がぞうをスクレイピングやダウンロードされたくないということで騒さわがれています。その話はなしに関かんしては色々いろいろな意見いけんがあると思おもってますがここでは置おいておくとして・・・ 技術ぎじゅつ的てきにやるとしたら実際じっさいどれくらい対策たいさくできるの？ということが気きになったので、自分じぶんの知識ちしきで出来できる限かぎり対策たいさくしたものを作つくってみることにしました。 最初さいしょに 賢かしこい方ほうはわかると思おもいますが、タイトルは釣つりです。 絶対ぜったいに画像がぞうをダウンロード&スクレイピングさせないページは存在そんざいしません。ソフトウェアにおいて絶対ぜったいと言いう言葉ことばはまず存在そんざいしないのです。ブラウザで表示ひょうじしている以上いじょう、仕組しくみさえわかれば技術ぎじゅつ的てきには可能かのうです。 そのため、 「元もと画像がぞうのダウンロードとスクレイピングを非常ひじょうに困難こんなんにしたWebページを本気ほんきで作つくってみた」 が実際じっさいのタイトルかなとなります。 とはいえ、この仕組しくみであれば大だい多数たすうの人ひとは機械きかい的てきにスクレイピングすることを諦あきらめるレベルの作さく

                絶対に画像をダウンロード&スクレイピングさせないWebページを本気で作ってみた - blog.potproject.net

              • GPT-4を使つかって ぷよぷよ 作つくってみたときの感想かんそう

                以下いかのツイートに反響はんきょうがあったので、どういう感かんじで作つくっていったかと感想かんそうをメモ 要約ようやく この記事きじではAIのChatGPT（GPT-4）を使用しようして、JavaScriptでぷよぷよを作成さくせいする手法しゅほうについて紹介しょうかいしています。最初さいしょの依頼いらいは「JavaScriptで動うごくぷよぷよのコードを書かいて」とされており、最初さいしょに生成せいせいされたコードは不完全ふかんぜんであったとのことです。 その後ご、AI側がわからは、1.ぷよの衝突しょうとつ検出けんしゅつ、2.プレイヤーの入力にゅうりょくによるぷよの操作そうさ、3.ぷよの回転かいてんの順じゅんに実装じっそうするように指示しじがあり、徐々じょじょに改善かいぜんを施ほどこしていきました。 短時間たんじかんで開発かいはつを終おえることができるため、エンジニアとしてのスキルや要求ようきゅう、不具合ふぐあいの言語げんご化か能力のうりょくがあれば有効ゆうこうだとされています。現時点げんじてんでは優秀ゆうしゅうなプログラミングのアシスタントとして機能きのうしています。 エンジニアが直面ちょくめんするストレスや不安ふあんを軽減けいげんできる可能かのう性せいがあります。一いち例れいとして、短期間たんきかんで開発かいはつを終おえることができるため、

                  GPT-4を使って ぷよぷよ 作ってみたときの感想

                • HTTPS 証明しょうめい書しょの Common Name の検証けんしょうがしれっと禁止きんしされていた件けんについて | IIJ Engineers Blog

                  開発かいはつ・運用うんようの現場げんばから、IIJのエンジニアが技術ぎじゅつ的てきな情報じょうほうや取とり組くみについて執筆しっぴつする公式こうしきブログを運営うんえいしています。 こんにちは。IIJ Engineers Blog編集へんしゅう部ぶです。 IIJの社内しゃない掲示板けいじばんでは、エンジニアのちょっとした技術ぎじゅつネタが好評こうひょうとなって多おおくのコメントが付ついたり、お役立やくだち情報じょうほうが掲載けいさいされています。 今回こんかいは、すでにお気きづきの方ほうもいるかもしれませんが、いつの間まにか HTTPS 証明しょうめい書しょの Common Name の検証けんしょうが禁止きんし になっていた件けんについて紹介しょうかいします。 HTTPS 証明しょうめい書しょの検証けんしょう手続てつづきは、RFC2818 で「Subject Alternative Name があればそれで、なければ Common Name を見みよ」となっていました。 If a subjectAltName extension of type dNSName is present, that MUST be used as

                    HTTPS 証明書の Common Name の検証がしれっと禁止されていた件について | IIJ Engineers Blog

                  • なんでもメモして個人こじん的てきな知識ちしきを蓄たくわえる「Obsidian」のキャンバスデータ保存ほぞん形式けいしき「JSON Canvas」がオープンソース化か、中身なかみはこんな感かんじ

                    Markdown形式けいしきでメモを作成さくせいできるサービスのObsidianが使用しようしているObsidian Canvasファイル形式けいしきを「JSON Canvas」ファイル形式けいしきとしてオープンソース化かすることを発表はっぴょうしました。 JSON Canvas — An open file format for infinite canvas data. https://jsoncanvas.org/ Announcing JSON Canvas: an open file format for infinite canvas data - Obsidian https://obsidian.md/blog/json-canvas/ 仕様しようについてはjsoncanvas.orgに記載きさいされています。サイトにアクセスするとこんな感かんじ。右みぎ下かの「Toggle output」をクリックしてみます。 右側みぎがわにJSON Canvas形式けいしき

                      なんでもメモして個人的な知識を蓄える「Obsidian」のキャンバスデータ保存形式「JSON Canvas」がオープンソース化、中身はこんな感じ

                    • 「GPT-4o with canvas」がスゴい! 文章ぶんしょう作成さくせいやコーディング生産せいさん性せいが爆ばく上あがり

                        「GPT-4o with canvas」がスゴい! 文章作成やコーディング生産性が爆上がり

                      • Google Workspaceがnotionを意識いしきした大だい規模きぼなアップデートを開始かいし

                        先日せんじつのGoogle I/O 2021基調きちょう講演こうえんで、Google DocsやSpreadsheetを含ふくむスイートであり、GSuiteからブランド名めいが変かわったGoogle Workspaceにかなり大掛おおがかりなアップデートをこれから年末ねんまつにかけてロールアウトされることが発表はっぴょうされました。 Smart Canvasと名付なづけられたこの新しん機能きのうはなにか単一たんいつの機能きのうというよりは、Google Docs, Spreadsheets, Slides, Meet など、すべてのサービスを結むすびつける体験たいけんの変化へんかという側面そくめんが強つよいので説明せつめいが難むずかしいのですが、一言ひとことでいうと「まるでnotionのように利用りようできるようになる」と表現ひょうげんすれば伝つたわる人ひとには伝つたわると思おもいます。 まずは短みじかい動画どうがでその雰囲気ふんいきを確たしかめてください。 おそらくわかったような、わからなかったような気分きぶんになると思おもいますが、この動画どうがには過去かこ10年ねんほどGoogle Docsが避さけ

                          Google Workspaceがnotionを意識した大規模なアップデートを開始

                        • ChatGPT (o1-preview) にテストを渡わたしてコードを実装じっそうさせるとどうなるか試ためした

                          はじめに 前まえにも別べつのモデルでやってる ただ o1-preview は、やり取とりを重かさねるよりも一発いっぱつで終おわらせるほうがいいらしいので、最終さいしゅう的てきなテスト全体ぜんたいを渡わたすようにした。 情報じょうほうの提示ていじ方法ほうほうが異ことなると当然とうぜん結果けっかも変かわるので、 gpt-4o でも同様どうようなことを試ためした。 材料ざいりょう プロンプトは以下いか。 基本きほん的てきに最初さいしょにやったときと同おなじ。ペアプロではないのでその部分ぶぶんの調整ちょうせいをしている - 私わたしがテストコードを提示ていじするのでそのテストケースをパスする最小限さいしょうげんの実装じっそうをしてください - Vue.js のバージョン 3 と Typescript で実装じっそうを行おこなってください - コードのみを示しめしてくださいコードの解説かいせつなどは必要ひつようありません - スタイリングは必要ひつようありません - テストケースに失敗しっぱいしたらその内容ないようをチャットで送信そうしんするので最小限さいしょうげんのコードの修正しゅうせいをしてください - テストのコードには vitest を利用りようしています jest と互換ごかん

                            ChatGPT (o1-preview) にテストを渡してコードを実装させるとどうなるか試した

                          • CursorによるAI駆動くどう開発かいはつ入門にゅうもん | フューチャー技術ぎじゅつブログ

                            本ほん記事きじは、春はるの入門にゅうもん祭まつり2025の10本ほん目めです。 はじめにSAIG（Strategic AI Group）の小橋こはしです。生成せいせいAI関連かんれんの検証けんしょうや、データ分析ぶんせきの業務ぎょうむを担当たんとうしています。 生成せいせいAIを使つかった開発かいはつ手法しゅほうの進化しんかは目めを見張みはるものがあります。私わたし自身じしんは業務ぎょうむでAI駆動くどう開発かいはつをすることは無ないのですが、CursorやClineなどのニュースを見みない日ひはありません。 Technology Radar の記事きじを2年ねん前まえに書かいたことを思おもい出だしたので、読よみ返かえしてみました。このときは、GitHub Copilotが出で始はじめたくらいでした。しかし最新さいしん版ばん（2025年ねん4月がつ）のTechnology Radarでは、Cursor, Cline, Windsurfが登場とうじょうしています。2年間ねんかんで様子ようすが随分ずいぶん変かわったなと驚おどろかされます。 そんな中なかで、ある勉強べんきょう会かいでこの本ほんを知しったので、いい機会きかいと思おもい読よんでみました。 AI駆動くどう開発かいはつ完全かんぜん入門にゅうもん ソフトウェア

                              CursorによるAI駆動開発入門 | フューチャー技術ブログ

                            • JSON Canvas

                              An open file format for infinite canvas data. Infinite canvas tools are a way to view and organize information spatially, like a digital whiteboard. Infinite canvases encourage freedom and exploration, and have become a popular interface pattern across many apps. The JSON Canvas format was created to provide longevity, readability, interoperability, and extensibility to data created with infinite

                                JSON Canvas

                              • デザイナーにもお勧すすめ！ CSSもThree.jsもタイムライン編集へんしゅうを可能かのうにするTheatre.jsが凄すごい - ICS MEDIA

                                デザイナーにもお勧すすめ！ CSSもThree.jsもタイムライン編集へんしゅうを可能かのうにするTheatre.jsが凄すごい ウェブサイトの演出えんしゅつを作つくる上じょうでアニメーションの実装じっそうは欠かかせません。一般いっぱん的てきには、CSSアニメーションやJavaScriptのライブラリ（GSAPジーサップなど）を用もちいてコードベースで動うごきをつけることが多おおいと思おもいます。ですが、完全かんぜんにコードだけでアニメーションを調整ちょうせいするのは大変たいへんだと思おもったことはないでしょうか？ 一度いちど実装じっそうしたことがある方ほうは共感きょうかんいただけるかもしれませんが、少すこし直なおそうにもコードに戻もどって調整ちょうせいし、反映はんえいされたブラウザ画面がめんを確認かくにんして、もう一度いちどコードを直なおして…と往復おうふくしていると結構けっこう大変たいへんです。また、アニメーションさせるプロパティや要素ようそが複数ふくすうある場合ばあいには、コードを解読かいどくする難易なんい度ども上あがります。 本ほん記事きじではそんな悩なやみを解決かいけつできる、GUIからアニメーションを調整ちょうせいできるライブラリ「Theatre.jsシアタ

                                  デザイナーにもお勧め！ CSSもThree.jsもタイムライン編集を可能にするTheatre.jsが凄い - ICS MEDIA

                                • ワコムから描えがくことに特とく化かしたAndroidタブレット「MovinkPad 11」が7月がつ31日にち発売はつばい。必要ひつような機能きのうを1台だいにまとめたオールインワン設計せっけいで描えがきたい時ときにすぐ描えがける。現在げんざい予よ約やく受付うけつけ中ちゅう

                                  以下いか、プレスリリースの全文ぜんぶんを掲載けいさいしています “描えがきたい”気持きもちにすぐ応こたえる、新あたらしい「描えがく」体験たいけん。「Wacom MovinkPad 11」、7月がつ31日にち発売はつばい描えがくことに特とく化かしたオールインワン設計せっけい。軽かるさと使つかいやすさを追求ついきゅうした、毎日まいにち持もち運はこびたくなるクリエイティブパッド。株式会社かぶしきがいしゃワコムは、描えがきたいと思おもったその瞬間しゅんかんにすぐに描えがき始はじめられるポータブルクリエイティブパッド「Wacom MovinkPad 11」を、7月がつ31日にち（木き）に発売はつばいします。 ペンを手てに取とった瞬間しゅんかんにすぐ描えがき出だせる手軽てがるさと、場所ばしょを選えらばず自由じゆうに使つかえる軽快けいかいさが特長とくちょうで、“描えがきたい”と思おもった瞬間しゅんかんに描えがき始はじめられる、そんな体験たいけんを支ささえます。 必要ひつようなのは、描えがきたい気持きもちだけ「Wacom MovinkPad 11」は、多目的たもくてき用途ようとのタブレットとは異ことなる設計せっけい思想しそうで生うまれた、描えがくことに特とく化かしたAndroid 14搭載とうさいのポータブルデバイスです。PCとの接続せつぞくや複雑ふくざつな初期しょき

                                    ワコムから描くことに特化したAndroidタブレット「MovinkPad 11」が7月31日発売。必要な機能を1台にまとめたオールインワン設計で描きたい時にすぐ描ける。現在予約受付中

                                  • Slack、まとめ機能きのう「Slack Canvas」提供ていきょうへ。複数ふくすうチャンネルにまたがる情報じょうほうを整理せいり・集約しゅうやくして表示ひょうじ可能かのう　「ハドルミーティング」を拡張かくちょうするビデオ／画面がめん共有きょうゆう機能きのうの一般いっぱん提供ていきょう開始かいしも

                                      Slack、まとめ機能「Slack Canvas」提供へ。複数チャンネルにまたがる情報を整理・集約して表示可能　「ハドルミーティング」を拡張するビデオ／画面共有機能の一般提供開始も

                                    • Eraser – AI co-pilot for technical design

                                      🎉 Announcing AI reference library, bring your building blocks.

                                        Eraser – AI co-pilot for technical design

                                      • WebAssemblyハンズオン: 実際じっさいに動うごかして基礎きそを学まなぶ（翻訳ほんやく）｜TechRacho by BPS株式会社かぶしきがいしゃ

                                        概要がいよう 原著げんちょ者しゃの許諾きょだくを得えて翻訳ほんやく・公開こうかいいたします。 英語えいご記事きじ: Hands-on WebAssembly: Try the basics — Martian Chronicles, Evil Martians’ team blog 原文げんぶん公開こうかい日び: 2020/08/25 著者ちょしゃ: Polina Gurtovaya、Andy Barnov サイト: Evil Martians -- ニューヨークやロシアを中心ちゅうしんに拠点きょてんを構かまえるRuby on Rails開発かいはつ会社かいしゃです。良質りょうしつのブログ記事きじを多数たすう公開こうかいし、多おおくのgemのスポンサーでもあります。 日本語にほんごタイトルは内容ないように即そくしたものにしました。画像がぞうはすべて元もと記事きじからの引用いんようです。 Web開発かいはつの一般いっぱん的てきな知識ちしきのみを前提ぜんていとするシンプルなハンズオンチュートリアルで、WebAssembly（Wasm）を始はじめてみましょう。実行じっこう可能かのうなコード例れいを用もちいてWasmを味あじわうのに必要ひつようなものは「コー

                                          WebAssemblyハンズオン: 実際に動かして基礎を学ぶ（翻訳）｜TechRacho by BPS株式会社

                                        • あらためて理解りかいするArrayBuffer - JavaScriptでバイナリデータを扱あつかう方法ほうほう - ICS MEDIA

                                          配列はいれつ（Array）との比較ひかく JavaScriptにはTypedArrayとは別べつに配列はいれつ（Array）の違ちがいを説明せつめいします。 ArrayはTypedArrayと比くらべると柔軟じゅうなんで汎用はんよう性せいが高たかいです。しかし、Arrayは内部ないぶで動的どうてきなメモリー管理かんりを行おこなうため、データ処理しょりや転送てんそうを高たかい頻度ひんどで行おこなう場合ばあいにはオーバーヘッドが発生はっせいする可能かのう性せいがあります。 TypedArrayは長ながさが固定こていであり、バイト単位たんいのデータ格納かくのうが可能かのうなため、メモリーアクセスが効率こうりつ的てきに行おこなわれます。数値すうち計算けいさんにおいてもバイナリデータを直接ちょくせつ操作そうさできるので、高たかいパフォーマンスが期待きたいできます。また、メモリー領域りょういきが連続れんぞくしているので高速こうそくなデータの転送てんそうが可能かのうです。 大量たいりょうのデータを処理しょりする数値すうち計算けいさんの場合ばあいにはTypedArrayで管理かんりするとデータのまとめた取とり回まわしが楽らくになります。逆ぎゃくにデータの規模きぼが小ちいさい時ときは汎用はんよう的てきなArrayが良よいでしょう。 TypedArrayは決きまっ

                                            あらためて理解するArrayBuffer - JavaScriptでバイナリデータを扱う方法 - ICS MEDIA

                                          • Personal Tech Blog | hidekazu-konishi.com

                                            Here I plan to share my technical knowledge and experience, as well as my interests in the subject. Please note that this tech blog is a space for sharing my personal views and ideas, and it does not represent the opinions of any company or organization I am affiliated with. The main purpose of this blog is to deepen my own technical skills and knowledge, to create an archive where I can record an

                                              Personal Tech Blog | hidekazu-konishi.com

                                            • 変幻へんげん自在じざいなグラフィック表現ひょうげん！CSS, SVG, Canvasでマスクを使つかいこなせ - ICS MEDIA

                                              近年きんねん、ウェブ技術ぎじゅつの発展はってんにより、画像がぞうの一部いちぶだけを表示ひょうじする「マスク表現ひょうげん」がよく見みられるようになりました。一言ひとことでマスクと言いっても、アニメーションやインタラクションとの組くみ合あわせによりさまざまな表現ひょうげんが可能かのうです。 また、どの技術ぎじゅつを用もちいるかという選択せんたくも重要じゅうようになります。マスク表現ひょうげんはCSS, SVG, Canvas APIといった技術ぎじゅつで実現じつげんできますが、それぞれが異ことなる得意とくい分野ぶんやをもちます。 本ほん記事きじの前半ぜんはんでは、マスク表現ひょうげんを実現じつげんする技術ぎじゅつについて解説かいせつを行おこないます。後半こうはんでは実践じっせん的てきなマスク表現ひょうげんをいくつか紹介しょうかいしながら、それぞれの実装じっそう方法ほうほうを紹介しょうかいします。いままで技術ぎじゅつ的てきに難むずかしいと諦あきらめていた表現ひょうげんが、マスクによって実現じつげんするヒントになれば幸さいわいです。 ▼マスク表現ひょうげんの例れい（背景はいけい画像がぞうの一部いちぶを表示ひょうじしている） - Erika Moreira Portfolio マスクとは 本ほん記事きじで紹介しょうかいするマスク表現ひょうげんとは、画像がぞうの一部いちぶを切きり抜ぬく手法しゅほうです。マスキング

                                                変幻自在なグラフィック表現！CSS, SVG, Canvasでマスクを使いこなせ - ICS MEDIA

                                              • GitHub - heppoko/Unity_uGUI_Advance_Reference: Unity uGUI Advance Reference

                                                You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

                                                  GitHub - heppoko/Unity_uGUI_Advance_Reference: Unity uGUI Advance Reference

                                                • Cookieを永続えいぞく化かして、どこまでも個人こじんを追跡ついせきするEvercookie - Qiita

                                                  Evercookieは、ブラウザに究極きゅうきょく的てきに永続えいぞく的てきなCookieを生成せいせいするJavaScript APIです。 その目的もくてきは、標準ひょうじゅん的てきなCookie、Flash Cookieなどを削除さくじょした後のちでもクライアントを識別しきべつし続つづけることです。 これは、可能かのうなかぎり多おおくのストレージにCookieデータを保存ほぞんすることで達成たっせいします。 いずれかのストレージからCookieが削除さくじょされたとしても、ひとつでも残のこっている限かぎり、Evercookieは残のこったデータからCookieデータを復旧ふっきゅうします。 Flash LSO、SilverlightもしくはJavaが有効ゆうこうな場合ばあい、Evercookieはブラウザを超こえて同おなじクライアント上じょうの別べつのブラウザにCookieを伝播でんぱすることすら可能かのうです。 本ほんリポジトリは、Samy Kamkarおよび多おおくのコントリビュータによって作つくられています。 Browser Storage Mechanisms E

                                                    Cookieを永続化して、どこまでも個人を追跡するEvercookie - Qiita

                                                  • Next.js Conf 2022で最もっとも感動かんどうしたライブラリ、vercel/satoriについて紹介しょうかいさせてください。 - Commune Engineer Blog

                                                    はじめまして。コミューンでサーバーサイドエンジニアとして働はたらいています、あのちっくと申もうします。 突然とつぜんですが皆様みなさまは昨年さくねん 10 月がつに開催かいさいされたNext.js Conf 2022はご覧らんになられましたでしょうか。 Next.js Conf は Next.js の開発かいはつ・メンテナンスを行おこなっている Vercel 社しゃが主催しゅさいする、Next.js とその周辺しゅうへん技術ぎじゅつに関かんするカンファレンスです。 コミューンでもメインプロダクト commmune の Web フロントフレームワークとして Next.js を採用さいようしており、私わたし個人こじんとしてもとても興味深きょうみぶかくオンラインから視聴しちょうをしていました。 特とくに話題わだいになったのは、React Server Components をサポートしたルーティング・レイアウトシステム"app directory"などの新しん機能きのうを新あらたに追加ついかしたNext.js 13と、"Webpack の後継こうけい"を謳うたう Rust

                                                      Next.js Conf 2022で最も感動したライブラリ、vercel/satoriについて紹介させてください。 - Commune Engineer Blog

                                                    • ページ遷移せんい時じにReactコンポーネントの状態じょうたいを維持いじする - pixiv inside

                                                      こんにちは、VRoid部ぶ所属しょぞくのエンジニアのyueです。 VRoid Hubでページ遷移せんい時じにcanvasの状態じょうたいを維持いじする改善かいぜんをリリースしました。本ほん記事きじではこの取とり込こみについて解説かいせつしていきます。 前提ぜんてい VRoid Hubではモデル詳細しょうさい画面がめんと投稿とうこう者しゃのみに表示ひょうじするモデル編集へんしゅう画面がめんが存在そんざいしています。この二ふたつのページは別々べつべつのレイアウトを使つかっていたため、モデル表示ひょうじ用ようのcanvasを操作そうさするインスタンスがお互たがい共通きょうつうせず、ページ遷移せんいするたびにモデルを再度さいど読よみ込こむことが必要ひつようでした。 今回こんかいはDOM APIを利用りようしてコード変更へんこうを最小限さいしょうげんに押おさえつつ、再度さいど読よみを無なくすような改善かいぜんを行おこないました。 問題もんだいの再現さいげん 通常つうじょうReactの再さいレンダリングを防ふせぐには様々さまざまな手段しゅだんがあります。例たとえば React.memo 、React コンポーネントの key 、classコンポーネントのshouldComponentUpdate などが存在そんざいします

                                                        ページ遷移時にReactコンポーネントの状態を維持する - pixiv inside

                                                      • ChatGPTと協力きょうりょくしながらコーディングや執筆しっぴつが可能かのうなアプリ「Canvas」をOpenAIがリリース

                                                        ChatGPTと協力きょうりょくしながら文章ぶんしょう執筆しっぴつやコーディングなどの作業さぎょうをこなせるアプリ「Canvas」のベータ版ばんが2024年ねん10月がつ3日にちにリリースされました。記事きじ作成さくせい時点じてんではChatGPT Plusの加入かにゅう者しゃ向むけにベータテストが実施じっしされており、テストの終了しゅうりょう後ごは無料むりょうユーザーも利用りよう可能かのうになる予定よていです。 Canvas is a new way to write and code with ChatGPT | OpenAI https://openai.com/index/introducing-canvas/ Canvasでは「ChatGPTに文章ぶんしょうやコードの下書したがきを入力にゅうりょくして清書せいしょさせる」「ChatGPTが生成せいせいした文章ぶんしょうの一部いちぶを人力じんりきもしくはChatGPTに依頼いらいして修正しゅうせいする」といった操作そうさが可能かのうです。内部ないぶでは「GPT-4oを共同きょうどう作業さぎょう用ようにトレーニングしたモデル」が動作どうさしており、OpenAIはCanvasを「ChatGPT

                                                          ChatGPTと協力しながらコーディングや執筆が可能なアプリ「Canvas」をOpenAIがリリース

                                                        • ChatGPTがコーディング支援しえんを強化きょうか。コードエディタ機能きのうを統合とうごう、コードレビューやデバッグ、他た言語げんごへの移植いしょくツールなどを含ふくむ新しん機能きのう「Canvas」が登場とうじょう

                                                          ChatGPTがコーディング支援しえんを強化きょうか。コードエディタ機能きのうを統合とうごう、コードレビューやデバッグ、他た言語げんごへの移植いしょくツールなどを含ふくむ新しん機能きのう「Canvas」が登場とうじょう OpenAIはChatGPTの新しん機能きのう「Canvas」を発表はっぴょうしました。 ChatGPTはさまざまな指示しじや依頼いらいにAIが対応たいおうする汎用はんよう目的もくてきで使つかえるサービスですが、新しん機能きのう「Canvas」は特とくに文章ぶんしょうの作成さくせいとコードの作成さくせいにおいてChatGPTをより生産せいさん的てきなツールとして使つかえるような機能きのうを提供ていきょうしています。 When writing code, canvas makes it easier to track and understand ChatGPT’s changes. It can also review code, add logs and comments, fix bugs, and port to other coding languages l

                                                            ChatGPTがコーディング支援を強化。コードエディタ機能を統合、コードレビューやデバッグ、他言語への移植ツールなどを含む新機能「Canvas」が登場

                                                          • Canvasだけじゃない！requestAnimationFrameを使つかったアニメーション表現ひょうげん - ICS MEDIA

                                                            requestAnimationFrame()というとCanvas APIなどを使つかったクリエイティブコーディングでよく使つかわれる手法しゅほうですが、クリエイティブコーディングに限かぎったものではなく、一般いっぱん的てきなウェブサイトのアニメーション表現ひょうげんにも役立やくだちます。 この記事きじでは「トップに戻もどるアニメーション」を例れいに、requesetAnimationFrame()の基本きほん的てきな使つかい方かたから、実際じっさいのWebサイトで使つかえる実装じっそうまでチュートリアル形式けいしきで解説かいせつしています。 この記事きじで学まなべること requestAnimationFrame()でアニメーションするやり方かた ディスプレイのリフレッシュレートに依存いぞんしない実装じっそう方法ほうほう イージング関数かんすうを使つかったアニメーション さまざまな作例さくれいのサンプルファイルも用意よういしています。ぜひご覧らんください。 サンプルを別べつウインドウで再生さいせいする setInterval()との違ちがい requestAnimationFr

                                                              Canvasだけじゃない！requestAnimationFrameを使ったアニメーション表現 - ICS MEDIA

                                                            • Obsidian Canvas - Visualize your ideas

                                                              Visualize your ideas. Infinite space to research, brainstorm, diagram, and lay out your ideas. Canvas comes free with Obsidian. A playground for thought Canvas allows you to organize notes visually — an infinite space to research, brainstorm, diagram and lay out your ideas. Embed your notes alongside images, PDFs, videos, audio, and even fully interactive web pages. A new way to think Effortlessly

                                                                Obsidian Canvas - Visualize your ideas

                                                              • NintendoDS風ふうのグラフィックをUnityで作つくる - Qiita

                                                                Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 2020年ねん8月がつに開催かいさいされたUnity1week(お題だい:ふえる)で、私わたしはDSのグラフィック（主おもにポケ〇ン）を再現さいげんしたアクションゲーム【がんばれ！ソラコくん】を制作せいさくしました。本ほん記事きじでは、再現さいげんまでの過程かてい（？）を備忘録びぼうろく的てきな意味いみも少すこし込こめてまとめています。 こんな感かんじのゲームです がんばれ！ソラコくん | フリーゲーム投稿とうこうサイト #unityroom https://t.co/nAMC54lTYd #unity1week #がんばれソラコくん Unityを使つかって、一いち週間しゅうかんでDSのポケ〇ンのグラフィックを再現さいげんしたゲームを作つくってみました！！！

                                                                  NintendoDS風のグラフィックをUnityで作る - Qiita

                                                                • canvasで大量たいりょうの円えんがランダムに動うごくパーティクルを実装じっそうしてみよう！ | 株式会社かぶしきがいしゃLIG(リグ)｜DX支援しえん・システム開発かいはつ・Web制作せいさく

                                                                  こんにちは、フロントエンドエンジニアのぜんちゃんです。 最近さいきんはアニメーション表現ひょうげんを増ふやすために、canvasの勉強べんきょうを始はじめました。そこで、今回こんかいはcanvasやJavaScriptの基本きほん技術ぎじゅつを使つかって、円えんがランダムに動うごくパーティクルアニメーションを実装じっそうしたいと思おもいます。 今回こんかい作つくるアニメーションはこちらです。 円えんを作成さくせい・描画びょうがする canvas要素ようそを作成さくせいし、そのcanvas内ないに円えんを作つくっていきます。 まずは一ひとつだけ作つくりたいと思おもいます。 <canvas id="canvas"></canvas> // キャンバス要素ようそを取得しゅとく const canvas = document.getElementById('canvas'); // キャンパスに描画びょうがするコンテキストを取得しゅとく const ctx = canvas.getContext('2d'); // キャンバスサイズをwindowサイズに canvas.wi

                                                                    canvasで大量の円がランダムに動くパーティクルを実装してみよう！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作

                                                                  • サイトのOGP画像がぞうを自動じどう生成せいせいする

                                                                    最近さいきん、個人こじんの技術ぎじゅつブログをリニューアルしました（パンダのプログラミングブログ）。 リニューアルの際さいに、念願ねんがんだった OG 画像がぞうの自動じどう生成せいせいを実装じっそうしてみたところ、意外いがいと簡単かんたんにできたのでその方法ほうほうを紹介しょうかいします。 OGP画像がぞうとは何なにか OGP 画像がぞうの OGPとは Open Graph Protocol の略語りゃくごで、ある URL のページをリッチなコンテンツで紹介しょうかいできるというものです。 サイトのタイトルやページのコンテンツをイメージさせる画像がぞうなどを meta タグを使つかって HTML に埋うめ込こみページの内容ないようを表現ひょうげんできます。 Twitter や Slack、Line で URL を貼はり付つけると URL とは別べつに表示ひょうじされる物ものがこれにあたります。サイトのページが増ふえるとページ一ひとつ一ひとつに OGP 画像がぞうを用意よういすることは手間てまがかかります。そこでこの記事きじでは、OGP 画像がぞうを自動じどう生成せいせいする方法ほうほうを紹介しょうかいします。 OGP 画像がぞうの作成さくせい方かた

                                                                      サイトのOGP画像を自動生成する

                                                                    • Utopia

                                                                      Utopia is a production-grade online coding and design tool for React that reads and writes code you’ll want to commit.

                                                                        Utopia

                                                                      • WebAssembly で画像がぞうのリサイズ処理しょりをやってみたら JavaScript + Canvas API より遅おそかった話はなし - Qiita

                                                                        WebAssembly(WASM) は JavaScript より計算けいさん処理しょりが速はやいという話題わだいがしばしば聞きかれます。 では、単純たんじゅんな数値すうち計算けいさんではないけれど、JavaScript を利用りようした通常つうじょうのフロントエンド開発かいはつだと時間じかんがかかる処理しょりを移植いしょくするとどうなるのでしょうか1。本ほん記事きじではその一いち例れいとして、巨大きょだい画像がぞう（4K～）を指定していしたピクセル数すうまでリサイズする処理しょりを書かいてみました。 リポジトリ: https://github.com/yokra9/wasm-image-resizer JavaScript + Canvas API でリサイズしてみる まず、比較ひかくのため JavaScript でリサイズ処理しょりを書かいておきましょう。とはいえ、TypeScript からコンパイルして生成せいせいします。 const url = "./img/sample.jpg"; const resp = await fetch(url)

                                                                          WebAssembly で画像のリサイズ処理をやってみたら JavaScript + Canvas API より遅かった話 - Qiita

                                                                        • ImageMagick の Canvas / Page について - Qiita

                                                                          Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

                                                                            ImageMagick の Canvas / Page について - Qiita

                                                                          • NVIDIA Canvas: AI のパワーを活用かつようする

                                                                            AI により、筆ふでで簡単かんたんに描えがいた線せんや形かたちがリアリティのある風景ふうけい画がに変かわります。背景はいけいをすばやく作成さくせいしたり、コンセプトの探究たんきゅうを加速かそくしたりすることによりアイディアの視覚しかく化かにさらに多おおくの時間じかんを使つかえるようになります。

                                                                              NVIDIA Canvas: AI のパワーを活用する

                                                                            • 画像がぞう入力にゅうりょくで楽々らくらく！ChatGPT-4V と Python GUI 開発かいはつ - Qiita

                                                                              1. はじめに ついに ChatGPT-4V が使つかえるようになりました！ これまでGUIを作成さくせいするときには、ChatGPT に 「まず左上ひだりうえにテキストボックスがあって、その右みぎにボタンがあって...」 とちまちま指示しじする必要ひつようがあったのですが、GPT-4V により画像がぞうを渡わたせるようになります。 この記事きじでは、ChatGPT-4V を使つかうと GUI 作成さくせいがどのくらい楽らくになるのかを検証けんしょうしてみたいと思おもいます！ 作成さくせいするGUIはこちらのものです。 2. GPT-4V の読よみ取とり精度せいどの確認かくにん 2.1. 日本語にほんごのポンチ絵ぽんちえ まず、元もとの記事きじで使用しようした日本語にほんごのポンチ絵ぽんちえを渡わたして、どのように読よみ取とれるのかを確認かくにんします。 GUIの各かく要素ようその位置いちはなんとなく読よみ取とれている感かんじがしますが、日本語にほんごの読よみ取とり精度せいどはあまり高たかくないようです。 2.2. 英語えいごのポンチ絵ぽんちえ 先さきほどのポンチ絵ぽんちえを英語えいごに変換へんかんしてみます（左下ひだりしただけ詳くわしく書かき直なおしました

                                                                                画像入力で楽々！ChatGPT-4V と Python GUI 開発 - Qiita

                                                                              • 制作せいさく事例じれい：Lottieのアニメーションを手描てがき風ふうに動うごかしたい！SVGとWebGLを使つかった2つのアプローチ - ICS MEDIA

                                                                                制作せいさく事例じれい：Lottieのアニメーションを手描てがき風ふうに動うごかしたい！ SVGとWebGLを使つかった2つのアプローチ ICSでは2022年ねんに株式会社かぶしきがいしゃニコン様さまの中長期ちゅうちょうきビジョンを紹介しょうかいする特設とくせつサイト『2030年ねんのありたい姿すがた』の実装じっそうを行おこないました。この記事きじではサイトのメインビジュアルとして使用しようしている手描てがき感かんのあるアニメーションを実現じつげんするために検証けんしょう・実装じっそうしたSVGとWebGLの技術ぎじゅつご紹介しょうかいします。SVGやWebGLを活用かつようしたビジュアル表現ひょうげんに興味きょうみのあるエンジニアはもちろん、ウェブ技術ぎじゅつを使つかってどのような表現ひょうげんができるのか知しっておきたいディレクター・デザイナーの方ほうも是非ぜひご覧らんください。 ▼ 特設とくせつサイト『2030年ねんのありたい姿すがた』 「人ひとと機械きかいの共きょう創そう」を魅力みりょく的てきなアニメーションで描えがきたい 『2030年ねんのありたい姿すがた』の重要じゅうようなキーワードが「人ひとと機械きかいが共きょう創そうする社会しゃかい」でした。特設とくせつサイトではこのビジョンを広ひろく一般いっぱんの方向ほうこうけに伝つたえるため、株式かぶしき

                                                                                  制作事例：Lottieのアニメーションを手描き風に動かしたい！SVGとWebGLを使った2つのアプローチ - ICS MEDIA

                                                                                • 生なま WebGL と TypeScript で Vercel のロゴを作つくる

                                                                                  はじめに 完全かんぜんに釣つりタイトルです。Three.js などを使つかわずに生なまの WebGL で ▲ を描えがくというだけの話はなしです。いわゆる WebGL の「Hello World」です。Vercel や Next.js とは一切いっさい関係かんけいありません。 WebGL を詳細しょうさいに解説かいせつしているサイトはいくつかあって、内容ないように関かんしてはどれもすばらしいものです。ただ、何なん年ねんも前まえのものなのでソースコードにまだ var が使つかわれているものも多おおく、また独自どくじ関数かんすうで処理しょりをまとめていることで、個人こじん的てきには全体ぜんたいの流ながれが少すこしわかりにくくなっている気きがします。さらに TypeScript を使つかっている日本語にほんご記事きじは見当みあたりませんでしたので、それらを補おぎなう形かたちでまとめてみたいと思おもいます。 なお、本ほん記事きじでは全体ぜんたい的てきな流ながれに焦点しょうてんを当あてているので、詳細しょうさいな解説かいせつは下記かきサイトなどをご参考さんこうください。 WebGLの基本きほん (日本語にほんご) wgld.org | WebGL (日ひ

                                                                                    生 WebGL と TypeScript で Vercel のロゴを作る
                                                                                  1 2 3 次つぎのページ

                                                                                  新着しんちゃく記事きじ

                                                                                  はてなブックマーク

                                                                                  公式こうしきTwitter

                                                                                  はてなのサービス

                                                                                  • App Storeからダウンロード
                                                                                  • Google Playで手に入れよう
                                                                                  Copyright © 2005-2025 Hatena. All Rights Reserved.