前回の記事では、JavaScript の実行エンジン V8 の JIT 出力コードを読んでみました。記事は M1 Mac 上で動かした結果でしたので、ARM アーキテクチャのアセンブラを読むことになりました。 さてそんな ARM アーキテクチャですが、最近の ARM には FJCVTZS という JavaScript 専用の機械語命令があるのをご存知でしょうか？CPU に、特定の言語（それもコンパイラを持たない JavaScript）専用の命令があると知ったとき、私は大いに驚きました（過去にも Jazelle みたいなものはありましたが） 今回は、この FJCVTZS 命令について、実際にどれだけ効果があるのか、V8 をビルドしながら調べてみましょう。 FJCVTZS 命令とは？ FJCVTZS 命令は、Arm v8.3 から導入された JSCVT 命令の一つで、JavaScript の言
はじめに JavaScript/TypeScript初学者を抜けたあたりの方に向けてTypeScriptの利点や限界、型レベルプログラミングについて紹介します。 TypeScriptはJavaScriptをラップしたライブラリであり、静的な型情報をつけることができます。また、それらの型情報をもとに型を推論し、型違反な代入やプロパティへのアクセスなどをプログラム実行 以前 に検知することができるようになっています。 例えば、動的型付けの言語であるJavaScriptでは、以下の関数のa,bには数値だけでなく、文字列を渡すことができます。数値同士を渡せば加算してくれますし、文字列同士を渡せば文字列連結をしてくれます。 「数値計算用の関数なのに、文字列連結に利用できてしまう」という緩さを開発時にはなるべく排除しようというのがTypeScriptを導入する意義です。 以下、TypeScriptの基
はじめに 今回書く開発者体験について 具体的な試み eslint pluginによるコーディング規約の明文化 Notionへのリソース集約 デザイントークンと型定義 おわりに はじめに こんにちは。enechainで働いている takurinton です。 enechainではさまざまな開発者体験向上の取り組みが試行されていますが、今回は自分が主に見ているデザインシステムにフォーカスして記事を書こうと思います。 弊社のデザインシステムに関しては、 @Shunya078 の なぜ我々はデザインシステムを創るのか？ を読んでいただくと背景がご理解いただけると思います。 今回書く開発者体験について 開発者体験の定義についてはさまざまな解釈があると思いますが、今回は以下の3つのトピックに絞って紹介します。 eslint pluginによるコーディング規約の明文化 Notionへのリソース集約 デザ
コンピューティング基盤部の三吉（sankichi92）です。 アークエッジ・スペースでは、衛星リモートセンシング1による地球観測データ（以下、「衛星データ」）を活用したソリューションを提供する Web GIS2 アプリの開発をはじめました。 この記事では、プロジェクトの最初期にあたり、プロダクトのさまざまな可能性を高速に検証するために行った技術的な取り組みを紹介します。 Web GIS アプリをつくる背景 プロトタイプで検証するもの スモールスタートのための技術選定 SPA PMTiles GitHub Pages 開発をはじめてからの改善 React Router 導入 S3 + CloudFront 導入 Amazon Location Service 導入 プロトタイピングの結果 今後の課題と展望 データ基盤、ジョブ管理基盤 動的タイル生成への対応 解析の高度化 Web GIS エン
はじめに 気になっていたYamada UIを使って簡単な一言日記アプリをつくってみました！ なお、これまでに使用したことがあるUIコンポーネントライブラリはChakura UIくらいです。 私自身CSSやデザインの学習経験は全くないので、今回のアプリにおいてもかなり雑な印象を受けるかと思いますが、あくまでもYamda UIを使ってみたかっただけなので、温かい目で見ていただけると幸いです。。 今回の使用言語はReact×TypeScriptです。 Yamada UIとは（ざっくり） 日本人の山田さんが開発されたUI コンポーネントライブラリです。 他のUIコンポーネントとの違いや詳細等は下記に簡潔にまとめられています。 使ってみた感想 １．公式ドキュメントが日本語＆説明が丁寧 前述のとおり、開発者が日本人なので基本的にすべて日本語でした。 また、山田さんのドラゴンボール好きが興じてちょくちょ
Daggerを使ったprogrammable CI/CD - RAKUS Developers Blog | ラクス エンジニアブログ
はじめに こんにちは！ エンジニア２年目のTKDSです！ この記事ではDaggerについて紹介します。 この記事は課内で行ったLTをもとにしたものです。 はじめに Daggerとは？ アーキテクチャ概要 Dagger Function Dagger Module 実際につかってみる ユースケース１：テストのパイプラインを記述 ユースケース２：DB依存の単体テストでDBのコンテナを用意する まとめ Daggerとは？ CIの関数（Dagger Function）化 関数をCLI、SDK、HTTPリクエストなどから実行可能 関数→モジュールにして再利用可能 既存のモジュール（自分や他人が作ったもの）を再利用可能 一度書けばどこでも（ローカルPC、Actionsなど）実行可能 以上の特徴を持つ、コンテナ内でパイプラインを実行する、プログラム可能なCI/CD エンジンです。 アーキテクチャ概要 D
手動作成AWSリソースをIaC化するモブプロ「cdk import day」を定期開催している話 - Uzabase for Engineers
はじめに 「私…全ての手動作成AWSリソースを生まれる前に消し去りたい。全ての宇宙、過去と未来の全ての手動作成AWSリソースを…この手で！」 そんなことを思われた経験はないでしょうか？私は常に思っています。 こんにちは。ソーシャル経済メディア「NewsPicks」のSREチームの安藤です。 先日の JAWS-UG CDK支部 #14 にて、テーマが「IaC Generator祭り」だったこともあり、以下のタイトルでLT発表させていただきました。 www.docswell.com 上記の発表はAWS CDKのコミュニティのライトニングトークということもあり簡単なTIPS紹介が中心だったので、本記事では改めて背景と概要について紹介します。 背景 NewsPicksというサービスは10年以上の歴史があり、サービス開始当初からAWSを利用していました。 現在は、Infrastructure as
スプシの翻訳情報を用いた型付けと段階的i18n対応のためのカスタムESLint ### 内容 ・@nuxt/i18nのt関数にパッチを当ててスプシから生成された翻訳情報で型を付ける ・段階的なi18n対応のために特定ファイルから参照されるコードのみに翻訳漏れを検証するカスタムESLint
Today we are excited to announce the availability of the release candidate of TypeScript 5.5. To get started using the RC, you can get it through NuGet, or through npm with the following command: npm install -D typescript@rc Here’s a quick list of what’s new in TypeScript 5.5! Inferred Type Predicates Control Flow Narrowing for Constant Indexed Accesses Type Imports in JSDoc Regular Expression Syn
2024年7月25日紙版発売 柴田芳樹 著 A5判／208ページ 定価2,860円（本体2,600円＋税10%） ISBN 978-4-297-14293-3 Gihyo Direct Amazon 楽天ブックス ヨドバシ.com 電子版 Amazon Kindle honto この本の概要 本書は，著者が1993年から約30年間経験してきたAPI仕様の作成，2003年から20年間経験してきたテストファースト開発／テスト駆動開発の知見をまとめたものであり，一般的なソフトウェア開発者が習得することが容易ではない事柄を，本書を通して学び，実践してもらうことを目的としています。 本書が提唱する「API仕様ファースト開発」はWebサービスにおける大域的なテスト駆動開発の実現に必要なものであり，また，API仕様ファースト開発を実現するにはテスト駆動開発が必要です。API仕様ファースト開発とテスト駆動
こんにちは。技術本部ウラカタ開発部のkaorun343です。フロントエンドエンジニアのチームでは継続的に開発環境の改善活動をおこなっています。今回はこの活動において実施した、React Routerのアップデート作業について紹介します。 はじめに 方針 移行ガイドにそって更新作業を実施する ESLintを用いる AST Grepについて ESLintを活用した移行作業 ルート定義の修正 <Switch> の中にある <Redirect> を除去 <Switch> の中にある <Route> 以外のコンポーネントの除去 コンポーネントの修正 route propsを利用している箇所の修正 最後に はじめに アソビューの社内向け管理画面はReact Routerを用いたシングルページアプリケーションとして構築しています。この管理画面アプリケーションは長らく依存パッケージの更新がなされていなかっ
Turborepo 2.0
Turborepo 2.0 improves the developer experience of JavaScript and TypeScript repositories, with features including: New terminal UI: Interactive tasks and clearer logs Watch Mode: Dependency-aware task watcher for any tooling in your repository All-new documentation: Core monorepo concepts, refreshed API reference, and ecosystem tooling guides Licensing and maintenance updates: Upgraded to MIT lic
マイクロソフトが開発したプログラミング言語「TypeScript」、エンジニアの平均年収はいくら？（＠ＤＩＭＥ） - Yahoo!ニュース
TypeScriptは言語年収ランキングの4位に位置し、平均年収は1,235万円となっている。中央値年収もそれに近い1,190万円。月収では平均で103万円、中央値は99万円と、高水準にある。時給でみても、平均6,124円、中央値5,903円と良好な水準となっており、TypeScriptが開発者にとって魅力的な言語の1つであることがうかがえる。 TypeScriptの案件数TypeScriptの案件数は全体の11.0%を占めており、案件数ランキングでは4位に位置している。多様な分野でTypeScriptが利用されるなど、需要が非常に高い言語といえる。開発者にとってTypeScriptは就業機会に恵まれた選択肢の1つと言えるだろう。 TypeScriptの開発者の稼働日数を見ると、週2～3日が51.49%と最も多く、次いで週4～5日が47.52%となっている。この2つを合わせると99%以上を
TypeScriptの型と値とバリデーション
TypeScript は本質的に自分に型が付与されていると思っているだけの JavaScript です。 いくら型を付与しようが、それが実行時に影響を与えることはありません。 コードレビューをしているとここを誤解している人が本当に多いです。何度も解説しているのですが、なかなか浸透しないので、TypeScript におけるバリデーションという視点で記事を書くことにしました。 あと TS でバリデータ使って色々作ろうとしている友人と、プログラミング始めたてで zod と openapi を使っいる友人がいたので、彼らが想定読者です。 型と値の名前空間 TypeScript 上での名前空間(スコープ)は2つに分類できます。 値: 実行時にランタイム上のメモリに存在するもの 型: 静的解析時にのみ参照可能なもの。コンパイル時に完全に消滅する。 TypeScript は基本的に JavaScript
はじめに この記事では、個人の習作としてwasm-image-resizerという簡易な画像リサイズ・フォーマット変換ツールをWebAssembly + PWA + Reactで作成したので、そのときに私の得た知見を記載したいと思います。 アプリとしては実に単純であんまり面白みもないのですが、半ばちょっとした好奇心と勢いで自分なりに作ってみました。手探りで拙いですが、ソースコードは以下に配布していますので、よかったら見てみてください。 アプリの技術目標 このアプリを通して私が考えた技術目標は以下のとおりです。 フロントエンドとしては言語はTypeScript、Viteをベースにする UIのフレームワークとしてReactを使用 画像変換などのアプリでやりたいコアな処理はRustで記述 wasm-bindgenとwasm-packでWebAssembly化・javascriptパッケージ化を行
はじめに SanityというヘッドレスCMSを紹介します。以下ヘッドレスCMSのことをCMSと表記します。（そもそもコンテンツ管理システムにコンテンツ表示側のシステムが乗っかってるほうがおかしいんだからわざわざヘッドレスCMSって言うのもそろそろやめね？という気持ちがある。ちなみにWordPressみたいなヘッド有(?)CMSのことモノリシックCMSっていうらしい。WordPressのくせにかっこよくて生意気！！) 日本国内ではmicroCMSなどが有名で、ここZennではSanityに関する記事は現在1つしかないという現状を嘆いてこの記事を贈ります。 なぜ推すのか 前提として僕は大昔にContetfulというCMSを1度だけ使ったことがあるだけで、その他CMSはWordPressしか使ったことがありません。なので他CMSとの比較を実際に使用した人目線で書くことはできないことをご了承くださ
Berryを支えるアーキテクチャを紹介します
こんにちは、株式会社Berryの浅沼です！ 今回は、開発しているサービスの中からヘルメット治療管理システムのアーキテクチャについて紹介します。医療機関と３Dデータのやり取りをしながらヘルメット治療に関する管理を実現しているWebシステム、そのアーキテクチャの特徴、今後の展望について触れたいと思います。 システム概要 ヘルメット治療管理システムは、主に以下の3つの機能を持っています。日々、医療機関の方の使いやすさ、見やすさを考えながら開発しています。特に、3Dヘルメットデータを確認するUIなどは、別途、機会があれば技術面を紹介してみたい内容です。 3D頭部データの受信 3Dヘルメットデータの確認 ヘルメットの発注 アーキテクチャの詳細 システム全体のアーキテクチャは以下の図のようになっています。 フロントエンド フロントエンドは、VueとTypeScriptを使用して構築されています。アプリ
How to Document Picture-in-Picture in React (with Typescript) | HackerNoon
How to Document Picture-in-Picture in React (with Typescript) by@dlitsman Too Long; Didn't ReadThe Chrome 116 update introduced the Document Picture-in-Picture API, expanding developers' control over custom controls and UI for Picture-in-Picture mode. This feature is currently supported in Chrome and Edge, with potential for wider browser support. The API allows opening, closing, and detecting Pic
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ARM に存在する JavaScript 専用命令「FJCVTZS」を追う（ついでに V8 をビルドする）
TypeScriptを導入する意味と限界、型レベルプログラミングの紹介 - Qiita
デザインシステムの開発者体験向上の試み - enechain Tech Blog
サーバレスではじめる Web GIS アプリのプロトタイピング - ArkEdge Space Blog
Yamada UIを使ってミニアプリつくってみた - Qiita
TypeScriptを活用したi18n対応
Announcing TypeScript 5.5 RC - TypeScript
Web API設計実践入門──API仕様ファーストによるテスト駆動開発
ESLintを活用したReact Routerのアップデート作業 - asoview! Tech Blog
WebAssembly・PWAの習作アプリを作成して感じたこと
デベロッパー向けヘッドレスCMS、Sanityを始めよう