[B! JavaScript] s12btのブックマーク

やっぱりwebpackがわからない（エピソード1）

やっぱりwebpackがわからない（エピソード2）、そもそもnpmからわからないを公開しました。 webpackがわからない最近はViteが注目されだして、実際にとても良いビルドツールです。Vue.jsのEvan Youさんが開発しただけのことはありますね。ネーミングもイカしてます。しかし、だからといって、では開発環境にViteを採用しようと簡単にはできないのが、業務の辛い所です。新しい技術を採用して、「わしが全責任を引き受けるぜよ」というThe 男気！な人はなかなかいません。したがって、当分はwebpackを使い続けることになるのですが、これが未だによくわからないという人が意外と多いです。フロントエンドプログラミングの初心者に近い人などは、この段階でつまずくことにより、すっかり自信をなくしてしまうこともあります。ですが一先ず安心してください。webpackを含むこれらフロントエンド

s12bt 2022/01/30

javascript

リンク

[JavaScript]初心者が初見で必ずthinking顔になるもの特集 - Qiita

初心者が見た瞬間になるもの特集です。小テクだったり、省略記法だったり、、実際私も出会ってになりました！追記即時関数のところで説明にある他には、+や-等でも動きます。の"等"が気になった方に朗報です。こちらの記事で"等"を知ることができます！！ [JavaScript] "!function() {}()"以外の即時関数を紹介するぜよろしければ覗いてみてください！ !! is 何 booleanへの型変換。例 const obj = { hoge: "hoge" } function hasHoge() { return !!obj.hoge // => true } 論理否定（！）を二つ繋げて、boolean への型変換をしています。 !の結果を!で評価しているんですね〜。 JSON.parse(JSON.stringify(obj)) is 何ディープコピー。例

s12bt 2020/04/15

javascript

リンク

昨今のJavaScriptをレビューしたら全くわからなかった話 - aoma blog

はじめに最近JavaScriptのプルリクが来たので「よーしやったるでー」って感じでレビューしたんですが、まったく理解できずレビューになりませんでした。その時疑問に思ったことをメモします。。誰かの助けになれば幸いです。。これはもう引退やな。。 classの中で function って書くの省略してるの？ class TestClass { test() { 処理 } } function を省略して書けるのかなと思ったらそうではない。むしろ書いてはいけない。下記はエラーになる。 class TestClass { function test() { 処理 } } PHPに慣れてるからか、もやもやする。 (a, b) => は無名関数なのはわかったけど function(a, b) じゃダメなの？ (a, b) => は無名関数で function(a, b) と同じ。好みの問題

s12bt 2019/09/14

javascript

リンク

仕事ですぐに使えるTypeScript — 仕事ですぐに使えるTypeScript ドキュメント

注釈本ドキュメントは、まだ未完成ですが、ウェブフロントエンドの開発を学ぶときに、JavaScriptを経由せずに、最初からTypeScriptで学んでいく社内向けコンテンツとして作成されはじめました。基本の文法部分以外はまだ執筆されていない章もいくつもあります。書かれている章もまだまだ内容が追加される可能性がありますし、環境の変化で内容の変更が入る可能性もあります。書籍の原稿はGitHub上で管理しております。もしTypoを見つけてくださった方がいらっしゃいましたら、 GitHub上で連絡をお願いします 1 。reSTファイルだけ修正してもらえれば、HTML/PDFの生成までは不要です。フィードバックなども歓迎しております。 1 https://github.com/future-architect/typescript-guide/pulls

s12bt 2019/06/13

リンク

Expert led courses for front-end web developers. | egghead.io

Learn Modern Web Development in a Fraction of the TimeSharpen your skills and stay current with the modern stack. Start Today. Your deep catalog of byte-sized courses Get access to 1000s of to the point, practical video lessons on modern web development. egghead courses are focused and don't waste your time. There's no meandering, no fluff, no filler. Just the best, most relevant content for moder

s12bt 2019/05/05

リンク

JavaScriptで大量のオブジェクトの当たり判定を効率的にとる - Subterranean Flower Blog

ゲームなどのコンテンツにおいて、「当たり判定」から逃れることはできません。オブジェクトとオブジェクトが衝突したかどうかという判定は、インタラクティブコンテンツにおいて最も重要な部分になるからです。当たり判定の実装自体は難しくありません。ですが、素朴な実装ですと、対象となるオブジェクトが大量である場合に、十分なパフォーマンスが出ません。これはオブジェクトの多い、現代的なゲームでしたり、弾幕シューティングなどを作るときに大きな障害となります。この記事では、大量のオブジェクトの当たり判定を処理する、効率的な方法について紹介します。まずは素朴に実装してみる当たり判定の処理を語るには、ある程度ゲームの骨組みのようなものが必要になってきます。もちろんクラスなどを使わないベタ書きでもよいのですが、大変読みにくくなってしまいます。ですので、今回は、まず簡易的なゲームエンジンのようなものを作って、そ

s12bt 2017/12/06

javascript

リンク

ECMAScript 6 compatibility table

V8 SpiderMonkey JavaScriptCore Chakra Carakan KJS Other ⬤ Minor difference (1 point) ⬤ Small feature (2 points) ⬤ Medium feature (4 points) ⬤ Large feature (8 points) Compilers/polyfills Desktop browsers Servers/runtimes Mobile Feature name Current browser ES6 Trans- piler Traceur Babel 6 + core-js 2 Babel 7 + core-js 2 Babel 7 + core-js 3 Closure 2020.06 Closure 2020.09 Closure 2021.08 Closure 20

s12bt 2017/09/14

リンク

はてな教科書 JavaScript編

はてな教科書JavaScript編講義の目的 JavaScriptについて、自分で調べて学習するための基礎知識を身につけるリファレンスをひけば良い部分は覚えない話の流れ JavaScriptの言語コア部分構文とか WebとJSにまつわるあれこれ DOM 非同期プログラミング Ajax jQuery フロントエンド設計 Node.js 駆け足で進めるので、速すぎるなら遠慮せず言ってください！ LICENSE この作品はクリエイティブ・コモンズ表示 - 非営利 - 継承2.1日本ライセンスの下に提供されています。

s12bt 2016/10/06

JavaScript

リンク

clipboard.js

Why Copying text to the clipboard shouldn't be hard. It shouldn't require dozens of steps to configure or hundreds of KBs to load. But most of all, it shouldn't depend on Flash or any bloated framework. That's why clipboard.js exists. Install You can get it on npm. npm install clipboard --save Or if you're not into package management, just download a ZIP file. Setup First, include the script locat

s12bt 2016/09/27

クリップボードにコピー

JavaScript

リンク

console.logまとめ 2016年夏 - Qiita

console.log関連についてまとめました。モダンブラウザであればどれも使用できると思いますが、基本出力結果等はchromeで確認したものです。 console.hogehogeのいろいろ基本引数を入れることで出力結果をカスタマイズできます console.info、console.warn、console.error それぞれで見た目を変えることができます。 console.assert 式を評価してfalseの場合にログ出力します。 console.count ログの出力結果が同じ場合にカウント数が自動的に増えていきます。 console.dir オブジェクトのプロパティの中身をログに出力します。 console.dirxml HTMLとかXMLの要素を渡すと、下の要素が全部見れるようになります。 console.group、conosle.groupCollapsed co

s12bt 2016/08/18

javascript

リンク

JavaScript Primer - 迷わないための入門書 #jsprimer

JavaScript Primer 迷わないための入門書 Tweet Watch Star Twitterのハッシュタグ: #jsprimer これからJavaScriptを学びたい人が、ECMAScript 2015以降をベースにして一からJavaScriptを学べる書籍です。プログラミングをやったことがあるが、今のJavaScriptがよくわからないという人が、今のJavaScriptアプリケーションを読み書きできるように書かれています。初めてのプログラミング言語としてJavaScriptを学ぶ人は、まずは「はじめに」から読んでみてください。書籍版このウェブサイトの内容はアスキードワンゴから書籍として出版されています。書籍版の内容はウェブサイト版と同一ですが、本として読めるように最適化されています。書籍版は次のサイトから購入できます。 Amazon 達人出版会（電子書籍版

s12bt 2016/06/30

JavaScript

リンク

第1回　TypeScriptの概要

TypeScriptとはこの連載の目的はTypeScriptの基本的なコードの書き方を初歩から学ぶことである。プログラミングの経験がない読者を対象としているので、パソコンの基本操作ができるぐらいの前提知識があれば読み進められるようにできるだけやさしく解説していくこととする。現在、TypeScript関連の資料にはJavaScriptの知識を前提として、JavaScriptとの差分を掲載しているものが多いが、ここではそういった前提を設定せずに1からTypeScript（とJavaScript）を学ぶこととする。初回の恒例として、TypeScriptの概要がこの後に続くのだが、能書きはいいからとにかくやってみたいという方は、この先を飛ばして「いちばん簡単なTypeScriptのプログラム」に進んでもらって構わない。さて、その「TypeScriptとは」なのだが、ひと言で表すなら「Java

s12bt 2016/06/28

2年前の記事だけど中途半端にjs知っててTSやってみようと思ってるときに嬉しい記事。

リンク

HugeDomains.com

Captcha security check ectjs.com is for sale Please prove you're not a robot View Price Processing

s12bt 2016/03/08

テンプレートエンジン

リンク

Spirit - The animation tool for the web

Spirit Studio uses keyframes, just like other industry-standard animation tools. Simply change an element attribute, set a keyframe, rinse and repeat. It's that easy!

s12bt 2016/02/12

かわいい

JavaScript

リンク

JavaScriptで位置情報を取得する方法(Geolocation API)

ユーザーの現在位置を取得現在位置を取得するサンプルデモを見るには、下記ページにアクセスして下さい。このブログがあなたの位置情報を取得してもいいか、という確認が表示されるので、許可すると、あなたの現在位置(緯度、経度の座標)の取得を開始、表示します。サンプルデモを見る現在位置を取得するには、ユーザーのブラウザが、Geolocation APIという機能に対応している必要があります。Geolocation APIとは、簡単に言うと、端末の位置情報をやり取りするシステムです。GPSに対応しているスマホだけでなく、現在位置を設定できるデスクトップPCでも利用可能です。判別方法は簡単です。Geolocation APIに対応している端末の場合、navigator.geolocationというオブジェクトが最初から存在するので、これの有無で判別すればいいだけです。 JavaScript // G

s12bt 2015/12/14

リンク

Babel · The compiler for writing next generation JavaScript

Babel is a JavaScript compiler.Use next generation JavaScript, today. Babel 7.24 is released! Please read our blog post for highlights and changelog for more details!

s12bt 2015/05/16

リンク

DOM Performance (JSNext Bulgaria)

In the client-side development we manipulate the DOM very often. Some of these manipulations take some time to execute, others take even more time. In a complicated JS-based software, it is very important to find the optimal approaches in order to get best performance. We will meet few very common cases, where standard DOM manipulations are very expensive, and we will see what is the optimal way t

s12bt 2014/11/25

リンク

Tristan (T4T5)

My latest side project is Codespace. A new beautiful cross-platform snippet manager.

s12bt 2014/10/03

かわいいalert(); bowerで入っちゃうのうれしいなぁ。

JavaScript

リンク

スクロールやクリックした際に、おおっ！と思わせるクリエイティブな7つのエフェクトがかっこいいっ！

ユーザーがページを表示し、スクロールやボタンをクリックした際に、おおっ！と思わせるクリエイティブなエフェクトを7つ紹介します。 Inspiration for article intro effects 7つのエフェクトをアニメーションgifにしてみました。ページはフルスクリーンサイズの画像が最初に表示され、そこをスクロールボタンクリックでさまざまなエフェクトがおきます。派手すぎず、センスあるかっこいいエフェクトばかりです！各エフェクトのソースは上記ページからまとめてダウンロードできます。

s12bt 2014/05/27

リンク