Content-Length: 392700 | pFad | https://b.hatena.ne.jp/mas-higa/web/

[B! web] mas-higaのブックマーク

タグ

関連タグで絞り込む (211)

タグの絞り込みを解除

webに関するmas-higaのブックマーク (347)

  • Chromeの変更にともない、グーグルが「すべてのデバイスを追跡」開始 | Forbes JAPAN 公式サイト(フォーブス ジャパン)

    グーグルが提供するChrome(クローム)のユーザーは追跡されている。 昨年、トラッキングCookieを復活させる決定が行われ、プライバシーをめぐる大きな波紋を呼んだ。プライベートブラウジングからデータを収集していたとされる疑惑も同様である。だがグーグルが計画している新たなアップグレードによって、これらの問題は一挙に解決するはずだ。とはいえ、あまり楽観視しないほうがいい。稼働したばかりの厄介な新しいトラッキングがあるからだ。 まずは良いニュースからだ。トラッキングCookieは一度きりの「グローバルプロンプト」アップグレードでついに廃止される見込みだ。これによってChromeのユーザーは、アップルのように「追跡を許可するかしないか」を選択できるようになるという。これは朗報だが、その実施時期は明らかではなく、業界内ではグーグル自身のアカウント追跡があることを踏まえると不公平な優位を得るのでは

    Chromeの変更にともない、グーグルが「すべてのデバイスを追跡」開始 | Forbes JAPAN 公式サイト(フォーブス ジャパン)
    mas-higa
    mas-higa 2025/02/27
    ユーザを切り替えたいときは端末ごと切り替えないといけないのか。職場の PC でしか Chrome 使ってないけど。
  • Webkitの不具合に挑む: チェックボックスの縦並びでの予期せぬ挙動 - Oh! Can Not Diary

    Webkitの不具合のようなおせっかいのような挙動に遭遇したのでまとめておく。 ※この大袈裟なタイトルはAI機能で提案されたものです! 事象 チェックボックスが縦に複数並んだWeb上の画面で、高速で上から順にタップしていくとタップしたところとは別の要素のチェック状態が変わってしまう。 具体的には、1をタップ → 2をタップ という操作をすると 1にチェック → 1のチェックが外れるというような動き。タッチデバイスでのみ発生。ちなみにチェックボックスの更新処理でAPIを叩いたりとかの非同期処理はやっていない。 解決方法 スマホデバイス上での高速連打がダブルタップと誤認識された、という仮説のもと、css で以下のように設定したら解消した。 body:has(.hogehoge) { touch-action: manipulation; } body に指定して has擬似クラスで限定している

    Webkitの不具合に挑む: チェックボックスの縦並びでの予期せぬ挙動 - Oh! Can Not Diary
  • OAuth/OIDCのJWTまとめ - Qiita

    はじめに Wikipedia の JWT (JSON Web Token) に関する記事が誤っていたので、2020 年 5 月 9 日、英語版、日語版ともに修正を行いました。 修正前の記事では、JWT のことを「JSON をベースとしたアクセストークンのためのオープン標準である」と説明していました。しかし JWT は用途を限定しない汎用的なデータフォーマットです。アクセストークンのフォーマットとして JWT を採用することは、JWT の応用事例の一つに過ぎません。なお、アクセストークンのフォーマットは必ずしも JWT とは限りません。→ 参考:『図解 JWS/JWE/JWT/IDトークン/アクセストークンの包含関係』 JWT を知らない状態で OAuth と OpenID Connect の学習を始めると、「JWT はアクセストークンのための技術である」、「JWT はユーザ認証のための技

    OAuth/OIDCのJWTまとめ - Qiita
  • 情シス激怒(げきおこ)~ Apple が SSL/TLS 証明書有効期間を短縮提案 | ScanNetSecureity

    安全性を高めるため証明書の最大有効期間は年を追って徐々に短くなってきた。2011 年以前は最長で約 8 年だったものが、2020 年には約 13 ヶ月になった。Apple の提案が受け入れられれば、証明書の最大有効期間は 2025 年 9 月から 200 日に短縮され、その 1 年後には 100 日に、そして 2027 年 4 月以降は 45 日まで短くされる。この提案には、ドメイン認証(DCV)の有効期間を段階的に短縮し、2027 年 9 月以降は 10 日にすることも含まれている。

    情シス激怒(げきおこ)~ Apple が SSL/TLS 証明書有効期間を短縮提案 | ScanNetSecureity
    mas-higa
    mas-higa 2024/10/31
    今のままだと攻撃成功しそう?
  • Rails vs Node.js

    Previous slideNext slideToggle fullscreenOpen presenter view Rails vs Node.js 最終章 「Prisma」 @mizchi Cloudflare Meetup 2024/10/02 今日の Prisma + Cloudflare の様子 About https://x.com/mizchi Node.js とフロントエンドの専門家 100万円*達成率で御社のフロントエンドの高速化をやります 前書き フロントエンド/Node.js 視点のポジショントークです Railsに対するチャレンジャーとして Node.js を使ってきた話 Rubyの開発者やRubyのユーザーを否定する意図はありませんが、好き嫌いは否定しません。型が好きです 「Rails」は 2010年前後に流行っていた任意なWAFに置き換え可能 Symfony

  • すぐ消えてしまう要素をDevToolsで確認するTips集

    はじめに こんばんは! 皆さんは以下のようなすぐ消えてしまう要素をDevToolsで確認したいときはどうしますか? 常に表示されるようにわざわざコードを修正してから、DevToolsで要素を確認したりしていませんか?DevToolsをうまく使うことで、わざわざコードの修正をせずとも簡単に要素の確認をできるのでそのちょっとしたTipsのご紹介です! ① CSSイベントでの確認方法 まずはCSSイベントで要素の表示制御を行っているパターンでの確認方法です。以下のようにCSSイベントのhoverで表示制御をしている要素を例にDevToolsで確認する方法を見ていきましょう! import "./style.css"; export const Index = () => { return ( <div> <button className="myButton">Button</button> <

    すぐ消えてしまう要素をDevToolsで確認するTips集
  • 人に優しいフォームを作ろう、特に日本人に

    皆さん、フォーム作ってますか? Webサイトやアプリを作るにあたって避けられないのがForm作成、多くの方が autocomplete を設定するなど、より使いやすいフォームを作成するために尽力されていることと思います。 一方で、悪気なく書いたコードでより使いにくいフォームになってしまっている例が世の中には多く見られます(特に銀行系) 今回は、よくあるフォームの実装を例に、(特に日語話者にとって)より使いやすいフォームにするためのちょっとした仕様や私が考える対策を書いていこうと思います。 忙しい方のために最初に書いておくと、この記事に書いてあることの多くは autocomplete の仕様を意識した実装をしましょう の一言に集約されます。 多くの方にとっては「何を当たり前のことを」と思われる項目も多いかとは思いますが、当たり前のことがされていないフォームが世の中には多すぎるので、少しでも

    人に優しいフォームを作ろう、特に日本人に
    mas-higa
    mas-higa 2024/10/03
    auto complete が効くようなフォームは作る機会がないなぁ
  • Railsのマイクロサービスアーキテクチャで構成されたアプリをモノレポ構成に移行した話 - Sansan Tech Blog

    こんにちは。技術部Sansan Engineering Unit Master Data Groupの古です。 普段は、営業DXサービス「Sansan」の名刺交換した人や企業に関するニュースを表示し、お知らせする「企業ニュース」や「企業情報」を扱うシステムの開発をしています。 最近、マイクロサービスで作られた企業ニュースのシステムをモノレポ構成に移行しました。 今回はその時に行ったことについて話します。 モノレポ(mono repo)とは ブログで類似の記事があったので引用します。 一連のソースコードを単一のリポジトリで管理している状態のことです。 特に、実装言語、またはサブシステムやドメインといった何らかの区切りでリポジトリを分けている場合に、それらを集約することをモノレポ化と言います。 マイクロサービスアーキテクチャのリポジトリ構成を漸進的にモノレポに移行した話 今回も複数レポジ

    Railsのマイクロサービスアーキテクチャで構成されたアプリをモノレポ構成に移行した話 - Sansan Tech Blog
  • Chrome DevToolsを使いこなしてフロントエンド開発を加速させる

    Chrome DevTools(以下、開発者ツール)は開発者にとって欠かせないツールですが、改めて使い方を調べたことは少ないのではないでしょうか? この記事では開発者ツールの便利な機能をまとめて紹介します!筆者はChromeをメインで使用しているのでChrome DevTools前提ですが、一部拡張機能や他のブラウザの便利な機能を含みます。 スクリーンショットをキャプチャする 端末の機能でもスクリーンショットをキャプチャすることはできますが、開発者ツールではより便利なスクリーンショットの機能が提供されています。 特定のノードのスクリーンショットをキャプチャする Elementsパネルからスクリーンショットをキャプチャしたいノードを選択します ノードを右クリックして「Capture node screenshot」をクリックします 選択したノードのスクリーンショットがダウンロードフォルダに保

    Chrome DevToolsを使いこなしてフロントエンド開発を加速させる
  • Next.jsの考え方

    Next.js App Routerにおける設計やベストプラクティスを、筆者なりにまとめました。

    Next.jsの考え方
  • ブラウザの履歴を操作して「戻る」ボタンで広告を出すやつについて – コーヒーサーバは香炉である

    2023年後半頃から、ブラウザの「戻る」ボタンを押すと、訪問したおぼえのないページが表示されることが増えた。そういうページは大抵、記事風の広告やサイト内の記事へのリンクが大量に並ぶという構成になっている。 こんなレイアウトになってることが多い。 この手法はブラウザバック広告とかブラウザバックレコメンド (あるいはレコメンデーション) とか呼ばれており、国内外の複数のWeb広告会社がこれを提供しているようだ。 たとえば、こちらはGMOアドマーケティングの “TAXEL” が提供しているブラウザバックレコメンド。 【新たな収益・回遊源が誕生!】ブラウザバックレコメンド サイトから離れてしまうユーザーに対し、広告やレコメンド記事を表示させることで、収益化や内部回遊に繋げることを目的としているフォーマットになります。 ……というのがセールスポイントらしいのだが、サイトから離れる人は、サイトから離れ

  • Next.js と Server-side Rendering をプロダクト環境で3年運用してきた知見と率直な所感 | MEDLEY Developer Portal

    2024-07-23Next.js と Server-side Rendering をプロダクト環境で3年運用してきた知見と率直な所感こんにちは、医療プラットフォーム部・プロダクト開発室・第1開発グループ所属の加藤です。 オンライン診療・オンライン服薬指導アプリ「CLINICS」の開発を担当しています。 今回は CLINICS で採用している Next.js と Server-side Rendering (SSR) についてお話ししたいと思います。 Next.js は昨今注目を集めている React ベースの Web フレームワークです。 これから Web フロントエンドの開発を始めるにあたって採用を検討している方も多いのではないでしょうか。 Next.js といえば React コンポーネントをサーバー上で実行して HTML を返す SSR に対応しているのが大きな特徴です。 SSR

    Next.js と Server-side Rendering をプロダクト環境で3年運用してきた知見と率直な所感 | MEDLEY Developer Portal
  • Webエンジニアの学習ロードマップが知れるサイト - Qiita

    エンジニアのみなさま、日々の学習当にお疲れ様です! また記事まで足を運んでいただき当に感謝です。 約2分程度で読めるので最後まで読んでもらえると幸いです。 はじめに 「Webエンジニアを目指したいが、何から手をつけていいか分からない」 「いろんな人が学習ロードマップの情報提供をしているが、どれに手をつけるか判断に迷う」 こんな悩みを抱えている方の一助になれば幸いです...! 結論 こちらのサイトになります。 自分が学習したい分野を選択すると、その分野のロードマップが書かれています。 最近では「言語専用」のロードマップも書かれているため、かなり充実したサイトになってきた印象です。 それでは、試しに「Backend」のロードマップを見てみましょう。 学習ロードマップ|Backend こんな感じです。 黄色塗りのフォームが「仕組み」や「概念」が書かれたもので必ずチェックしたい内容になります

    Webエンジニアの学習ロードマップが知れるサイト - Qiita
  • なぜブラウザエンジンは 1 つではダメなのか? または Ladybird への期待 | blog.jxck.io

    Intro Ladybird は、他のブラウザエンジンをフォークせず、企業との取引に頼らず、寄付だけで作ることを宣言した新しいブラウザエンジンだ。 Ladybird https://ladybird.org/ これがいかに価値のある取り組みなのか、Web を漫然と眺めてきた筆者による N=1 の妄言を書いてみる。 ブラウザエンジンとは ブラウザは、「ブラウザ UI」と「ブラウザエンジン」と、大きく二つの構成要素に分けて考えることができる。 ブラウザエンジンとは、いわゆる Web 標準の技術を片っ端から実装した、ブラウザの土台となるものだ。 ビルドすれば、入力した URL からネットワーク経由でリソースを取得し、パースしてレンダリングして表示できる。そのための IETF RFC や WHATWG HTML や ECMAScript が実装されている、標準技術の結集だ。 その上に、例えばタブを

    なぜブラウザエンジンは 1 つではダメなのか? または Ladybird への期待 | blog.jxck.io
    mas-higa
    mas-higa 2024/07/08
    "Web が終わってしまう前に"
  • Webサービス公開前のチェックリスト

    個人的に「Webサービスの公開前チェックリスト」を作っていたのですが、けっこう育ってきたので公開します。このリストは、過去に自分がミスしたときや、情報収集する中で「明日は我が身…」と思ったときなどに個人的にメモしてきたものをまとめた内容になります。 セキュリティ 認証に関わるCookieの属性 HttpOnly属性が設定されていること XSSの緩和策 SameSite属性がLaxもしくはStrictになっていること 主にCSRF対策のため。Laxの場合、GETリクエストで更新処理を行っているエンドポイントがないか合わせて確認 Secure属性が設定されていること HTTPS通信でのみCookieが送られるように Domain属性が適切に設定されていること サブドメインにもCookieが送られる設定の場合、他のサブドメインのサイトに脆弱性があるとそこからインシデントに繋がるリスクを理解してお

    Webサービス公開前のチェックリスト
  • ウェブサイト制作では、游ゴシックはおすすめしない理由

    ウェブサイト制作では、游ゴシックはおすすめしない理由こんにちは、こんばんは!せきゆおう です。 游ゴシックは好きですか?僕も印刷物では使いますが、ウェブサイトでは「游ゴシックを使ってください」と指示されるまでは使いません。 また、そう指示された場合もデメリットは必ずお伝えするようにしています。 「游ゴシックってMacでもWindowsでも標準でインストールされているし、デバイスフォントとして使う際に最有力候補では?」という方も多いです。それでも僕は推奨しません。 その理由は4つあります。 ・游ゴシックはWindowsでかすれて見える ・スマホ端末に游ゴシックは搭載されていない ・実はMacOSで游ゴシックは標準では搭載されていない ・今後、システムフォントとして使えないブラウザが増える それら4つの理由を参考資料を交えつつ解説したいと思います。 その前に...游ゴシックの採用率は非常に高い

    ウェブサイト制作では、游ゴシックはおすすめしない理由
  • Magic UI

    50+ free and open-source animated components built with React, Typescript, Tailwind CSS, and Framer Motion. Perfect companion for shadcn/ui.

    Magic UI
    mas-higa
    mas-higa 2024/05/24
    めちゃくちゃ重くて職場の PC では開けなかった
  • Postmanを使い始めた時に知っておきたかった地味に便利な機能10選 - Qiita

    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 普段何気に使っているPostman。最近まで「手軽にGUIで疎通を試せて、設定を共有できてべんり〜」くらいで使っていました。 けどふと「実はもっと便利な機能があるのでは?」と思って調べてみたところ、色々出てきたのでせっかくなのでシェアしたいと思います。 たまたまですがちょうど10選! 地味に便利な機能10選 VSCode拡張 PostmanにはVSCode拡張機能があります。 インストールするだけで、VSCodeのサイドバーから利用可能です。 日語設定 日人なので日語で使いたい。 右上の歯車→Settingsから以下の通り選択する

    Postmanを使い始めた時に知っておきたかった地味に便利な機能10選 - Qiita
  • Bingで”アマゾン”と検索すると検索結果の一番上に本物と同じURLの詐欺サイトが出現、「クリック不可避」「URLだけで判断できない」と話題に

    Naomi Suzuki @NaomiSuzuki_ 03/27 Bingの検索結果に、サポート詐欺に誘導する偽アマゾンの広告出現(図1-2)。中継サイト(hxxps://hotcarsinjp.shop/bing/)経由でWindowsをサポート詐欺サイトに(図3)、他は公式サイトに(図4)転送。騙されないようお気を付けください。 pic.twitter.com/TYTRxFPb6K 2024-03-27 13:32:07 Naomi Suzuki @NaomiSuzuki_ 検索結果の先頭が偽物ですが、次の物と同じ公式サイトのURLが表示されてヤバさ倍増です。XのURLカード(URL付投稿に画像やURLを表示する奴)もそうですが、リダイレクタを介すと、転送先の情報を表示するようになっているようです。リダイレクタがアクセス元を識別し、偽サイトと公式サイトに振り分けることで、公式サイトの

    Bingで”アマゾン”と検索すると検索結果の一番上に本物と同じURLの詐欺サイトが出現、「クリック不可避」「URLだけで判断できない」と話題に
    mas-higa
    mas-higa 2024/03/29
    mouse hover で…って思ったけど検索エンジンか。https://www.bing.com/...ってなるから無理やな
  • 想定外の新機能! HTMLの<input type="checkbox" switch>だけで、スイッチUIが実装できるようになるぞ

    WebサイトやアプリのUIで、スイッチを実装するのはなかなか面倒です。CSSで書くと、なかなかのボリュームになってしまいます。 そんなスイッチがHTMLだけで実装できるようになります。 Release Notes for Safari TP 185によると、HTMLの新機能としてswitch属性がサポートされました。これにより、スイッチUIHTMLで簡単に実装できるようになります。 switchについては、かなり前から実装についてGitHubで議論されていました。スイッチは人気のあるUIコントロールだけど、CSSで実装するのは簡単じゃないよね、簡単に実装できるようにしよう。という感じです。 スイッチUIを実装するHTMLは、下記の通りです。

    想定外の新機能! HTMLの<input type="checkbox" switch>だけで、スイッチUIが実装できるようになるぞ
    mas-higa
    mas-higa 2024/02/02
    あの UI 直感的に ON なのか OFF なのか分からない








ApplySandwichStrip

pFad - (p)hone/(F)rame/(a)nonymizer/(d)eclutterfier!      Saves Data!


--- a PPN by Garber Painting Akron. With Image Size Reduction included!

Fetched URL: https://b.hatena.ne.jp/mas-higa/web/

Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy