GitHub - google/budouxYou 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
モダン JavaScript チートシート
Skip to the content. モダン JavaScript チートシート 画像クレジット: Ahmad Awais ⚡️ イントロダクション 動機 このドキュメントはモダンなプロジェクトでよく見られる JavaScript のチートシートと最新のサンプルコードです。 このガイドは読者に JavaScript をゼロから教えるものではありません。 基礎知識は持っていて、モダンなコードベースに慣れる（例えば React を学ぶ）のに苦労している開発者を助けるためのものです。 説明の中で JavaScript の諸概念が使われています。 また、議論の余地のあるポイントについてときどき個人的な tips を載せますが、その際はあくまでも個人的なおすすめであることを述べるように気をつけます。 メモ: ここで紹介されている概念のほとんどは JavaScript 言語のアップデート（ ES2
JavaScriptで任意のHTML要素をPicture-in-Pictureする
みなさんはPicture-in-Picture(PiP)という機能を使ったことがありますか。PiPは動画コンテンツなどを浮遊する小窓に表示する機能です。小窓はウィンドウの外側を自由に移動できます。 デスクトップが賑やかになりがちなPCでもPiPは大活躍なのですが、特にスマートフォンにおいては数少ない「ウィンドウ」機能になります。Androidはもちろん、iOS14も対応したことで話題になりました。 これによってスマホ一台あれば、ソシャゲの公式生放送を見ながらソシャゲのイベントを周回する地獄のような行為が可能になりました。 利用者という視点から見ると非常に便利なのですが、開発者から見ると動画しか表示できないのはなかなか使い所が難しくなります。そこで、この機能を使って好きな情報を表示できないか実験してみました。 PiP機能の対応環境 Chrome 70 Firefox 71（制限付き） mac
閲覧者のユーザーエージェントを三角関数で判定できるか？ - Qiita
概要 先日ふと自分のPCのフィンガープリントを取ってみたところ「IPアドレス」など様々な項目が並ぶ中に「Math.tan」という変な項目を見つけました。 「なぜ三角関数が出てくるの？」と気になって調べてみたところ、**三角関数の値はブラウザやOSの実装により微妙に異なることがあり、特定の式をブラウザに計算させることで利用者を識別する手段になり得る1**という話でした。 面白そうだなと思ったので、本記事ではその手法で実際どの程度までブラウザ/OSを判別できるのか調査してみました。 検証方法 今回は様々な文献12の情報を参考に、以下の式を各OSの各ブラウザに計算させました。 tan(-1e300) cosh(10)（厳密には三角関数の類似ですが） これら以外も10数種類ほど試したのですが、判別に使えたのはこの2つのみでした。 試したOSとバージョン macOS Catalina (ver.10
スマホにカメラついてるんだからOCRできるでしょという気持ち - Progate Tech Blog
どうも、 株式会社Progate で SoftwareEngineer チームのマネージャーをしています @satetsu888 です。本記事は Progate AdventCalendar 2020 10日目です。 普段仕事ではエンジニア組織のことやプロダクトの技術戦略的なことを考えたり、ミーティングしたり採用活動したりタスクをお願いして回ったりなどを担当していますが、今日はそういうのとはなんの関係もないただの日常の話を書こうと思います。 ことの始まり 我が家では子どもの朝ごはんとして週に2,3回くらいの頻度でポケモンパンを買っています。 先日(2020/09/18 ~ 11/24) ポケモンパンについてるポイントを5点集めるとポケモンシールホルダーの抽選に1回応募できるキャンペーンがありました。（キャンペーン自体はすでに終了しています） いつも通りのペースでパンを買ってると何回か挑戦で
URLにアニメーションをつける - Qiita
はじめに 友達からおもしろいと言われ、このツイートを見ました。 「URLに動きがついていておもしろい！」と感動したので、自分も作成してみました。 GitHub Pagesに公開しましたのでこちらからURLの動きを見ることができます。 URLにアニメーションをつける location.hashを使用し、URLの#以下に動きがつくようにします。 const moons = ["🌑", "🌒", "🌓", "🌔", "🌕", "🌖", "🌗", "🌘"]; const loop = (arr, count = 0, time = 75) => { location.hash = arr[count % arr.length]; setTimeout(loop.bind(this, arr, count + 1, time), time); }; loop(moons); 上記のコ
GitHub - airbnb/ts-migrate: A tool to help migrate JavaScript code quickly and conveniently to TypeScript
ts-migrate is a tool for helping migrate code to TypeScript. It takes a JavaScript, or a partial TypeScript, project in and gives a compiling TypeScript project out. ts-migrate is intended to accelerate the TypeScript migration process. The resulting code will pass the build, but a followup is required to improve type safety. There will be lots of // @ts-expect-error, and any that will need to be
Google Map上にヒートマップを表示する
国土数値情報サイトからダウンロードした都道府県地価調査データ(点)を元にGoogle Map上に群馬県の地価データをヒートマップで表示しました。 国土数値情報からダウンロードしたデータをKMLにコンバートし、さらにJavascriptの配列に変更(手動)してます。 （ぶっちゃけJPGIS(XML)から、直接JavaScriptの配列に変換した方が楽だったような気も…） KML形式への変換の仕方は以下の記事を参照してください。 Google Map上に学校区情報（国土数値情報）を表示する ※追記 Quantum GISでgeoJSON形式で出力することができるので、そっちを使う方がらくでした。 データさえできてしまえば、ヒートマップを表示するのは簡単です。 HeatmapLayerを使用するには、libraries=visualizationを付加してGoogle Map APIを読み込んで
HTML5 Worker Test
Which APIs are supported in Web Workers and Service Workers? This chart shows the breakdown for each browser, based on automated testing. Note that the goal is not for browsers to reach 100% on all tests. Some APIs are intentionally not exposed to workers. This site is for informational purposes only.
Node.js でお手軽スクレイピング 2020 年夏 - Qiita
皆さんは Web ページのスクレイピングって書いた事ありますか？私はあります。だってどんなに平和で平穏な生活を送っていても数年に一度はスクレイピングってしたくなりますよね。「うわーまじか！API ないのかよ…。」的な。 そうしたら HTTP クライアントと HTML パーサのライブラリを探してきてインストールした上でごりごり書くことになると思います。でも実際に書いてみると、そうやってライブラリのインストールをしたりサンプルコードで動作確認している時間よりも、HTML を解析して実際にパースしたところから対象の要素を取得して欲しい値を取り出す試行錯誤の時間の方が長かったっていう事はないですか？ 今日ご紹介する Node.js でお手軽スクレイピングは、その辺の試行錯誤の手間を極力減らすことが出来る方法です。2020 年夏の最新版です。 まずは環境から。特に古いものを使う理由もないので 202
WebGL × 深層学習ライブラリ「jeeliz」でバーチャルYouTuberやAnimojiを再現 | Ledge.ai
すでに3,000人を突破し、大きな盛り上がりをみせている「バーチャルYouTuber」や、iPhone X話題の機能「Animoji（アニ文字）」はご存知ですよね。 自分の動きに合わせてキャラクターを動かせるバーチャルYouTuber、人の表情と連動する「Animoji（アニ文字）」は、深度センサーを搭載したデバイスや3次元モーショントラッキング、表情認識などによって実現されているんですが……。 これらの機能を組み込んだWebアプリケーションが簡単に作れたら、ちょっとワクワクしませんか？ そのハードル、WebGLとディープラーニングが越えようとしています。 「jeeliz」というJavaScriptライブラリを使えば、ブラウザだけで動くウェブアプリケーションとして実装できるかもしれないんです。 デモがあるので、さっそく紹介させてください。 深度センサー不要。ブラウザだけで顔検出、11種類の
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Will It Shuffle?
JavaScriptで背景色から文字色を導出する
仮想通貨をマイニングする機能なし、ただCPU使用量がもりもり上がるだけのJavaScript公開中【やじうまWatch】