SPAのアプリケーションで、外部のIdPを使ってOpenID Connect によるログイン機能を開発しようと考えています。IDトークンの保存先として、ブラウザのCookieかサーバーのDBに保存するかの2つの案があると思っています。調べた限り、サーバーサイドで持つべきという意見が多いように見えますが、以下のような背景がある中で開発しても、ブラウザのCookieでは持つべきなのではないのでしょうか？ - IDトークン自体にも、個人の属性（氏名等）情報は無いことを確認している - サーバーサイドでIDトーク
SPAのアプリケーションで、外部のIdPを使ってOpenID Connect によるログイン機能を開発しようと考えています。IDトークンの保存先として、ブラウザのCookieかサーバーのDBに保存するかの2つの案があると思っています。調べた限り、サーバーサイドで持つべきという意見が多いように見えますが、以下のような背景がある中で開発しても、ブラウザのCookieでは持つべきなのではないのでしょうか？ - IDトークン自体にも、個人の属性（氏名等）情報は無いことを確認している - サーバーサイドでIDトークンの署名検証をして、IDトークンの改ざんが無いか確認する - Http Only属性：JSによるCookieへのアクセスを防ぐため - Secure属性：流出防止のため - SameSite=strict：CSRF対策のため 結論から言えば、「どちらでもよい」となります。しかし、恐らく話は
Firebaseの存在をフロントエンドから隠蔽するために
「Firebase は安いし楽だしマジ最高」という一心で技術選定してしまったプロダクトが成功して見えてきた課題、割高なコスト・権限管理・カスタマイズ性、そして （特性やスキルセット的に）RDB 製品が適していたのに無理やり Firestore を採用したことによるデータ不整合。 その結果チーム内で Firebase を抜ける機運が高まるも、Firebase べっとりなアプリケーションすぎて移行しづらいといった問題に出会うかもしれません。 そのような場合に備え、Firebase の存在を隠蔽して開発することに挑戦してみましょう。 注意: Firebase を剥がしているときに「俺、次は絶対そうするわ」と感じたものを書いているだけであり、まだ実際にはこのパターンでプロダクション導入していません。 あくまで個人開発で試してみていけそうと思ったので、提案しますという体です。 また Firebase
見積明細フォームを支える技術
見積明細フォームを支える技術 November 18, 2019 · 8 min read A1Aのhimanoaです。今回は「見積明細を支える技術」ということで、RFQクラウドにおいてテナント毎に異なる見積明細の仕様をどうやって一つの実装と形式で運用しているのかを作り直しの歴史を添えて解説したいと思います。 テナント毎に違う見積明細とは テナント毎に違う見積明細とはどういうことでしょうか？この疑問は RFQクラウドのFAQサイトに書いてあります。以下はその引用です。 Q. 見積フォーマットの設定は自由にできるのでしょうか？ A. 見積フォーマットの保持上限はありません。 また、カスタマイズは無償で行っていただくことが可能です。 ※トライアル時点でいくつかフォーマットを試していただき、使用感を確認いただくことも可能です。 カスタマイズを無償で行える必要があり、そのために開発工数がかかるので
HTML5のLocal Storageを使ってはいけない（翻訳）｜TechRacho by BPS株式会社
概要 原著者の許諾を得て翻訳・公開いたします。 英語記事: Randall Degges - Please Stop Using Local Storage 原文公開日: 2018/01/26 著者: Randall Degges 日本語タイトルは内容に即したものにしました。 画像は元記事からの引用です。 初版公開: 2019/10/19 追記更新: 2024/04/05 -- リンク情報を記事末尾に移動しました 本気で申し上げます。local storageを使わないでください。 local storageにセッション情報を保存する開発者がこれほど多い理由について、私にはさっぱり見当がつきません。しかしどんな理由であれ、その手法は地上から消えてなくなってもらう必要がありますが、明らかに手に負えなくなりつつあります。 私は毎日のように、重要なユーザー情報をlocal storageに保存す
3Dアバターモデルを簡単にWebアプリケーション上で扱える 開発者向けライブラリ「pixiv three-vrm」をオープンソース化 ~3Dアバタープラットフォーム「VRoid Hub」で活用された技術を公開~ - ピクシブ株式会社
ピクシブ株式会社（本社：東京都渋谷区、代表取締役：國枝信吾、以下ピクシブ）は、3Dアバターモデルを用いたWebアプリケーションの開発をより簡単にするWeb開発者向けライブラリ「pixiv three-vrm」を、2019年9月12日（木）よりオープンソースとして公開します。 pixiv three-vrm: https://github.com/pixiv/three-vrm/ 「pixiv three-vrm」は、人型3Dアバターモデルのデータを扱うためのフォーマットである「VRM」を読み込み、Webブラウザに表示するためのライブラリです。 three-vrmが使用されている「VRoid Hub」(https://hub.vroid.com/) pixiv three-vrmは、3Dアバターモデルを扱うための専門的な技術知識を持たないWeb開発者が、VRMで記述されたモデルデータをより簡
オープンソースのWebアプリケーション分析ツール「Cube.js」
「Cube.js」は、npmやyarnでインストールできるオープンソースのWebアプリケーション用分析ツールです。RDBだけでなく、AWS AthenaやGoogle BigQueryなどのサーバーレスクエリエンジンと連携するように設計されています。機能が非常に豊富なので、今回は初期セットアップに的を絞ってご紹介します。 ◆ オープンソースのWebアプリケーション分析ツール「Cube.js」 https://cube.dev/ 紹介 「Cube.js」は、GUIも完備した高機能なWebアプリケーション分析ツールです。 インストール $ npm install -g cubejs-cli # or $ yarn global add cubejs-cli npmまたはyarnでインストールします。 $ cubejs create <プロジェクト名> -d <データベースタイプ> （データベー
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.
新しいフレームワークを学ぶならTodoMVCではなくRealWorldを参考にしよう - Runner in the High
よく新しいフレームワークを学ぶにはTodoアプリを作ってみるのがよい、と言われる。実際、Todoアプリを様々なフレームワークで作ってみたサンプルをまとめたサイトもあったりする。 ところが、実際に業務で作るようなアプリケーションはTodoアプリの範疇を超えている。とくにSPAにもなると、画面遷移やWebAPI連携、大規模な状態管理などなどの条件が増えるので、Todoアプリを作っているときには考慮できていなかった大変さが出てくる。 そこで参考になるのが RealWorld example apps と呼ばれるプロジェクト 端的に言うと、TodoMVCの大規模版。 規定のスペックに沿って、様々なウェブフレームワークで作られたアプリケーションのリポジトリがリストアップされている。 スペックについて "Conduit" is a social blogging site (i.e. a Medium
GitLabを用いた継続的インテグレーション
連載5回目となる今回は、GitLab CIを用いた継続的インテグレーション（CI）について解説します。 前回（RancherとCI/CD）は、 そもそも継続的インテグレーション（CI）、継続的デプロイ・デリバリ（CD）とは何なのかという説明と、CI/CDを実現するためのツールとしてRancher PipelineとGitLab CI/CDを紹介しました。今回は一旦Rancherから離れ、GitLab CIを用いた継続的インテグレーションの実現方法について解説します。 最初にサンプルサプリケーションの構成について解説した後、今回利用するGitLab.comのアカウントおよび、プロジェクトの作成について説明します。その上でサンプルアプリケーションの実装とテストを解説した後、Dockerイメージの自動ビルドと自動テストをGitLabを活用して実現する方法を説明します。 サンプルアプリケーションの
ZOZO大忘年会でFirebaseを使った1,000人規模のリアルタイムアンケートを費用2円で制作した話 - Qiita
この記事はZOZOテクノロジーズ TECH BLOGにも同じ内容で投稿しています。よろしければ他の記事もご覧ください。 こんにちは！ ZOZOテクノロジーズ フロントエンドエンジニアの高橋（ニックネームはQ）です（@anaheim0894） 昨年12/26、毎年年末に行われる大忘年会（ZOZOCAMP2018）で、グループ会社も含めた1,000人規模でのリアルタイムアンケートを、FirebaseとVue.jsを使って制作しました。 当日会場にて弊社の昨年の事業紹介や、「楽しく働く」というコンセプトの動画を流し、動画の合間で質問をし動画と一体となるような演出を行いました。 その質問に対して全社員それぞれのスマートフォンで回答できるシステムを作ったので、その制作の裏側や、当日の様子などご紹介させていただきます。 まずは当日の様子の紹介 これを実現するまでの様子をご紹介いたします。 CAMP運営
carlo + parcelでお手軽デスクトップアプリケーション - Qiita
ウェブ技術でデスクトップアプリを開発するとなると、一番メジャーなのはやはりelectron/electronでしょう。ところがElectronは割と面倒です。配布ファイルのサイズ、セキュリティなど。 それとバンドラとして有名なWebpackですが、こっちも仰々しいです。 そこで今回はライトウェイトでゼロコンフィグな、carloとparcelの組み合わせについて書きます。 GoogleChromeLabs/carloは先日登場したばかりの headful Node app framework です。headlessならぬheadfulです。 中身はぶっちゃけると puppeteer-core の薄いラッパーです。 普通のPuppeteerはオープンソースのChromiumをダウンロードしてきて動作しますが、puppeteer-coreは既にローカルにインストールされているChromeなどを対
サーバーレスアーキテクチャのパターン別ユースケース - yoshidashingo
セクションナイン の 吉田真吾（@yoshidashingo）です。 昨今のサーバーレスアーキテクチャの実装パターンについて5つの分野でユースケースをまとめました。 実装方法はAWSがベースですが、クラウド各社のFaaSに大きな機能差はないので(そもそもシンプルなコンセプトなので)、FaaS単体よりも、連携可能な周辺サービスまで含めて自分のアプリケーションのユースケースに合っているかどうかが大事になってきます。また、そもそもいくつかの実装はPaaSのオプション機能として組み込まれている場合もあります。よって、この先連携先の機能強化などによってもっと多くのパターンが発見されることになると考えています。 【1】Webアプリケーション シングルページアプリケーション ex. Serverless Single Page Apps Web API REST API GraphQL 非同期Webジョ
Excel方眼紙（ほうがんし）からWebアプリを生成する「Forguncy」（フォーガンシー）、グレープシティが発表。現場の担当者が業務アプリを作る、というトレンドは来るか？
Excel方眼紙（ほうがんし）からWebアプリを生成する「Forguncy」（フォーガンシー）、グレープシティが発表。現場の担当者が業務アプリを作る、というトレンドは来るか？ Excelのセルを方眼紙のように使ってレイアウトされた画面をWebアプリケーションのフォームに変換することで、プログラミングをしなくとも業務アプリケーションが生成できる「Forguncy」（フォーガンシー）をグレープシティが発表しました。 国内の企業の多くで、帳票のレイアウトをExcel上で緻密に行った結果、まるで方眼紙のように細かいセルの上に結合や罫線のテクニックを駆使して作られたワークシートできあがってしまうことがあります。それらは揶揄の意味も込めて「Excel方眼紙」と呼ばれることがあります。 あとは入力フィールドとデータベースのフィールドを対応づければ、Webブラウザから入力でき、集計などが行える業務アプリケ
美しいプログラムを書く(業務用Webアプリケーション保守編) | Webシステム開発／教育ソリューションのタイムインターメディア
あらすじ あなたはとある業務用 Web アプリケーションの開発・保守を任されています。 このアプリケーションは ASP.NET を用いて作成されており、 クライアントサイドは一部 jQuery を利用してナウなヤングにバカウケの UI を実装しています。 さて、今回は 商品情報の変更履歴を一覧表示する。一覧から2つのバージョンを選んで差分を表示できるようにする。 という機能を実装することになりました。 これ自体はちゃちゃっと実装し、以下のようなHTMLが生成されるようにしました: ... <table> <tr> <th>A</th> <th>B</th> <th>変更日時</th> <th>変更者</th> </tr> <tr> <td><input type="radio" name="new_version" value="9"/></td> <td></td> <td>2012-0
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
system-design-primer/README-ja.md at master · donnemartin/system-design-primer
HTML5でiPhone/Androidアプリケーションを作ろう！