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.

2021/11/10 TECH STAND #6 TypeScriptにて発表した資料です。

前回のechoサンプルを少し改良しました。 前回はechoサンプルを動くようにしましたが、 今回はHTML側に切断処理を入れ、WebTransportのセッションが閉じられた時にQUICのイベントログを出力するようにしました。 今回はそのログも合わせてプロトコルを理解していきます。 ソースコードはこちら WebTransport? HTTP/3?? QUIC??? 何それおいしいの? WebTransportに何となくワクワクと闇の気配を感じている皆様こんにちは。 今回は前回のechoサンプルとドラフトを睨めっこしながらプロトコルについて理解していきたいと思います。 ここではChrome M97に実装されている WebTransport over HTTP/3について調べていきます。 どうしてWebTransportが必要なの? ブラウザで双方向通信がしたい けどWebSocketはTCP

こんにちは。プロダクトエンジニアの @sugamasao です。 SmartHRのプロダクトエンジニアは中途採用で経験者を採用していますが、必ずしもRuby/Rails経験者ばかりではありません。 今回はそういった方向けに binding.pry でデバッグする際の使い方をお伝えできればなあと筆を取っております。（昨今ではdebug.gemやbinding.irbでも代用できる気配を感じていますが、それはそれということで何卒） また、以下のコードはRuby 3.0.2とPry 0.14.1で動作確認をおこなっています。 binding.pryってなに ソースコード上に binding.pry と記載してからプログラムを実行すると、該当行で処理を中断し、ターミナルから直接プロセス内の状態をpryで参照、変更することができます。 binding.pryで止まると、こんな感じの内容がターミナルに

はじめに Git を使う場合、ブランチの作成とマージを頻繁に行うような運用が多いと思います。例えば、機能追加やバグ修正を行う場合には本流ブランチからトピックブランチを作成して、作業はトピックブランチにコミット、作業が終わったらトピックブランチを本流ブランチにマージ、といった運用です。 この場合、トピックブランチは細かい単位で作成して、作業が終わったらすぐマージする、というのが良いプラクティスであろうと思います。すぐマージすると、コンフリクトは起こらない場合が多いです。とはいえ、やはりコンフリクトが起こる場合はあります。 コンフリクトが起こる場合とは、feature/12345 ブランチを作成して作業して master ブランチにマージしようとしたところ、別の誰かによる変更が既に master ブランチに取り込まれており、しかもその変更箇所が feature/12345 ブランチでの変更箇所

