JavaScriptを知らない人のためのTypeScript入門 - Qiita
今どきはよく「JavaScriptじゃなくてTypeScriptを使うべき」みたいな話を聞くのですが、ネット上のどのTypeScript入門も、JavaScriptを知っている前提で話が進みます。以前、友達に「JavaScript知らないんだけど、それをすっ飛ばしてTypeScriptを学ぶ方法はないの？」と訊いたところ、「素直にJavaScriptをしてから、TypeScriptしようね。」という回答が帰ってきました。にゃーん。 しかし、これは正しい回答で、TypeScriptの公式サイトのLearning JavaScript and TypeScriptに以下のことが書かれています。 We frequently see the question “Should I learn JavaScript or TypeScript?“. The answer is that you can
異世界JavaScript
最近は異世界転生も珍しくなくなりました。もしも異世界にJavaScriptがあったら、それは我々の知るJavaScriptとどう違うでしょうか？ この記事では、ECMAScriptまたはその亜種に実装された機能で、標準化に至らなかったものを取り上げます。モダンなECMAScriptしか知らない方には、きっと異世界を見るように新鮮に感じていただけることと思います。 異世界の typeof 演算子 「13.5.3 The typeof Operator - ECMAScript® 2025 Language Specification」によると、typeof 演算子の返しうる値（文字列）は undefined object string symbol boolean number bigint function のちょうど8通りです。しかし、異世界のJavaScriptでは typeof がこ
p5.jsによるクリエイティブコーディング入門 - ICS MEDIA
ウェブ技術を用いたクリエイティブコーディング環境にはさまざまなものがありますが、プロトタイピングや2D表現には、Canvas 2DをラップしたJavaScriptライブラリ「p5.js」が非常に便利です。この記事ではp5.jsの強み、便利な関数と作例を紹介し、自分で作成した作品の公開方法について解説します。 p5.jsとは p5.jsは、ウェブ上でグラフィカルな表現ができるJavaScriptライブラリで、基礎的なプログラミングの知識さえあれば手軽に創作を始められるのが魅力です。 またp5js.orgが提供しているウェブエディターを使うと、環境構築なしにブラウザ上でクリエイティブコーディングが始められます。たった数十行のみのコードでもメディアアート作品のような出力が得られる、とても興味深いライブラリです。今回はp5.js Web Editorを使って簡単なアニメーションを制作しましょう。
全世界のソフトウェア開発者は4700万人。最も多いのがJavaScript開発者で2800万人、Java、Pythonが続く。スラッシュデータの調査
全世界のソフトウェア開発者は4700万人。最も多いのがJavaScript開発者で2800万人、Java、Pythonが続く。スラッシュデータの調査 IT業界に関する調査を行っているSlash Dataは、全世界のソフトウェア開発者に関する調査結果を発表しました。 発表によると、全世界のソフトウェア開発者は合計で約4700万人。そのうち最も多く使われているプログラミング言語がJavaScriptで、約2800万人のソフトウェア開発者が利用しています。 2位がJavaで約2320万人、3位がPythonで2290万人、4位がC++で1630万人、5位がPHPで1150万人と続いています。 言語ごとの開発者の増加ペースで見ると、JavaScriptを利用する開発者はこの1年で280万人増加したものの増加ペースは鈍化。 スラッシュデータは、この鈍化はJavaScript開発者をめぐる人材市場が成
Making JavaScript run fast on WebAssembly - Bytecode Alliance
JavaScript in the browser runs many times faster than it did two decades ago. And that happened because the browser vendors spent that time working on intensive performance optimizations. Today, we’re starting work on optimizing JavaScript performance for entirely different environments, where different rules apply. And this is possible because of WebAssembly. We should be clear here—if you’re run
クイックスタート – React
React ドキュメントへようこそ！ このページでは、日々の開発で使用する React のコンセプトのうち 80％ の部分を紹介します。 このページで学ぶこと コンポーネントの作成とネスト マークアップとスタイルの追加 データの表示 条件分岐とリストのレンダー イベントへの応答と画面の更新 コンポーネント間でのデータの共有 コンポーネントの作成とネスト React アプリはコンポーネントで構成されています。コンポーネントとは、独自のロジックと外見を持つ UI（ユーザインターフェース）の部品のことです。コンポーネントは、ボタンのような小さなものである場合も、ページ全体を表す大きなものである場合もあります。 React におけるコンポーネントとは、マークアップを返す JavaScript 関数です。
［改訂新版］プロになるためのWeb技術入門 | 技術評論社
概要 なぜWebシステムをうまく作ることができないのか？――本書は2010年に初版が発行されました。Webに携わるエンジニアだけでなく、Webマーケティング担当者にいたるまでWebの仕組みを根本から理解するための技術書として多くの方々に利用されました。それから10数年の月日が流れ、本書の特徴である技術の根本をていねいに解説するスタイルはそのままにアップデートを図りました。最新のWeb技術を取り入れて全面改訂です。さらに技術を学ぶ上でのさまざまな悩みを解消し、エンジニアとして成長していく手がかりをふんだんに盛り込みました。もちろんサンプルアプリケーションプログラムを試しながら理解を深めていく工夫もしています。本書によって本質をとらえるプロの技術力も得てください。 目次 第1章 技術の学び方 1.1 技術の学びはなぜ難しくなったのか 1.1.1 要件の多様さと複雑さ 1.1.2 技術的選択肢の
GitHubで最も使われている言語、PythonがJavaScriptを抜いて1位に。生成AI関連プロジェクト急増で。GitHubが年次調査「Octoverse 2024」発表
GitHubで最も使われている言語、PythonがJavaScriptを抜いて1位に。生成AI関連プロジェクト急増で。GitHubが年次調査「Octoverse 2024」発表 GitHubは、この1年のGitHubにおけるGitHubの利用動向やオープンソースの動向などをまとめた年次レポート「Octoverse 2024」を発表しました。 コミュニティ参加者はインドが2028年に米国を抜いてトップに 発表によると、2024年のGitHub上のプロジェクト総数は1年前から25％増加して5億1800万。コントリビューションの総数は52億。GitHubの規模は継続して急速に拡大していることが分かります。 そして下図の右下にあるように今回最大のトピックは、PythonがJavaScriptを抜いてGitHubでもっとも使われている言語の1位となったことです。その背景には後述するように、生成AI関
『JavaScriptプログラマーのためのTypeScript厳選ガイド』を執筆しました - Islands in the byte stream
JavaScriptプログラマーのためのTypeScript厳選ガイド という本を書きました。JavaScript中級者でTypeScript初心者のプログラマーに向けたTypeScriptの入門書です。 これまで何度かTypeScriptの記事を書いてきました。 TypeScript再入門 ― 「がんばらないTypeScript」で、JavaScriptを“柔らかい”静的型付き言語に｜ハイクラス転職・求人情報サイト AMBI（アンビ） 「がんばらないTypeScript」のための現実的な設定を考える ─ 4レベルの厳しさを使い分けてTypeScript疲れを克服しよう！｜ハイクラス転職・求人情報サイト AMBI（アンビ） 今回の本は、既存のJavaScriptプロジェクトをTypeScriptに移植するという場面を想定した「がんばらないTypeScript」路線ではなく、TypeScri
React – ユーザインターフェース構築のための JavaScript ライブラリ
React は、インタラクティブなユーザインターフェイスの作成にともなう苦痛を取り除きます。アプリケーションの各状態に対応するシンプルな View を設計するだけで、React はデータの変更を検知し、関連するコンポーネントだけを効率的に更新、描画します。 宣言的な View を用いてアプリケーションを構築することで、コードはより見通しが立ちやすく、デバッグのしやすいものになります。 自分自身の状態を管理するカプセル化されたコンポーネントをまず作成し、これらを組み合わせることで複雑なユーザインターフェイスを構築します。 コンポーネントのロジックは、Template ではなく JavaScript そのもので書くことができるので、様々なデータをアプリケーション内で簡単に取り回すことができ、かつ DOM に状態を持たせないようにすることができます。
【JavaScript】Idle Detection APIとかいう悪用以外の使い道がないAPI - Qiita
2024/09/10にIdle Detection APIというAPIが更新されていました。 ステータスはDraft Community Group Reportです。 これはコミュニティによる提案であり、W3Cによる正式な勧告ではありません。 個人や団体レベルでも、とりあえずRFCを作ってみたり検討したりできる段階ということです。 以下はこの提案を管理しているGitHubから、このRFCの意義を解説したReadmeの紹介です。 User Idle Detection API このAPIでは、開発者はユーザがアイドル状態になったとき(キーボードマウスを操作していない、スクリーンセーバーが起動した、画面がロックした等)のイベントリスナーを登録できます。 入力イベントの監視によるソリューションと異なり、この機能はサイトのコンテンツ領域を超えて機能します。 すなわち、ユーザが別のウィンドウやタブ
便利なJavaScriptライブラリが登場！ CSSのプロパティの値の変更を検出できる -CSSStyleObserver
DOMツリーに加えられた変更を検出する機能としてMutationObserverが便利ですが、CSSのプロパティの値は検出できません。 最近ではCSSアニメーションを使用したWebサイトやスマホアプリも増え、プロパティ値の変更に応じてコールバックを実行する必要があるかもしれません。CSSのプロパティの値の変更を検出するための新しいライブラリを紹介します。 Introducing @bramus/style-observer, a MutationObserver for CSS by Bramus! 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに ライブラリのデモ ライブラリのインストール ライブラリの使い方 ライブラリの仕組み ライブラリのサポートブラウザ カスタムプロパティのトランジションに関する注意事項 はじめに
フロントエンドのコーディング課題６選-このフロントエンドの課題、実装できますか？ - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? こちらの記事は、Indrek Lasn 氏により2019年 10月に公開された『 Here Are 6 Front-End Challenges to Code 』の和訳です。 本記事は原著者から許可を得た上で記事を公開しています。 著者Twitter https://twitter.com/lasnindrek フロントエンドの開発はストレスが多く難しい作業ですが、練習すれば技術をマスターすることができます。 自ら進んで鍛錬と努力をすれば、フロントエンド開発の場面で問題を解決することのエキスパートとなることができるでしょう。 優れたフ
クレカ情報の流出があったタリーズオンラインストアのWebアーカイブから原因を特定した猛者が現れる→集まった有識者たちにより巧妙な手口が明らかに
あらおじ @ojigunma すごい タリーズの原因発見してる人いる 確かにナンカある slick.min.js という画像をスライドするファイルの中に 難読化された悪意のあるコードが追記されてるっぽい 難読化は４段階ぐらいされてるらしい これブラウザとかセキュリティソフトで気づくのは無理なんだろか。。。 x.com/motikan2010/st… 2024-10-04 13:15:14 Niishi Kubo @n11sh1_ クレカ情報漏洩の件、技術的な原因特定はこの投稿が一番分かりやすかった。 slick.min.js（画像切り替えのライブラリ）を改ざんされてマルウェアが仕込まれて、クレカ情報はサーバーに送信される前にフロントエンドから外部に送信されていたらしい。Content-Security-Policy がレスポンスヘッダーにきちんと設定されていれば悪意あるドメインに対しての通
JavaScriptの非同期処理をしっかり理解する 〜async/await/Promise〜 - Qiita
JavaScript での非同期処理について、身近な例や具体例を交えながら詳細に解説しています。 最後には練習問題も用意しています！ 頑張って書いているので、良いと思ったらコメント・いいね・ストック・共有などしてもらえると嬉しいです！！ 非同期処理とは 非同期処理とは、プログラムの処理が順番に実行されず、ある処理を実行している間に他の処理を並行して実行することができる仕組みです。非同期処理では、あるタスクが完了するのを待たずに次のタスクが実行されるため、効率的に複数の処理を進めることが可能です。 （by ChatGPT） 非同期処理とは、「同期処理」の対義語で、同期処理は「プログラムの処理が順番に実行され、ある処理が終わるまで次の処理を待つ仕組み」です。 非同期処理の最大のメリットは、 「時間のかかる処理を行っている間に別の処理を行うことができる」 ことです！ 身近な例では、部下への仕事の
知らないと損する最強のクライアントサイドストレージ ～ IndexedDB完全ガイド ～ - コハム
A complete guide to using IndexedDB 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 データストレージは、ユーザーデータからアプリケーションデータまで、ほとんどのWebアプリケーションにおいて重要な部分です。より高速で堅牢なWebアプリケーションの急速な開発に伴い、効率的なクライアントストレージが開発を支援するために必要となっています。 Webにおけるクライアントサイドストレージは、長年にわたって進化してきました。ユーザーデータを保存するためのクッキーから、ブラウザ内にSQLデータベースを保存することを可能にし、SQLに精通したユーザーが容易に堅牢なアプリケーションを構築できるようにしたWebSQL（現在は非推奨）の登場まで発展してきました。 IndexedDBはWebSQLの代替であり、前身よりも多くの
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
React は次の10年を生き残れるか：3つのトレンドから考える
npm | build amazing things
GitHub - hoppergee/heic-to: Convert HEIC/HEIF images to JPEG, PNG in browser
GitHub - pieroxy/lz-string: LZ-based compression algorithm for JavaScript
