リアルタイム通信用のコネクションをタブ間で共有してまとめる
これはなんらかのアドベントカレンダーの何日目かの記事だったりしません。 KOBA789 です。仕事では人工衛星の搭載ソフトウェアを書いたり、人工衛星の管制システムのソフトウェアを書いたりしています。 先日、こういうツイ……ポストをしたらちょっとバズりました。意外と興味持ってくれる人が多かったので、それに関連するオタク早口記事でも書くかぁと思って筆を執っています。 うちの人工衛星の開発ツールはウェブ技術でできている 前述のポストは管制システムについてですが、開発用ツール（C2A DevTools）もまた React + TypeScript でできています。 まぁ画面見てもなにがなんだかという感じだと思いますが、UNIX サーバーで top コマンド叩いたときの内容と、サーバーのログが合体したみたいなものが表示されていると思ってください。 これらの数値は gRPC-web の Server-
async/awaitにおけるエラー処理を実行の順番から整理する - Qiita
はじめに promiseを使うとき、いつもpromiseメソッドチェーンで記載していますか？ async/awaitを利用していますか？ もちろん状況によって両方書くのが殆どだとは思うのですが、私はasync/awaitの方が同期的な書き方ゆえに読みやすいため、なるべくそちらで記載しています。しかしながら、エラーハンドリングが理解できていなかったため、エラーの所在を突き止めるのに苦労してしまいました。 そのため、これを機にasync/awaitにおけるエラーハンドリングについて備忘録的にまとめておきます。 この記事のまとめ; catchされるエラーはrejectのみか、throwされたエラーも含まれるか →両方catchできる async関数における処理の順序、awaitがある場合とない場合 →awaitがない場合には同期的に処理が実行され、catchできなくなる エラー処理を外側に伝播し
SOLID原則を理解し、JavaScriptで実践するためのガイド - deve.K's Programming Primer - プログラミング初心者のための入門ブログ
ソフトウェア開発者にとって、堅牢でテスト可能で拡張性があり、保守性の高いオブジェクト指向のソフトウェアシステムを設計することは重要です。 そこで登場するのがSOLID原則です。 SOLIDは、ソフトウェア開発中に生じるかもしれない特定の問題を解決するために5つの設計原則が組み合わさったセットです。 この記事では、SOLID設計の原則について詳しく学んでいきます。 具体的には、SOLID原則が何を意味しているのか、各部分がそれぞれ何を表しているのか、また実際のプログラム例を挙げながら現役のプログラマーが説明します。 さらに、JavaScriptを使ってこれらの原則を実装する方法も紹介します。 SOLID設計原則とは？ 単一責任原則 (SRP) Open/Closed原則 リスコフ置換原理 (LSP) インターフェース分離原則 (ISP) 依存関係逆転の原則 最後に SOLID設計原則とは？
【入門】『スーパーマリオ』で学ぶ、JavaScriptの非同期処理
はじめに 今回の記事では、JavaScriptの学習における最大の鬼門の一つ「非同期処理」を、任天堂のゲーム『スーパーマリオ』を具体例に、初心者でもわかりやすく解説する。 対象とする読者 プログラミング初心者 非同期処理が全くわからない初心者 タイトルで気になったひと 同期処理と非同期処理 まずは、「同期」と「非同期」のそれぞれの定義や違いについて解説する。同期処理とは、コードを上から下まで順番に処理することを意味する。一方で、非同期処理はある処理が終わるのを待たずに、別の処理を実行することを意味する。 参考までに、「分かりそう」で「分からない」でも「わかった」気になれるIT用語辞典では、以下のように説明されている。 非同期(読：ヒドウキ 英：asynchronous)とは相手との足並みを揃えないこと。あるいは、相手の反応を待たないで、ひょいひょい行動すること。 同期は何かと何かを「同じに
初心者に分かりやすい！JavaScript 入門チートシート - コムテブログ
TL;DR このページでは、Jamstack を使った構築や、Next.js を使う上で必要となる JavaScript の基礎知識をまとめたものを初心者向けにチートシート形式でご紹介します。JavaScript の主要な特性や概念を分かりやすく網羅していますので、JavaScript の学び直しにもご活用できるかと思います。定期的に見返しましょう！ 項目 内容
AWS のサーバーレスと Amazon S3 署名付き URL、クライアントサイド JavaScript で大きなサイズの複数ファイルの一括アップロード・ダウンロード機能を実現する方法 | Amazon Web Services
Amazon Web Services ブログ AWS のサーバーレスと Amazon S3 署名付き URL、クライアントサイド JavaScript で大きなサイズの複数ファイルの一括アップロード・ダウンロード機能を実現する方法 はじめに 昨今のテクノロジーの進化は、これまで以上に、私たちがどのように働き、どのように生活するかを再定義しています。この進化の中心には、クラウドコンピューティングが存在しており、AWS はこれまで、クラウドコンピューティングのパイオニアとして、様々な機能を提供し続け、業界をリードしてきました。その機能群を支えるエコシステムの一部であるサーバーレスアーキテクチャは、スケーラブルで信頼性が高く、メンテナンスの作業負担が低いアプリケーションの開発を可能にし、ユーザーのビジネスやプロジェクトが円滑に進行するようサポートします。 AWS のサーバーレスの代表的なサービ
JavaScript Primer 改訂2版をリリースしました！/JavaScript Primerはなぜ更新され続けるのか？
JavaScript Primer 改訂2版をリリースしました！/JavaScript Primerはなぜ更新され続けるのか？ JavaScriptの入門書であるJavaScript Primer 改訂2版 迷わないための入門書がリリースされました。 書店やオンライン書店で購入できます。 KADOKAWA: 「JavaScript Primer 改訂2版 迷わないための入門書」azu [ＰＣ・理工科学書] - KADOKAWA Amazon: JavaScript Primer 改訂2版 迷わないための入門書 | azu, Suguru Inatomi |本 | 通販 | Amazon 楽天: 楽天ブックス: JavaScript Primer 改訂2版 迷わないための入門書 - azu - 9784048931106 : 本 ヨドバシ: ヨドバシ.com - JavaScript Pri
ECMAScriptの浮動小数点数の丸め仕様がスゴい - hnwの日記
ECMAScriptの浮動小数点数の丸め関数である Number.prototype.toFixed() について調べてみたところ、浮動小数点数をわかっている人が作った硬派な仕様だと感じたので、解説してみます。 浮動小数点数の丸めの善し悪しについて 私はプログラミング言語の浮動小数点数の丸め処理に興味があり、過去に関連記事を30本以上書いています。こうした活動から得られた知見として、良い丸め関数には次のような性質があると考えています。 仕様がシンプルで直感的であること 仕様が抜け漏れなく文書化されていること バグを作り込みにくい仕様であること どれも良い関数の一般論のような話ですが、丸め処理に限って言えば簡単な話ではありません。そもそも浮動小数点数の性質が人の直感に反するため利用者にとっても実装者にとっても罠が多く、結果として上の条件を満たせないことが多いのです（私が面白いと感じるポイント
JavaScript における文字コードの初歩 - 30歳からのプログラミング
この記事では、 JavaScript で文字コードを扱う際に知っておくべき概念である Code Point や Code Unit、サロゲートペア、といったものについて説明していく。 また、具体的にそれらの概念を使ってどのようにコードを書いていくのかについても扱う。 この記事に出てくるコードの動作確認は以下の環境で行った。 Deno 1.26.0 TypeScript 4.8.3 Code Point （符号位置） プログラムで文字を表現する方法は複数あるが、 JavaScript では Unicode という方法を採用している。 Unicode ではあらゆる文字に対して一意の値を割り振ることを目的としており、この値のことを Code Point （符号位置）という。 Code Point は 16 進数の非負整数で、文章中で表記するときは接頭辞としてU+をつける。 例えばAという文字の
「JavaScript」を実際に打ち込んで対戦する『Screeps: Arena』が配信開始。ユニットのAIをプログラムしながら、オンラインで戦うユニークな戦術ゲーム
Screeps, LLCは、JavaScriptを使って戦う戦術ゲーム『Screeps: Arena』の配信を開始した。開発中のゲームを公開する「早期アクセス版」として販売中となっている。 対象プラットフォームはPC（Steam）。価格は税込2050円。4月15日まで税込1845円（10％オフ）のセールを実施している。 （画像はSteam『Screeps: Arena』より） 『Screeps: Arena』（スクリープ：アリーナ）は、プログラミング言語のひとつ「JavaScript」を実際に記述することで、ほかのプレイヤーと戦うオンラインのリアルタイムストラテジー。 ゲームはユニットを直接的に操作するのではなく、ゲーム上でプログラムを記述することによって動かしていく。プレイヤーが記述したプログラムは、ユニットのAIとしてゲーム内で自律的に実行されて戦っていく。 （画像はSteam『Scr
SPA開発とセキュリティ - DOM based XSSを引き起こすインジェクションのVue, React, Angularにおける解説と対策 - Flatt Security Blog
Vue.js logo: ©︎ Evan You (CC BY-NC-SA 4.0 with extra conditions(It’s OK to use logo in technical articles for educational purposes)) / React logo: ©︎ Meta Platforms, Inc. (CC BY 4.0) / Angular logo: ©︎ Google (CC BY 4.0) はじめに こんにちは。株式会社Flatt Securityセキュリティエンジニアの森(@ei01241)です。 最近のJavaScriptフレームワークの進化は著しく、VueやReactやAngularは様々なWebサービスに採用されています。そのため、多くのWebサービスがSPAを実装するようになりました。JavaScriptフレームワークは便利な一方で
【JS】アロー関数の戻り値がObjectの時に()が必要な理由を詳しく解説 | JavaScriptに関するお知らせ
こんにちは!今日はアロー関数のちょっとしたポイントについてです。 戻り値がオブジェクトだと()が必要 アロー関数は戻り値がオブジェクトだと()が必要です、こんな感じ。 const foo = () => ({ one: 1, two: 2, }) ()がないとエラーになるわ。 const foo = () => { one: 1, two: 2, }// error! 一方、戻り値が配列なら()はあってもなくてもいいのよ。 const foo = () => [1, 2] // ok! あとアロー関数以外でも()は不要。 const foo = function () { return { one: 1, two: 2, } } // ok! なぜ()がいるのか アロー関数だと{}がオブジェクトかスコープかわからんからです。 下の例を見てみて。 const foo = () => { re
JavaScriptで壮大なハッキング体験を実現するWebゲーム「Bitburner」で遊んでみた！ - paiza times
どうも、まさとらん（@0310lan）です！ 今回は、ブラウザ上からリアルなハッカー気分を疑似体験できるユニークな無料Webゲームをご紹介します！ PCゲームとしてSteamからもリリースされていますが、今回ご紹介するブラウザ版は手軽に遊べるのでオススメです。ターミナル風のゲーム画面が特徴で、実際にJavaScriptを使ってプログラミングもできます。 ハッキングやセキュリティなどにご興味ある方も含めて、ぜひ参考にしてください！ 【 Bitburner 】 ■「Bitburner」の遊び方 「Bitburner」は、西暦2077年のサイバーパンクをテーマにしたディストピアな世界を舞台にしています。 ゲーム画面は3Dグラフィックや派手な演出があるわけではなく、世界観にピッタリなCLIベースのターミナルを忠実に再現しているのが大きな特徴です。 遊び方ですが、面倒なユーザー登録などは必要ありませ
JavaScriptの参照レコードとthisバインディング
JavaScriptの仕様には「参照レコード」という概念があります。参照を意識することで、JavaScriptにおけるメソッド呼び出しの理解と左辺式の評価順序の理解を同時に深めることができます。本稿ではこの「参照レコード」の動機と詳細の説明を試みます。 ※ 本記事ではECMAScriptの規格で「参照レコード」と呼ばれている概念を説明します。JavaScriptのオブジェクトは参照渡しのような使い方ができますが、これは本稿で説明する「参照」とは少しだけ異なります。 参照レコードの目的 JavaScriptにおける参照レコードは以下の2つの目的で存在しています。 左辺式の中間評価結果を表現するため。 メソッドのレシーバーを決定するため。 左辺式の中間評価結果とは たとえば a[f()] += 2; というコードを考えます。 function f() { console.log("f()");
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JSのWeb Cryptoで生成したECDHのJWKとGo言語でのJWKを共有して共通の鍵のバイト列を生成する - nwtgck / Ryo Ota
タスクキューとマイクロタスクキュー｜イベントループとプロミスチェーンで学ぶJavaScriptの非同期処理
JavaScriptでconsole.logを使用してませんか？
難しすぎると話題の「警視庁の音ゲー」、JavaScriptでベタ書きされていた→作り切る根性がすごいし参考になりそうな実装だった
Reactを学ぶ上で知っておくべきJavaScriptの基本概念 - Qiita
たった256文字のJavaScriptコードで描かれた街の風景アニメがスゴ過ぎて訳がわからない／解説ページを見てもわからないorz【やじうまの杜】