最近，仕事で使うことがあってたまたま気がついたのだが， PlantUML って JSON や YAML のデータを視覚化できるんだね。 やり方は簡単。たとえば { "firstName": "John", "lastName": "Smith", "isAlive": true, "age": 28, "address": { "streetAddress": "21 2nd Street", "city": "New York", "state": "NY", "postalCode": "10021-3100" }, "phoneNumbers": [ { "type": "home", "number": "212 555-1234" }, { "type": "office", "number": "646 555-4567" } ], "children": [], "spous

Reactアプリケーションのアーキテクチャの一例として公開されているGitHubリポジトリ「bulletproof-react」が大変勉強になるので、私自身の見解を交えつつシェアします。 ※2022年11月追記 記事リリースから1年ほど経過して、新しく出てきた情報や考え方を盛り込んだ続編記事を書いていただいているので、こちらも併せて読んでいただければと想います（@t_keshiさんありがとうございます！）。 ディレクトリ構造が勉強になる まずはプロジェクトごとにバラつきがちなディレクトリ構造について。 ソースコードはsrc以下に入れる bulletproof-reactでは、Reactに関するソースコードはsrcディレクトリ以下に格納されています。逆に言えば、ルートディレクトリにcomponentsやutilsといったディレクトリはありません。 たとえばCreate Next Appで作成

DockerやKubernetesなどのコンテナ技術は多くのシステムで用いられていますが、初心者が概要を理解するのは難しいもの。そんなコンテナ技術の概要について、クラウドストレージサービスを運営するBackblazeが分かりやすくまとめています。 What Are Containers? https://www.backblaze.com/blog/what-are-containers/ ・目次 ◆コンテナとは何か？ ◆コンテナと仮想マシンの違いは？ ◆コンテナのメリットは？ ◆コンテナの用途は？ ◆Dockerとは何か？ ◆Kubernetesとは何か？ ◆コンテナとは何か？ 物流の世界における「コンテナ」は、形状やサイズを規格化し、異なるメーカーが製造した船舶・電車・トラックなどの移動手段や、世界中の港などの「異なる環境」でも同じように物を運んだり保管したりできるようにしたものです。

長い記事なので先に結論を書きます。 Spectre の登場で、ウェブサイトに必要とされるセキュリティ要件は増えました。具体的に必要な対策は下記の通りです。 すべてのリソースは Cross-Origin-Resource-Policy ヘッダーを使って cross-origin なドキュメントへの読み込みを制御する。 HTML ドキュメントには X-Frame-Options ヘッダーもしくは Content-Security-Policy (CSP) ヘッダーの frame-ancestors ディレクティブを追加して、cross-origin なページへの iframe による埋め込みを制御する。 HTML ドキュメントには Cross-Origin-Opener-Policy ヘッダーを追加して popup ウィンドウとして開かれた場合の cross-origin なページとのコミュニ

LINE TECHNICAL WRINTING MEETUP Vol.8 2021.10.14 https://line.connpass.com/event/226589/ 「ドキュメントを改善するためのはじめの一歩」 株式会社ソラコム テクニカルライター 矢崎 誠 イベントレポート https://blog.soracom.com/ja-jp/2021/10/25/technical_writing_tips_slack_glossary/

How to Create Impact in a Changing Tech Landscape [PerfNow 2023]

現在、TypeScriptの重要性は、フロントエンド開発を中心としてますます増すばかりであります。それだけに、TypeScriptをどのように使うべきかという問題については多様な意見が見られます。 これまで筆者はTypeScriptの使い方に、特にコンパイラオプションの使い方について意見を散発的に発信してきましたが、このたび記事にまとめました。この記事では、特に次のような意見に対しての反対意見を述べます。 厳しいコンパイラオプションは型パズル愛好者のためのものであり、普通の人は細かいことを気にせず緩い設定でよい。熟練のJavaScript使いにはTypeScriptは必要ない。例え話最近はTypeScriptを補助輪に例えたりするのが流行っていますので、この記事でも例え話をしてみます。筆者の考えでは、TypeScriptというのは例えるならば料理人が使う包丁のようなものです。コンパイラオプ

Kaigi on Rails 2021 #kaigionrails

対象読者と目的 非同期処理の実装方法は知っているが、仕組みを詳しく知らないのでベストプラクティスがわからないときがある 実行順序の保証がよくわからないので自信をもってデプロイできない変更がある より詳しい仕組みを理解することでより計画的な実装をできるようになりたい という動機で書かれた記事です。同様の課題を抱える人を対象読者として想定しています。 目次 実行モデルとタスクキュー Promise async/await AbortSignal, Event, Async Context WHATWG Streams / Node.js Streams (執筆中) 未定 中止処理 並行処理ではしばしば実行中の処理を中止したい場合があります。 古典的なキャンセル処理 Webブラウザ/Node.jsともに、 setTimeout の中止が可能です。 const timeout = setTimeo

本業はiOS開発なのですが、6月頃から個人開発でWebフロントを触っています。 Webフロントに入門するときに、開発の前提知識・専門用語が多すぎて、脳が処理しきれない状態になりました。 これでも数年前のより混沌としてた時期よりは安定してきているように思うんですが、それでもやはりカオス感は否めませんでした。 Webフロントエンド開発の見取り図があればいいのにと思ったので、自分でちょっとつくってみようと思いました。 個別の技術要素の情報は豊富にある（ありすぎると言ってもいいかもしれません）んですが、全体像がよくわからないので、 たとえば「TypeScriptで開発した方がいいのか？」とか、「Babelとかwebpackってインストールしなきゃいけないの？」とか、 そういう素朴な疑問が学習進めて行っても、なかなか解消できなかったので、いい感じのざっくり感でまとめられたらと思います。 この記事で全

AWSにおけるコンテナをホストする手段は、格段に進化を続けています。ECSからはじまり、EKS、Fargate、App Runner、Proton，Lambdaコンテナー。このセッションでは、それら手段を比較し、今あなたが、コンテナをAWS環境にホストするにあたり必要なものを選択するための羅針盤となる情報をお届けします。

こちらのスライドは以下のサイトにて閲覧いただけます。 https://www.docswell.com/s/ockeghem/ZM6VNK-phpconf2021-spa-security シングルページアプリケーション(SPA)において、セッションIDやトークンの格納場所はCookieあるいはlocalStorageのいずれが良いのかなど、セキュリティ上の課題がネット上で議論されていますが、残念ながら間違った前提に基づくものが多いようです。このトークでは、SPAのセキュリティを構成する基礎技術を説明した後、著名なフレームワークな状況とエンジニアの技術理解の現状を踏まえ、SPAセキュリティの現実的な方法について説明します。 動画はこちら https://www.youtube.com/watch?v=pc57hw6haXkRead less

こんにちは、 Leaner Technologies の石渡（@mishiwata1015）です。 最近、レヴィアスというボードゲームにハマっていて、子供が寝た後に妻と遊んでいます。 今回は、Leaner見積 におけるユビキタス言語を策定したので、その話をします。 ユビキタス言語とは ユビキタス言語は、開発者やドメインエキスパートを含むチーム全体の共通言語として定義され、チーム内の会話、ドキュメントやコードに至るまで統一的に使用される言葉になります。 DDD の文脈で登場するものですね。 ユビキタス言語によって同じ単語で同じ認識を得ることが可能となるため、チーム内のコミュニケーションが円滑になります。コミュニケーションミスを減らす効果もあります。 なぜユビキタス言語を策定しようと思ったか とにかく表記揺れを統一したい！ というモチベーションでユビキタス言語を策定しようと思いました。このとき

根本の問題意識 ソフトウェアの設計スキルはどのように獲得する（させる）ことが効果的であるのか ソフトウェアアーキテクチャの目的 そもそもソフトウェアアーキテクチャはどのような欲望を満たすための方法か ソフトウェアアーキテクチャの目的は、求められるシステムを構築・保守するための必要な人材を最小限に抑えること である。 (CLEAN ARCHITECTURE) 「求められるシステムを構築・保守するための必要な人材を最小限に抑えたい」 => 構築容易性 と 保守容易性 を確保したい 構築容易性 「構築しやすさ」とは？ ソフトウェアを構築するとはどういうことか ソフトウェアの2つの価値: 「振る舞い」と「構造」 振る舞い: 要件を満たすこと => いわゆる機能 構造: 振る舞いを簡単に変更できること => いわゆるアーキテクチャ 構築しやすさ=価値の生み出しやすさ 要件を満たしながら振る舞いを変更

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