URL Pattern API - Web APIs | MDN
The URL Pattern API defines a syntax that is used to create URL pattern matchers. These patterns can be matched against URLs or individual URL components. Concepts and usage Patterns are specified using the URLPattern interface. The pattern syntax is based on the syntax from the path-to-regexp library. Patterns can contain: Literal strings which will be matched exactly. Wildcards (/posts/*) that m
Navigation API による「JS での画面遷移」と SPA の改善 | blog.jxck.io
Intro 従来の History API を改善する Navigation API の仕様策定と実装が進んでいる。 これは、History API の使いにくかった部分を補うだけではなく、「JS で画面遷移をする」という現状のミッシングピースに取り組み、SPA が抱える多くの問題だけでなく MPA すら改善する可能性がある。 この API の目的と仕様を解説しつつ、実装のメモを残す。 画面遷移と SPA の軌跡 Web は HTML の取得と描画を繰り返す、画面遷移(Navigation)を前提としたアーキテクチャ(のちに SPA からの逆算で MPA と呼ばれる)が基本であり、ブラウザなどの実装もそれに最適化されている。 一方「アプリケーション」の設計手法をそのまま Web に持ち込んだ SPA は、この Navigation によってもたらされる UX の低下を防ぐ部分がある一方、既
【OpenAPI】APIスキーマから勝手に型がつくaxiosを作って幸せになる【openapi-typescript】
はじめに axiosの型付けはどうやらそれなりに頭を悩ませる課題のようです。 実際にuhyo氏のTwitterでのTypeScriptコミュニティにて以下のような質問がありました。 私もaxiosの型付けに悩まされた一人です。 最近それなりに幸せに型付けできる方法が整理できたので、自身の備忘録も兼ねてまとめます。 前提として、openapiファイルが用意されていることとします。 コード例は下記レポジトリに配置しております。 幸せになるとは何か 結論から言うと次のような型の補完が効き、かつ型安全なaxiosのrequest APIのカスタムAPIを作る事です。 URLパスの補完が効いていて、 実装されているHTTPメソッドの補完も効いており、 パラメータの型も補完され、 レスポンスの型も手に入るrequest APIです。 見た目上は、request APIですので、axiosのドキュメント
Compute@Edge は GraphQL Server の夢を見るか — HACK The Nikkei
この記事はNikkei Advent Calendar 2021の 6 日目の記事です。 こんにちは、長期インターン生の林(Shinyaigeek)です。 fastly の提供する Compute@Edge という Edge Computing 基盤があります。 まだベータという形でですが、このランタイムで JavaScript の対応が始まったことをうけ、 Compute@Edge で何ができるのか、そのために何が必要なのか、というのを実際に Compute@Edge で Apollo Server を用いて GraphQL Server を建てることを通して考察します。 Compute@Edge とは 本題に入る前に Compute@Edge とはどのような技術なのか、何ができるのか、という説明から入りたいと思います。 Compute@Edge とは fastly が提供している Ed
APIキーもログインも不要！完全無料で使える天気予報API「Open-Meteo」を使ってみた！ -
どうも、まさとらん（@0310lan）です！ 今回は、誰でも無料で使える天気予報APIを提供してくれるWebサービスをご紹介します！ 面倒なユーザー登録やAPIキーの設定などが不要で、欲しい天気情報のパラメータを含めたURLを好きなように構成するだけで簡単にJavaScriptから制御できるのが特徴です。 日本はもちろん、世界中の詳細な天気情報を取得できるのでご興味ある方はぜひ参考にしてみてください！ 【 Open-Meteo 】 ■「Open-Meteo」の使い方 それでは、「Open-Meteo」をどのように使えばいいのか詳しく見ていきましょう！ 「Open-Meteo」が提供する天気予報APIを利用するにあたり、何か特別な登録や申請は必要ありません。もっと言えば、ユーザー登録も不要でAPIキーもありません。 非営利プロジェクトであれば誰でも自由に使うことが可能で、以下のエンドポイント
DesignOps推進の一環としてFigma上のコンポーネントを自動でnpmにpublishしてみる
DesignOpsとは DesignOpsとは質の高いデザインのアウトプットの維持を支えるための仕組みづくりのことです。 この仕組みを整えることでデザイナーもエンジニアもお互いストレスなくそれぞれの仕事に専念できます。 今回は、デザイナーがデザインツールのFigma上で作成したアイコンをReactコンポーネントに変換してnpmに定期的にpublishするところまでを自動化しました。この自動化により、わざわざFigmaにみに行って、デザインされたsvgを切り出しReactコンポーネントに変換して利用するという作業が不要になりました。Figama上でアイコンが更新されたら、新たにnpm installするだけでアイコンを取り込んで使うことができるようになります。 js側では、以下のような雰囲気でnpmからアイコンコンポーネントを利用可能です。 import { MenuClose } from
Python で緊急対応時の Slack 操作を自動化してみた | DevelopersIO
このブログはこんな方におすすめ 緊急対応の初動を早めたい リモートワーク中心になり、緊急対応中の作業分担や進捗確認が難しい Google Apps Script で緊急対応時の Slack 操作を自動化してみた の Python 版がほしい 2021年6月11日に以下のセッションに登壇しました。本ブログでは登壇中に紹介するとお伝えした関数をご紹介します。また背景についても改めて少し記載しています。 業界特化事例紹介セッション SIer編 | Slack はじめに クラスメソッドでは Slack API を活用することで、いくつかある緊急対応の初動が約30分早くなりました。 では、どのように活用して初動対応を迅速化したのでしょうか。 本ブログでは、クラスメソッドの緊急対応の一つである、AWS 不正利用対応を例に紹介します。 AWS 不正利用とは、AWS アクセスキーの漏洩などが原因で発生しま
自宅のTVをネット転送【PC,スマホ,Tab対応】|Slingbox 公式サイト
VPN BOXの運営チームは、海外での長期滞在やビジネス展開の実績を持つメンバーで構成されています。 チームメンバーは台湾、タイ、シンガポールといった国々を活動拠点とし、普段の仕事や日常生活の中でVPNサービスを実際に使用しています。 加えて、インドネシア、ベトナム、フィリピンをはじめとするアジア諸国への出張時にも、各地域のインターネット環境下でVPNがどれだけ安定して接続できるかを実地で検証しています。 検証概要 主な検証エリア：台湾・タイ・シンガポールを中心に、アジア各国で実施 使用デバイス：iPhone、iPad、Androidスマートフォン、パソコンなど 検証担当：VPN BOX運営チーム
Deno 1.9.0 がリリースされたので新機能や変更点の紹介
Copyright (c) 2018-2021 the Deno authors. MIT License. 日本時間の今日（2021 年 4 月 14 日）に Deno の v1.9.0 がリリースされました。 詳細なリリース内容は上記のリリースノートにまとまっていますが、ざっと紹介していきたいと思います。 ネイティブ HTTP/2 Webサーバー serde_v8 による Rust 呼び出しの高速化 Blob URLのサポート LSP で import の補完ができるようになった --allow-env と --allow-run で許可対象を指定できるようになった インタラクティブなパーミッションプロンプト Deno.listenTls で ALPN をサポート ファイルシステムに関するいくつかのAPIの安定化 いくつかのAPIを Deprecated 化 (std 配下に移動) T
サーバサイドレンダリングの導入から生じるSSRF | セキュリティブログ | 脆弱性診断（セキュリティ診断）のGMOサイバーセキュリティ byイエラエ
オフェンシブセキュリティ部の山崎です。サーバサイドレンダリング（SSR）の導入によってSSRFが発生する問題を見つける機会があったため、本記事では実例を交えながら紹介したいと思います。 サーバサイドレンダリング（SSR）とは？ 本記事で扱うSSRとは「サーバ上でHTMLを出力すること」を指しています。ただしerbやjspのようなテンプレートからHTMLを出力するのとは異なり、一般的には以下のようにクライアントサイドレンダリング（CSR）の文脈で使われることが主です。 近年のVue.jsやReactを代表するようなWebフロントエンドフレームワークはブラウザ上で動的にDOMツリーを構築して画面を描画（CSR）するのが主流となっています。これによってページ遷移を挟まずユーザ体験のよいシングルページアプリケーション（SPA）が作ることができるというメリットがあります。 ただ、単純なSPAにはデメ
SWR vs React Query - fsubal
#フロントエンド （※ この記事は API およびそこから導かれる設計のしやすさ観点での比較をしています。実際にキャッシュが有効に効いたか、などについてはまた別の機会に ） 動機 SPA の状態管理に必ずしも Redux いらないんじゃね問題 Redux が嬉しいのってクライアントサイドでモリモリ状態が変わる画面だけじゃん、みたいなアレ 検索結果の一覧みたいなページに Redux を使うの意味なかった 本当に必要なとこだけ使うようにしたい ほとんどのケースで欲しいのって React 向けの API クエリキャッシュ これまでは Redux の Store を単なるキャッシュとして使ってたが、違うよね 候補 ↑ みたいな話でよく上がるオルタナティブとして SWR と React Query がある これら 2 つを比較する。 TL;DR SWR の方が王道感を感じるけど、思ったより #rea
オンラインカンファレンス向け事前収録システムを作った #iosdc
9/19〜9/21にiOSDC Japan 2020を主催しました。今年の開催は初のオンライン開催で、レギュラートーク（20分・40分）はすべて事前収録とし、当日は編集済の動画を配信する方法を採りました。 このエントリではiOSDC Japan 2020のために構築した事前収録システムについてその構成やハマりどころを解説します。 TL;DR 2017年から開発・メンテナンスしているカンファレンス運営支援システムの fortee に収録 & 編集機能を実装しました。1 いくつかのサービスのAPIやWebhookを使って以下の様なことをしています。 収録予約 スタッフは fortee に「レコーディングスロット」を作る 2 3スピーカーは fortee で都合の良い時間のレコーディングスロットを予約する （①） 収録開始 レコーディングスロットの開始時刻になったら、fortee はZoomにミ
Blog｜URLの取り扱いには要注意！SSRFの攻撃と対策
SSRF （Server Side Request Forgery : サーバーサイド・リクエスト・フォージェリ）は、外部から到達できない領域にあるサーバーなどに対して、バグを悪用することでリクエストを送る攻撃手法・脆弱性です。 この一言だけではリスクの大きさや、この問題がなぜ発生するのかが想像しづらいと思います。そこで本記事では、SSRF が起きる原因を解説したあと、脆弱性の影響について攻撃シナリオをベースに説明していきます。 最後にそれらを踏まえた上で、どのようにして SSRF が発生しないコードを記載するか、またコードレビューの中で問題を見つけるのか等、対策についても触れていきます。 扱うリスクシナリオとしては「内部 API を悪用した侵入」および「クラウドベンダーが用意する管理用 API を悪用したクレデンシャルの奪取」となります。 SSRF の概要冒頭で SSRF とは「外部から
Github ActionsからSlackへ通知するのを良い感じにしたい | Spinners Inc.
この記事はpushをトリガーとしたGitHub Actionsのワークフローを前提として書いています。 概要GitHub Actions、簡単便利で良いですね！ ぼくも遅まきながら使いはじめ、先日、Git pushをトリガーにデプロイしてSlackで通知、とよくあるワークフローを追加して運用しはじめました。 Slackへの通知も Marketplace に数ある既存Actionを選んで利用すれば、すぐに実現できました。すごい！ ぼくはこんな感じにしたかったとはいえ、贅沢を言えば、ぼくは レガシーなCustom integrationsのIncoming Webhooksでなく、きちんと新しいIncoming Webhooksでやりたいref: https://api.slack.com/legacy/custom-integrations#incoming-webhooksAction独自
Integrate with the OS sharing UI with the Web Share API | Articles | web.dev
With the Web Share API, web apps are able to use the same system-provided share capabilities as platform-specific apps. The Web Share API makes it possible for web apps to share links, text, and files to other apps installed on the device in the same way as platform-specific apps. System-level share target picker with an installed PWA as an option. Capabilities and limitations Web share has the fo
無料で使える公開 API のリスト：48 カテゴリ - Qiita
A collective list of free APIs API Key の登録なし＋無料で株価情報が取れる API ないかなーと探していたら、面白いリストが見つかりました。48 カテゴリにわたり数百もの API がリストされています。545 contributors (2019/11/6 時点) によるまさに集合知（？）ですね。 Github: https://github.com/public-apis/public-apis A collective list of free APIs for use in software and web development. の説明通り、 Animals Anime Anti-Malware Art & Design Books など、どんなデータ？と思うようなカテゴリから、 Geocoding、Jobs、Music まで、全部見ることが
anypicks.jp - anypicks リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Lambdaで6MBを超えるデータをReturnできなかったので、S3のPre-Signed URLを使った話 | DevelopersIO
SEOワザ10選――いち早く新規ページをインデックス化し検索上位獲得するには【インデックス編】 | Moz - SEOとインバウンドマーケティングの実践情報 | Web担当者Forum
認証しないWeb認証 限定公開URLのセキュリティについて考える 公開版
