［ゲーム＆モダン JavaScript文法で2倍楽しい］グラフィックスプログラミング入門 | 技術評論社
目次 第1章 ［入門］グラフィックスプログラミング ……長く役立つ基礎の基礎 1.1 グラフィックスとグラフィックスプログラミングの基本 ……CG、2D、3D、画素 コンピューターグラフィックス ……コンピューターによって描き出されたグラフィックス 2Dと3D ……グラフィックスの生成手順やデータ管理方法が違うだけ グラフィックスを構成するもの ……出力先は「画素」の集まり グラフィックスプログラミングの課題や目的 ……画素をどう塗りつぶすか 1.2 グラフィックスプログラミングの分類 ……活躍の舞台は広い 情報を伝えるためのグラフィックス 情報を正しく理解するためのグラフィックス エンターテイメントとしてのグラフィックス アートとしてのグラフィックス 1.3 グラフィックスプログラミングと技術 ……原則、プログラミング言語、API グラフィックスプログラミングの原則 グラフィックスプログ
各言語で、継承の挙動はかなり違うという話 - Qiita
はじめに この記事は、私が色んな言語でひたすら似たようにクラス継承を書いてみて、実際にどんな値が出力されるのかを調査した結果をまとめたものです。時には既知の言語でも「こんな文法あったんだ」と思いながら、時にはHello Worldから頑張りました。 まとめるのが大変だった割に誰得？という内容ですが、同じことが気になった人のために置いておきます。 いやでも新しい発見があるかもしれないのでとりあえず読んでみてください。 意外と面白い結果になったかもしれません。 調べた言語 静的型付け Java (Corretto 1.8.0_232) C# (3.4.0) C++ (11.0.0) Scala (2.13.1) Kotlin (1.3.61) Swift (5.1.3) 動的型付け Python (3.7.1) Ruby (2.6.5) PHP (7.1.32) JavaScript (nod
Mammoth - WordをHTMLファイルに
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Wordファイルは広くオフィスで使われています。様々なドキュメントがWordで作られていることでしょう。そんなWordにはHTML出力機能もありますが、すごいマークアップで出力されるので、あまり使っている人を聞いたことがありません。 もしあなたがWordファイルをシステムに取り込んだりしなければならない時にはMammothを使ってみましょう。 Mammothの使い方 Wordファイルを解析して、その中のテキストを抽出しています。 画像も表示できます。 Mammothは文字装飾や表組みには対応していないようなので、利用範囲は限定的かも知れません。しかし、あらかじめ決まったフォーマットから情報を抽出するなら簡単です。Wordファイルをテキスト化して検索用にインデックスするのにも使えそう
JavaScript で WebAssembly のバイナリを直接書き出してみた - Qiita
はじめに 趣味の自作言語で WebAssembly を吐いてみようかなと思いました。が、WebAssembly の仕様書を読むだけで理解するのは困難です。そこで手を動かしながら仕様書を少しずつ追いかけていくことで理解しようと思いました。せっかくなので誰か（主に数週間後の自分）の役に立てばなあ、と思い思考の記録を取った次第です。 参考文献 WebAssembly Specification 仕様書です WASM のバイナリの構造 WASM のバイナリは module です(これは正確な言い回しではないかもしれません。Overview の Modulesをよんで)。module の binary encoding はModulesに書いてあります。 ごちゃっとしていて圧倒されますが、以下の3点を押さえると読みやすくなると思います。 module は magic -- version -- se
翻訳：Rich Harris「形而上学とJavaScript」に関する見解（ReactによるDOMの抽象化の不完全性について） - yuhei blog
この記事は「Thoughts on Rich Harris’ “Metaphysics and JavaScript”」の日本語訳です。Svelteのコーディングスタイルや記事として言及している講演のスライドも併せて参照しなければ理解しづらい内容です。 公開にあたっては著者のJim Nielsen氏に許諾をいただいています。 要旨としては、ユーザーにとってSvelteは実際のDOMとのメンタルモデルのギャップが少なく感じられるデザインであって、結果的に、Reactより理解しやすいプログラミングモデルになっているという話です。 Svelteの考案者であるRich Harris氏は、Reactのプログラミングの側面を批判する「形而上学とJavaScript」というタイトルの最近の講演のスライドを共有しました。この講演には非常に説得力があり、Reactを利用した私の経験にも当てはまるとわかりまし
dotJS 2019 - Bert Belder - Deno
Filmed at https://2019.dotjs.io on December 5-6, 2019 in Paris. More talks on https://dotconferences.com/talks A decade after Node.js was first announced, JavaScript and the web platform have evolved, and TypeScript has changed the way JS applications are developed. Deno is a new JavaScript/TypeScript runtime that was designed with all those new capabilities in mind.
ライブラリのコードを読み解くNo.1 <Redux createStore編> - Qiita
はじめに ライブラリのコードを読み解いて、より深くライブラリについて理解するという記事です。 今回は状態管理のためのライブラリであるReduxのcreateStoreについて記載します。 この記事で説明すること ReduxのcreateStoreのソースコードの説明 この記事で説明しないこと Reduxのコンセプトや概要の説明 createStoreの使用方法やサンプルコードの解説 Reduxの概要を説明した記事はいろいろあるかと思いますので、公式サイトやいろいろな解説記事を見ていただくのが良いと思います。 個人的には、Reduxのco-maintainerであるMark Erikson氏によって書かれたこちらのスライドがわかりやすかったです。 対象読者 Reduxのコンセプト説明などのページを見て概要はなんとなくはわかっている人 ReduxのAPIを使用したことがある人 ライブラリバージ
Deno: Will It Replace Node.JS?
A decade after Node.js was first announced, JavaScript and the web platform have evolved, and TypeScript has changed the way JS applications are developed. Deno is a new JavaScript/TypeScript runtime that was designed with all those new capabilities in mind. EVENT: dotJS 2019 SPEAKER: Bert Belder PUBLICATION PERMISSIONS: Original video was published with the Creative Commons Attribution license
静的なHTMLのためのコンポーネント駆動開発―その導入を振り返って
ここ数年で、「デザインシステム」はウェブ開発やデザインのコミュニティでとても人気の話題になりました。そして「コンポーネント」として定義される一連のデザイン成果物を開発・メンテナンスするために、StyleguidistやStorybookといったツールが多くのプロジェクトで一般的に使われています。このプロセスはデザインシステムという概念の一部として、コンポーネント駆動開発（Component Driven Development）と定義することができるでしょう。 さて、コンポーネント駆動開発にまつわる資料のほとんどは、ReactやVue、Angularといった、フロントエンドのビューのためのメジャーなライブラリを利用することについてのものです。しかしもっとトラディショナルな技術スタックの場合はどうすればいいでしょう？ 例えば私たちスタンダードデザインユニットでは、静的なHTMLとCSSのアセ
【初心者〜中上級者向け】JavaScriptの学習サービスと書籍27選 -
こんにちは。倉内です。 WebサイトやWebサービスの開発に欠かせないJavaScriptは、人気も高く習得したいと考えている方も多いのではないでしょうか。エンジニアへの就職活動をしている学生や、未経験からエンジニアになろうという方にとっても、JavaScriptは習得しておきたい言語の1つです。 動的なWebページの作成といったフロントエンドで用いられるのはもちろん、Node.jsに代表されるようにサーバサイドプログラミングでも存在感を増しています。また、jQueryやReact、Vue.jsなどフレームワークも豊富です。 初めて学ぶプログラミング言語としてJavaScriptを選ぶ方も多いと思いますので、今回は基本・基礎を学びたい初心者の方へ向けたコンテンツから、しっかり学びを深めたい中上級者向けのものまで、JavaScriptを学びたいすべての方へ向けて、学習コンテンツと書籍をご紹介
クライアント側のフォーム検証 - ウェブ開発の学習 | MDN
クライアント側の検証は最初のチェックであり、ユーザーの使い勝手を良くするために重要な機能ですクライアント側で不当なデータを捕捉することで、ユーザーはすぐに修正できます。 もしも無効なデータがサーバーに送られてから拒否された場合、サーバーへの往復とクライアント側に戻ってユーザーにデータを修正するように指示することになり、かなり時間を浪費します。 しかし、クライアント側の検証はセキュリティ対策とは考えられません。アプリは常にサーバー側でもクライアント側と同様に送信されたデータのセキュリティをチェックしてください。なぜならクライアント側の検証は容易に回避することができて、悪意のユーザーは簡単に、サーバーへ不正なデータを送信できます。 フォーム検証とは何か 有名なサイトの登録フォームに行き、データを求められている書式で入力しないと、フィードバックがあることに気づくでしょう。 次のようなメッセージが
rel=preload - HTML | MDN
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2021年1月. * Some parts of this feature may have varying levels of support. Learn more See full compatibility Report feedback preload は <link> 要素の rel 属性の値で、その HTML の <head> の中で読み取りリクエストを宣言し、ページのライフサイクルの早期の、ブラウザーの主なレンダリング機構が起動する前に読み取りを始めたい、すぐに必要なリソースを指定することができます。これにより、そのリソ
同じUIコンポーネントをCSSで静的に、Vue.jsやプレーンのJavaScriptで動的に実装する -Tailwind Starter Kit
最近のWebページやスマホアプリのUIでよく使用されるさまざまなコンポーネントをCSSで静的に、Vue.jsやReact.jsやプレーンのJavaScriptで動的に実装するためのコードをまとめたTailwind Starter Kitを紹介します。 CSSは分かるけど、Vue.jsやReact.jsは苦手という人にもよいと思います。 Tailwind Starter Kit Tailwind Starter Kit -GitHub Tailwind Starter Kitの特徴 Tailwind Starter Kitのデモ Tailwind Starter Kitの使い方 Tailwind Starter Kitの特徴 Tailwind Starter Kitは、WebページやスマホアプリのUIに使用するさまざまな静的・動的コンポーネントをTailwindCSSを使って簡単に実装できま
Sweetconfirm.js - 送信を思いとどまらせるボタン MOONGIFT
送信フォームを押してしまって後悔した経験はないでしょうか。Gmailなどでは送信後にキャンセルできる機能が追加されました。押す前に熟考したはずなのに、押すとアラが見つかる、なんてことはよくあります。 今回紹介するSweetconfirm.jsは送信完了するまでに少し猶予をくれる、そんなライブラリです。 Sweetconfirm.jsの使い方 押すのを途中でやめるとキャンセルされます。 しばらく押し続けていると送信完了します。 Sweetconfirm.jsは一度押すだけでは送信されず、ボタンを押し続けないといけません。その仕組みが通常とは違うので、説明をきちんとしないと使い方に戸惑う人もいそうです。とはいえミスを減らすための仕組みとして面白いです。 Sweetconfirm.jsはJavaScript製のオープンソース・ソフトウェア（MIT License）です。 koddr/sweetc
式と演算子 - JavaScript | MDN
このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。 `-QપView in English Always switch to English 前のページ 次のページ この章では JavaScript の式 (expression) や演算子 (operator) について、代入、比較、算術、ビット、論理、文字列、三項演算子などを説明しています。 高いレベルでは、式 は値に解決するコードの有効な単位です。式には （値を代入するなどの）副作用があるものと、純粋に 評価 を行うものの 2 種類があります。 x = 7 という式は前者の例です。この式は = 演算子 を使用して、変数 x に値 7 を代入しています。この式自体は 7 と評価されます。 3 + 4 という式は後者の例です。この式は + 演算子
今こそ伝えたい！@ts-ignoreの魅力 - terrierscript: 保存済みの下書き
#TypeScript #react 2019/10/05 この記事のミッションステートメント TSの型に疲れて生JSに戻ろうとしている人の足首を掴み、世の中にある生JSを一つでも減らす 対象読者 JSよりはちょっと硬いものを使いたい人 TSのd.ts定義で疲れてしまった人 TSは面倒と思っている人 非対象読者 「なんでこんなもの必要なの？」と思った人 多分それは幸せな環境です。大切にしましょう。 @ts-ignoreとは あらゆる型の不整合を握りつぶす。 // @ts-ignoreとコメント形式で書くことで、次の行の型チェックがスルーされる eslint-ignoreなどに近い 構文エラーは潰せない babelなどを通してどうしてもOptional Chainingを使おうとしたことがあるが、やっぱりこれは無理 危険なのでは？ 安全でないのは間違い無い 用法用量を守って正しく使いましょう
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
この TypeScript が Hello, world! のくせに慎重すぎる - Qiita
Tim Taubert: Keeping secrets with JavaScript | JSConf EU 2014
マルウェア「Emotet」に関する被害報告が昨年10月から増加、ウェブサイト改ざんや標的型攻撃にも注意、JPCERT/CCインデント報告対応レポート 
Enterprise-grade Node.js on Azure | BRK3067