GitHubのトレンドで振り返る2022年のJavaScript/TypeScript
今年も GitHub トレンドから 2022 年の JavaScript/TypeScript を振り返ります。去年の記事はこちらです。 — GitHub のトレンドで振り返る 2021 年の JavaScript | WEB EGG 集計方法 本記事の集計期間は 2022/01/01〜2022/12/07、対象言語は JavaScript および TypeScript です。 なお GitHub がそのリポジトリをなんの言語と見なしてトレンドに掲載したかをもとに集計対象を決定していることにご留意ください。 別言語で書かれた Rust 製の JS 向けのツールや CSS フレームワークなどは基本的に対象外となります。 集計に利用したデータですが、GitHub は過去のトレンドを閲覧する方法を提供していないため、独自の仕組みで GitHub トレンドのアーカイブを生成しそのデータを利用しまし
The State of JavaScript Developer Survey
State of JavaScript The annual developer survey of the JavaScript ecosystem The JavaScript world could use a bit of classification. Since 2016, this survey has collected data from over 20,000 developers each year to identify current and upcoming trends. Together, let's find out which libraries developers want to learn next, which have the best retention ratings, and much more.
フロントエンドのトレンドは変化したか？ アンケート結果から分析する2022年のウェブ制作 - ICS MEDIA
ウェブ業界の当たり前だと思っていることでも、他社の人には違う常識があるかもしれません。自分が業界多数の傾向と違うところはどこなのか・・・、この連載ではアンケートデータから国内のウェブ業界の傾向を分析します。 連載8回目となる本記事では「フロントエンドエンジニアの移り変わり」をテーマとしてアンケート結果を紹介します。 あなたが最近使っているJavaScriptライブラリ/フレームワークはどれ？（2022年版） 国内で最近人気のあるJavaScriptライブラリ/フレームワークはどれでしょうか。 5,168票の回答があり「React」が46.67%、「Vue」が23.9%、「Angular」が4.3%、「jQuery」が25.1%でした。 3年前の2019年にアンケートをしたとき（参照記事）は「React」が23%、「Vue」が37%、「Angular」が7%、「jQuery」が33%でした。
TypeScriptとエコシステム | TypeScript入門『サバイバルTypeScript』
TypeScriptを学習するとき、TypeScriptそのものを理解することは不可欠です。しかし、それだけでは実務上不十分なことが多いです。実際の現場では、TypeScriptに数多くの技術スタックを組み合わせて、開発を行うからです。そのため、TypeScriptを知ると同時に、TypeScriptをとりまくエコシステムを知ることが重要になってきます。 前項のTypeScript誕生の背景が歴史学だとすると、本項は地理学です。フロントエンドの技術スタックを中心に、TypeScriptとの関わりや、各技術の役割について俯瞰的に学びます。 言語JavaScriptの仕様を定義したのがECMAScriptです。ECMAScriptはJavaScriptのコア部分の仕様を扱います。ブラウザ関連のJavaScript仕様を定めるのがWHATWGです。また、XMLの構文をJavaScriptに書け
コンソールによるプログレス表示 - コンソール制御 - 碧色工房
ソフトウェアの処理には往々にして、完了までに利用者を待たせざるを得ない場面というものがある。 純粋にCPU処理に時間がかかるものであったり、ダウンロード等の通信に時間がかかるものなど、様々な状況があるだろう。 その場合、何もユーザに知らせないと、異常が発生し止まっているのか、正常な待ち時間なのかが分からないし、 同じ時間待つにしても、待つ必要があることが、更にはどのぐらい待つ必要があるのか、 が分かったほうが、その待ち時間は短く感じるものだ。 ユーザビリティ上プログレス表示の重要度は高い。 GUIではプログレスバーという表現方法が一般的だが、 コンソール上でも類似した表示を実現する方法が幾つかある。 その方法について紹介する。 前準備 プログレスバーの表現方法を紹介していくが、 本来であれば「何らかの処理」をしながら表示するということになる。 ここでは、「何らかの処理」をスリープで表現して
Ship ESM & CJS in one Package
[[toc]] ESM & CJS ESM - ECMAScript modules CJS - CommonJS In the past decade, due to the lack of a standard module system of JavaScript, CommonJS (a.k.a the require('xxx') and module.exports syntax) has been the way how Node.js and NPM packages work. Until 2015, when ECMAScript modules finally show up as the standard solution, the community start migrating to native ESM gradually. // CJS const cir
async/await は Promise を置き換えない - Okapies' Archive
まとめ async/await 構文は、Promise で書ける処理のうち特定のケースしか表現できない 特定のケースとは、ある非同期処理の前処理と後処理がそれぞれ 1 個ずつの場合のみである async/await 構文は初心者に非同期処理を導入する際に適しているが、非同期処理を逐次処理として書けるという幻想を与えるので、どこかで知識をアップデートする機会を設けるべきである この記事はなに？ 少しバズったのでまとめておこうかと。 「async/await があれば Promise なんて難しいものは要らない！」とか言ってるウブな子に、複数の API に並列にリクエストを投げて一つ以上成功した時だけ先に進む、みたいな問題を与えて愛でてみたい。— Yuta Okamoto (@okapies) 2020年12月11日 async/await は Promise のネストを手続き的なコードに見え
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に保存す
React今昔物語 - ICS MEDIA
機能改善だけでなく、非推奨になった機能も多いですね。 2015年〜 ES2015の正式リリース前 2015年6月まではES2015が正式リリースされていなかったため、Reactのコンポーネントの作成にはReact.createClassが使われていました。 React独自のクラスコンポーネントを生成する機能です。 var Component = React.createClass({ render: function() { return ReactDOM.tagName({options, "Hello"}) } }); React.renderComponent( Component(null), document.getElementById("root") ) 2016年〜 クラスコンポーネントの時代 Reactバージョン15.0.0からはReact.createClassはほとん
JavaScriptのモダンな書き方 - ES2020のオプショナルチェーン、null合体演算子、動的import、globalThis等を解説 - ICS MEDIA
JavaScriptのモダンな書き方 - ES2020のオプショナルチェーン、null合体演算子、動的import、globalThis等を解説 JavaScriptの仕様であるECMAScriptは年次で仕様が更新されています。ECMAScript 2020（ES2020）は2020年6月にリリースとなりました。現行のすべてのブラウザでES2020の機能は利用できますが、フロントエンドエンジニアにとって使いこなしたい記法ばかりです。 本記事ではES2020に焦点をあて、JavaScriptの新しい記述方法のメリットと使いどころを解説します。 オプショナルチェーン Optional Chaining（オプショナルチェーンやオプショナルチェーニングと呼ばれています）とは、?.構文を用いてnullやundefinedになりうる値へ安全にアクセスできる仕組みです。 利用シーン nullやunde
WebAssembly 開発環境構築の本
この文章は Rust を用いた WebAssembly の開発環境を構築する手法を紹介するために作成されました. ハッシュタグ: #WASMの本紹介記事: WebAssembly 開発環境構築の本を公開しました - mizdra's blog# 本書の目的Rust を用いた WebAssembly の開発環境を構築する手法を知ることモジュールバンドラと連携する方法を知ることTypeScript と連携する方法を知ることWebAssembly を利用していて陥りやすい罠を知ることWebAssembly に関する情報を調べる方法を身につけること# 本書でやらないことWebAssembly/Rust/JavaScript の文法や機能の解説が目的ではない Rust からコンパイルして生成された WebAssembly を JavaScript から利用する方法を解説する文法や機能については, W
ECMA-262-3 in detail. Chapter 8. Evaluation strategy
That’s said, they differ only in the assignment semantics: “by reference” can replace the full contents, and “by sharing” instead rebinds the pointer to the new address. In fact, references in C++ are just a syntactic sugar for pointers. At the lower level they are even compiled to the same exact instructions, and hold the same values — that is, addresses. However, references change the high-level
Everything you need to know from ES2016 to ES2019
JavaScript is a language in constant evolution and in the past few years many new features have been added to the ECMAScript specification. This article is an extract of my book Complete Guide to Modern JavaScript and it covers the new additions of ES2016, ES2017, ES2018, ES2019. At the end of the article you will find a link to download a cheatsheet that summarizes everything. Everything new in E
React HooksのuseStateがどういう原理で実現されてるのかさっぱりわからなかったので調べてみた
Reactのhooks、すごいですよね。関数コンポーネントの自由度があがって色々実現できそうです。 私はReactについては2年ぐらい知識止まってるので、かなり衝撃的でした。ContextとかSuspenseとかいろいろ増えてて今更追いつくのは難しいけど、hooksはちょっと使ってみたいなーと感じました。 そんなhooksですが、使い方はそこそこわかるけど動作原理がさっぱりわからなかったので、ちょっと調べてみました。 そもそもHooksってなに hooksは関数コンポーネントからReactのいろいろな機能をフックでき、自分で汚く実装するんじゃなくてReactが面倒見てくれるよーってやつです。useStateで状態を持たせることができ、useEffectでcomponentDidMountみたいなことを実現、あとほかにもuseXXX系がいろいろ、という感じです。 useStateを例に見てみ
Front-end Developer Handbook 2019 - Learn the entire JavaScript, CSS and HTML development practice!
Written by Cody Lindley Sponsored by Frontend Masters, advancing your skills with in-depth, modern front-end engineering courses Download: PDF | epub Overview: This is a guide that everyone can use to learn about the practice of front-end development. It broadly outlines and discusses the practice of front-end engineering: how to learn it and what tools are used when practicing it in 2019. It is s
ES modules基礎知識 - 仕様の概要とその周辺課題 | CodeGrid
ES modules基礎知識 第1回 仕様の概要とその周辺課題 ES2015仕様において策定されたES modulesは、JSファイルから別のJSファイルを読み込む仕組みです。まずはこの仕様がどのようなものなのかを知り、さらにその背景と課題について考えてみます。 ES modulesとは ES modulesは、ES2015仕様において策定された、JavaScriptファイルから別のJavaScriptファイルを読み込む仕組みです。 Node.jsでは、ほかのJSファイルの読み込みはCommonJSの仕様に沿った方法ですでに実現していましたが、ES modulesは標準としてNode.jsとブラウザ両方に対応したモジュールシステムの仕様と位置づけられます。 これまでそのようなものがなかったブラウザと、別の方法でやってきてしまったNode.jsの間で互換性をとるため、両者における従来の作業工
JavaScript Bootcamp 2018
2018年4～5月開催「ブートキャンプ特別講座」の資料になります。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Home Page - MeasureThat.net
Call static methods from regular ES6 class methods
Editor.js
