【初心者歓迎】C#だけでWebゲームを1時間で作る javascriptやAJAX不要！Blazorの凄さを体験する - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
CSS3で疑似3D表現を実現するSprite3D.jsを触ってみた | KnockKnock
JavaScriptとCSS3だけで疑似的に3D表現を行うことができるSprite3D.jsを、モックアップ作成ついでに触ったので投稿します。 Sprite3D.jsソース Sprite3D.jsドキュメント このライブラリは、Tree.jsのように、WebGLをサポートした3D描画ライブラリとは違い、CSS3のtranslate3dを使って、画像にパースをかけて疑似的に3D表現を付与するライブラリです。そのため計算処理が少なく、処理が軽いことが特徴です。もちろん疑似的なD3表現のために出来ることが限られていますが、ブラウザゲームを作るといったこと以外では、これで十分ではないかと思われます。処理が軽いことでスマートフォンやタブレットで動かすことも現実的ですが、IE9以下ではperspectiveをサポートしていないために使用できません。 かんたんなサンプルを作成しました。 33～28行目
JavaScriptによる簡易的な3D表現の実装 - Qiita
はじめに 計算機のハードウェアの進歩により、最近では3D表現を用いたゲームやプログラムは手軽なものになりました。例えばJavaScriptではThree.jsのようなライブラリを用いることで手軽に3D表現を用いた作品を作ることができます。 今回は上記のようなリッチなライブラリには目もくれず、原始的な3D表現をJavaScriptで実装しようと思います。趣旨としては、簡易的な3D表現の単純さ、JavaScriptエンジンのパフォーマンスの体感、あたりになります。JavaScriptの実行エンジンはとても高度に最適化されており、C言語と同等までには届きませんが、スクリプト言語としてはとても高速に動作することが特徴です。 真面目に向き合わなければならない課題はきちんとこなしつつ、JavaScriptの高速さの影に隠れて楽をできるところは楽してしまおう、という感じで進めていきたいと思います。 作る
JavaScriptのforEachでawaitが効かない理由 - Qiita
背景 JavaScriptでは forEach という配列から要素を取り出して反復処理できる関数があります。 前の記事 JavaScriptのforEach内でbreakができない理由【備忘録】 では、 forEach の中では break が使えず、途中でループを抜けることができない理由についてまとめました。 今回はその続きとして、forEach の内部で await を使った場合に、非同期処理の完了を待たずに次の処理へ進んでしまう、という挙動について理由を調べてみました。 forEach内でawaitしてみる forEach の中で await して得られた値を配列に追加し、 forEach の直後に配列を console.log で出力する例で確認します。 for文の感覚でいえば、イテレーション中の await で都度処理を待ってくれるイメージなので、全ての要素への処理が終わったら配
TypeScriptの危険性 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 筆者は現在、ESMベースの素のJavaScriptにJSDocで型情報を付与し、tsc によって型定義（.d.ts）のみを出力する構成で開発を行っています。 この構成は、静的解析や補完といった恩恵は享受しつつ、 視認性の良さ 型の複雑化 言語的な矛盾 ビルドの煩雑さ チーム運用コストの肥大化 といったTSの構造的な問題を回避する、極めてバランスの取れた開発スタイルであると思い採用しています。 私も現場を指揮する上でTSへの移行についてはずっと考えてきましたが、次にTSで書きたいと言われた際には 「開発コスト食い潰すだけだからや
【JavaScript】MDNが推奨する最強の書き方 - Qiita
はじめに MDNのドキュメントを眺めていたら、JavaScript のサンプルコードの作成ガイドラインという章を見つけました。第三者にコードを公開するような人向けにまとめられたものですが、正しい書き方の実践としてみることができるので、クローズドなプロジェクトの中でも使えるかもしれません。ただ、モノによってはチームで決めた慣習と食い違うこともあるかもしれないので、採用はケースバイケースになると思います。 上記のページが紹介された記事があまり見当たらなかったので、折角なので共有してみようと思います。あと、ところどころ補足を付け加えています。 対象読者 基本的には初心者向け ただ、幾つかは中級者の方でもためになるものがあるかも？ 規則の一般性 ☆：よく見かける書き方。一般的 ☆☆：あまり見かけないかもしれない書き方。あるいは、意識的には規則づけられてなかった書き方 ☆☆☆：クローズドなプロジェク
知っておくと仕事が捗る便利ツール17選 - Qiita
はじめに 知っておくと仕事が捗るブラウザ上で動く超便利なツールを17個集めました。 Squoosh Googleが開発した画像変換・圧縮用のWebサービス。 プレビュー画面で変換前後の画質をリアルタイムで確認しながら圧縮設定を調整することができる。 Documatic Documaticは、プロジェクトドキュメントの開発プロセスを削減するためのツール。API リファレンスからユーザー ガイドまで、コード ベースを簡単に文書化できる柔軟なテンプレートとユーザーフレンドリーな編集ツールを提供する。 transform jsonからyamlの形式に変換したい等、あらゆるデータ形式から別の形式に変換するサービス。 jsonからyml、htmxからjsxへの変形、jsonやGraphQLのIDLからTypeScriptのinterfaceまでも、ブラウザ上で生成することができる。 Roadmap.s
JavaScriptの小技集 - Qiita
はじめに 初投稿です。 知ってたら便利になる小技が無かったのでまとめました。 「小技が知りたい...だけど検索しても出てこない...！」 そういう時に役立ちます。 比較的古いバージョンのJSでは一部の小技が使えないかもしれません。 随時追加予定です。他に小技をご存じの方はコメント欄にGO。 おことわり この記事は、あくまで"こんなやり方もあるよ"と紹介しているだけなので、何でもかんでもこれらの小技を使うと、かえってコードの可読性を下げる可能性があります。コードサイズと可読性を天秤にかけてどちらが良いかを都度確認しましょう。 記事内の間違った部分の指摘等はこの記事のコメントや編集リクエストでして下さい。 当方コードゴルファーなので、バイト数短縮小技も入れていることをご了承ください（一応該当する節には＊をつけています）。 配列 配列の重複した値を削除1 const meta = ["foo",
JavaScriptは「参照渡し」をしないって本当？ - Qiita
概要 タイトルの答えはYES. JSを勉強し始めたばかりで、JSにおける値渡し/参照渡し/参照の値渡しの処理の違いがわかりませんでした。 調べていくうちに「え、JSって参照渡ししないんだ！？」となったので、ここに学んだことをまとめようと思います。 追記：いただいたコメントをもとに修正しました。コメントありがとうございます！ 結論 JSでの処理は「プリミティブ値は値渡し」「オブジェクトは参照渡し」と言われていますが、厳密には「参照渡し」はしません。 JSでは「参照の値渡し」(共有渡し、本文中では共有渡しに統一)が行われています。 値渡し、参照渡し、共有渡しとは 値渡し 引数に値を渡す時、変数の値をコピーして渡す処理。 呼び出しもとの変数は変化しません。 参照渡し 引数に値を渡す時、参照(=メモリ番地)で渡す処理。 変更が呼び出しもとに反映されます。 共有渡し 引数に値を渡す時、変数に格納され
【Qiitaで使用しているルールも紹介】textlintおすすめルールまとめ - Qiita
この記事は、Qiita株式会社のカレンダー | Advent Calendar 2023 - Qiitaの13日目の記事です。 はじめに textlintについて、皆さんはご存知ですか? 実はQiitaのエディタ機能(ベータ版)でも、使用されています! 今回は、textlintのおすすめのルールとQiitaで使用されているものも 一部公開していこうと思います! textlintとは? 以下公式より textlint is an open source text linting utility written in JavaScript. It is hard to lint natural language texts, but we try to resolve this issue by pluggable approach. 簡単に説明します。 textlint(テキストリント)とは
async/awaitにおけるエラー処理を実行の順番から整理する - Qiita
はじめに promiseを使うとき、いつもpromiseメソッドチェーンで記載していますか？ async/awaitを利用していますか？ もちろん状況によって両方書くのが殆どだとは思うのですが、私はasync/awaitの方が同期的な書き方ゆえに読みやすいため、なるべくそちらで記載しています。しかしながら、エラーハンドリングが理解できていなかったため、エラーの所在を突き止めるのに苦労してしまいました。 そのため、これを機にasync/awaitにおけるエラーハンドリングについて備忘録的にまとめておきます。 この記事のまとめ; catchされるエラーはrejectのみか、throwされたエラーも含まれるか →両方catchできる async関数における処理の順序、awaitがある場合とない場合 →awaitがない場合には同期的に処理が実行され、catchできなくなる エラー処理を外側に伝播し
【図解】1から学ぶ JavaScript の 非同期処理 - Qiita
はじめに JavaScriptで非同期処理を書くシーンは数多くあると思います。 なのに、今までなんとなく使用してきました。これを機会にちゃんと勉強したいと思い体系化してまとめました。 それだけだとタダのメモになってしまうので、なるべく初学者の人が理解しやすいように書きました。 自分はこの記事を書くことで、JavaScriptの躓きポイントの代表格である非同期処理（Promise や async/await ）についても理解が深まったのでいい内容だと思ってます。長いけど。 主に初学者の方に読んでいただけたら幸いです。 JavaScript上級者の方は。何か間違っている記載があれば是非コメントください。 同期処理と非同期処理 まずは用語の定義からです。 同期処理は、最初のコードから次のコードへと順次処理（実行）されていくことです。 対して、非同期処理とは、ある処理が終了するのを待たずに、別の処
jQueryへの別れ：現代的な開発のための必須JavaScriptメソッド - Qiita
はじめに 私は長い間レガシーコードと共に仕事をしてきましたが、jQueryの重要性は依然として頻繁に話題に上がるトピックの一つです。ライブラリ自体は便利なままですが、それは別の時代のニーズを完璧に満たしていました。 現在、私たちは既にES2023について話していますが、過去にjQueryがカバーしていたほとんどの機能は、すでに2015年にリリースされたES6に取り込まれています。 ES6の標準は既に広範にサポートされており、96％のレベルに達しています（出典：caniuse.com）。そのため、特に要素の選択、スタイリング、アニメーション、データの取得などの基本的なタスクについては、ライブラリの使用を見直す良いタイミングかもしれません。 以下のトピックは、いくつかの標準的なjQueryのパターンと、それに相当するバニラJavaScriptでの手法を示す参考資料として役立つと思います。 要素
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScriptのthisもこれで完璧！呼び出し方で変わる5つのパターン - Qiita
「大学生が疑問に思ったC言語の文字列型：その謎を解く」 - Qiita
「JavaScriptで要素をドラッグして移動する簡単な方法」という記事が初耳だらけだった件 - Qiita
イベントハンドラの関数名についての雑記 - Qiita
async/await 比較（C#, JavaScript, Python） - Qiita
ESLintのルールから考えるJavaScriptのundefined判定 - Qiita
JavaScript / TypeScript の豆知識 10 選 - Qiita
