Grid.js Advanced Table PluginGrid.js is a Free and open-source JavaScript table plugin. It works with most JavaScript frameworks, including React, Angular, Vue and VanillaJs.
Grid.js - Advanced JavaScript table plugin
Grid.js Advanced Table PluginGrid.js is a Free and open-source JavaScript table plugin. It works with most JavaScript frameworks, including React, Angular, Vue and VanillaJs.
import文で画像やCSSを読み込むのはECMAScript仕様違反か - uhyo/blog
近頃のJavaScript開発は、モジュールとして書かれた複数のJavaScriptファイルをimport文やexport文を通じて連携させるのが基本です。また、それらのファイルはWebpackに代表されるバンドラによって事前に処理され、import文の解決・ファイルの結合といった前処理を施されるのが普通です。まったく、各ファイルが他に影響を与えないように(function(){ ... })()で囲んで文字列連結していた時代が懐かしいですね。 さて、import文の解決を担当するバンドラは、大抵JavaScriptプログラム以外のものを読み込む機能を備えています。Webpackならばloaderと呼ばれるものですね。例えば、style-loaderやcss-loaderが持つCSS Modulesの機能を使うと次のようなプログラムを書くことができます（Reactの例）。 import s
JavaScriptの歴史については「JavaScript: The First 20 Years」を読む
JavaScript/ECMAScriptというプログラミング言語の歴史について書いた文章はWikipediaなどいろいろなものがあります。 その中でも、ECMAScript 2015のSpec EditorであるAllen Wirfs-Brockによって書かれた”JavaScript: The First 20 Years”が特におすすめです。 JavaScript: The First 20 Years JavaScript: The First 20 Years | Zenodo “JavaScript: The First 20 Years”はHOPL IV - History of Programming Languages向けに書かれたPaperです。 JavaScriptの誕生からECMAScriptの策定、ECMAScript/JavaScript各バージョンでの違い、ブラ
JavaScriptコードの静的解析ツール「ESLint v7.0」リリース | OSDN Magazine
JavaScriptの静的コード解析ツール「ESLint」開発チームは5月8日、最新のメジャーリリース版となる「ESLint v7.0.0」を公開した。 ESLintはJavaScriptコードの問題を検出できる静的なコード解析ツールで、さまざまなテキストエディタに組み込まれている。ほとんどの問題に対して自動的なコード修正が可能で、また構文解析を行っているため、検索・置換型で発生するような誤認識などのエラーが起きないという。 ESLint v7.0は2019年6月に公開されたESLint v6.0に続くメジャーリリース。Node.jsのバージョン8系が2019年12月にサポート終了を迎えたことを受け、最新版ではそのサポートが削除された。 コードルールでは、複数のルールでbigintを認識するようにアップデートした。また、Node.js/CommonJSルール10件が非推奨となった。esli
next.js の amp モードで tailwind.css を purgecss と合わせて使う
このリポジトリ でやったこと。 やろうとしたこと tailwind.css は Utility First と銘打った CSS フレームワークで、コンポーネント化を前提としたモダンフレームワークと相性がいいです。今回は next.js の amp-mode で tailwind を使おうとしてみました。 Tailwind CSS - A Utility-First CSS Framework for Rapidly Building Custom Designs 問題 前提として、 amp には inline css の容量制限があり、75kb を超えると AMP と認識されなくなります。 tailwind はビルドして使うのが前提のフレームワークですが、全部入りの tailwind.min.css は 1.3 M あります。これでは到底、75 kb に収まりません。 AMP の CSS
HTMLの属性にディレクティブを指定してリアクティブな動作を実装できるJavaScriptフレームワーク・「Alpine.js」 - かちびと.net
Alpine.jsはHTMLの属性にディレクティブを指定してリアクティブな動作を実装できるJavaScriptフレームワークです vue.jsやreact.jsといったフレームワークのリアクティブ且つ宣言的な性質を低コストで提供してくれる、というもの 開発者はTailwind.cssのJS版のようなもの、と説明しています Alpine.jsでは13のディレクティブと、5のマジックプロパティと呼ばれるものを使う事が出来ます。Vue.jsとほぼ同じ機能を使える、という認識で良いと思います <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v1.10.1/dist/alpine.js" defer></script> ↑ まずはスクリプトを読みこみます 試しに何か作ってみましょう <div x-data="{selected:nul
JavaScript Primerを出版しました！/JavaScript Primerはなぜ書かれたのか？
この3つの原則は書籍の構成にも現れています。 第一部の基本文法で「書き方」を学び、第二部のユースケースで「作り方」を学べるようになっています。 「学び方」は、章としてではなく全体的な流れとして取り入れることにしました。 なぜなら、「学び方」自体は学びたいことによっても異なる方法を取る場合があります。 そのため、「学び方」で個別の章とするよりは、他の章で「書き方」や「作り方」と一緒に見たほうがよいと考えたためです。 たとえば、基本文法などの学び方にはMDNのようなリファレンスサイトを見たほうがいいし、 アプリケーションの作り方は実際のサイトなどを参考にしたほうがよいためです。 第一部と第二部がどのように書かれたのかをざっくりと振りかえってみます。 第一部: 基本文法 第一部: 基本文法はJavaScriptの基本的な文法について扱っています。 プログラミングの入門書で文法については避けること
Chromeの拡張機能を自作する - 虎の穴ラボ技術ブログ
こんにちは。虎の穴ラボのH.Hです。 突然ですが、皆さんは普段使っているブラウザは何でしょうか？ 私は普段からChromeを使っており、このブログもChromeを使って書いています。 先日ある拡張機能をChromeに入れるにため機能の説明を読んでいました。 説明の中にGithubのURLが記載され拡張機能のソースコードが公開されており、JavaScriptなどの知識があれば作成可能とわかりました。 またGoogleから簡単な拡張機能を作成するチュートリアルも公開されていました。 そこで、チュートリアルで公開されている拡張機能の実際に作ってみることにしました。 今回は拡張機能の作成した時の手順とデバッグの方法を説明していきます。 Chromeの拡張機能とは Chrome機能はChromeウェブストアなどからChromeに追加することで、標準には無い機能の追加を行うものです。 chrome.g
Node.js v14の主な変更点 - 別にしんどくないブログ
4/21 にリリースされた Node.js v14 の主な変更点を紹介します。 この記事では Changelog の Notable Change から一部を簡単に紹介します。 github.com TL;DR V8 が 8.1 になりOptional chining や Nullish coalescing が使えるようになった fs.promises が 'fs/promises' でロード可能になった ES Modules の警告が表示されなくなった 目次 TL;DR 目次 deps: update V8 to 8.1 JavaScript Optional chaining Nullish coalescing Intl.DisplayNames パフォーマンス fs: add fs/promises alias module module: remove experimental
Running Golang on the browser with WebAssembly and TinyGo
TL;DR This is the story of how I managed to expose my Golang chess API project cheesse as a WebAssembly binary, compiled using TinyGo, so JavaScript could use it without needing a server. The blogpost is optimised for helping others going through a similar exercise, rather than for readability, so expect a little too much of “if this, do this”. Sorry. What are all those technologies? WebAssembly A
現代ウェブフロントエンド（ウェブアプリケーション）について理解する唯一の方法｜erukiti
この記事は、ウェブ技術の開発者（Java, PHP, Ruby, Go... 全て含む）のうち、少しでもJavaScriptを触ったことがあるけど、現代ウェブフロントエンドというか、特にウェブアプリケーション —— React, Vue, Angular など—— が分からない人に向けて、たったひとつの理解方法を提示するものです。 追記: ちなみに果てしなくどうでもいいですが、今回の記事が記念すべき100記事目らしいです。（Noteさん！その手のヤツはいっそ自動で記事にバッヂを表示するとかしてくれるとうれしいです！） 対象読者は、Java, PH(以下略）などのコードと一緒に、ほんの少しでもJSのコードを触った、見たことがあるというレベル感の人なので、既にReact, Vue, Angular などでガリガリコードを書いている人は対象ではありません。 あとホームページ屋さんとかウェブコーダ
MediaPipeとTensorFlow.jsによるブラウザでの顔と手の追跡｜npaka
以下の記事を参考に書いてます。 ・Face and hand tracking in the browser with MediaPipe and TensorFlow.js 1. ブラウザでライブデモを試してください「facemesh」は、画像内の顔の境界とランドマークを検出、「handpose」は手を検出するパッケージです。これらのパッケージは小さく、高速で、ブラウザ内で実行されるため、データがユーザーのデバイスを離れることはなく、ユーザーのプライバシーが保護されます。 以下のリンクから、今すぐ試すことができます。 ・facemesh ・handpose これらパッケージは、マルチモーダル知覚パイプラインを構築するためのライブラリ「MediaPipe」の一部としても利用できます。 ・MediaPipe face tracking ・MediaPipe hand pose trackin
今あえてTypeScriptのビルド＆バンドルツールを探してみる | フューチャー技術ブログ
ちょっとしたフロントエンドの開発で、TypeScriptに最初から対応していて、簡単に使えるものは何かないかな、と調べてみたメモです。React/Vue/Angularの場合はそれぞれの初期化コマンドで何から何まで用意してくれます。Next.js、Nuxt.js、Gatsbyなども、これらのビルドのステップを簡略化するコマンドを提供しています。基本的にこれらのウェブフロントエンドを開発するときには、小規模・中規模ぐらいならあんまり気にしなくておまかせでもいいと思います。 今回は、それらのフレームワーク固有のビルドツールとは別に環境を作りたい人で、TypeScriptの環境が欲しい、ウェブの開発がしたい、という前提でいろいろ探してみました。 今回試してみたのは次の4つです。 Parcel Fusebox ncc Rome.js JavaScriptのビルドツールとはJavaScriptでビル
Snowpack vs. webpack: A build tool comparison - LogRocket Blog
LogRocket’s Galileo AI watches every session, surfacing impactful user struggle and key behavior patterns. Editor’s note: This post was updated on 14 March 2022 to include information relevant to Snowpack v3 and webpack v5. Few tools have been as central and important to the JavaScript ecosystem as webpack. Launched in 2012, the JavaScript module bundler has been a cornerstone of modern JavaScript
スタイルガイド - Vue.js
最終更新日: 2021年5月22日 このドキュメントは、 Vue 固有の記法についての公式なスタイルガイドです。もしあなたがプロジェクトにおいて Vue を使用する場合は、エラーや有益でない議論、アンチパターンを避けるための参考となります。しかし、スタイルガイドはすべてのチームやプロジェクトで理想とは限らないと考えていますので、過去の経験や、周囲の技術スタック、個人の価値観に基づいた上で必要に応じて慎重に逸脱することが推奨されます。 ほとんどのパートにおいて、基本的に JavaScript や HTML に対する提案はさけています。セミコロンやカンマの使用の是非はどちらでも良いです。 HTML の属性に対してシングルクォートかダブルクォートどちらかを利用するかもどちらでも良いです。しかし、特定のパターンにおいて Vue のコンテキストが役立つと判明した場合については、その限りではありません
ScalaコードからJavaScriptコードを生成できる「Scala.js 1.0」リリース | OSDN Magazine
ScalaコードをJavaScriptコードにコンパイルするツールを提供するScala.js開発プロジェクトは2月25日、正式版となる「Scala.js 1.0.0」を公開した。 Scala.jsはScala言語で実装されたコードをWebブラウザやJavaScriptランタイムなどで実行できるJavaScriptに変換するツール群。Scalaは強力な型付け機能を備えており、その特徴をWebアプリケーション開発などに生かせるという。また、高い最適化機能やJavaScriptランタイムとの互換性もあるという。ライセンスはApache License 2。 2013年にバージョン0.1が公開されて以来、約7年をかけてバージョン1.0.0に到達した。本バージョンではデフォルトでECMAScript 2015準拠のコードを出力するようになり、JavaScriptライブラリとの相互運用性を強化した。S
JavaScriptでエラーの原因となるHoisting（巻き上げ）、その仕組みをGIFアニメで分かりやすく解説
JavaScriptでエラーの原因となるHoisting（巻き上げ）はなぜ起こるのか、その仕組みについてGIFアニメーションで分かりやすく解説された記事を紹介します。 🔥🕺🏼 JavaScript Visualized: Hoisting by Lydia Hallie 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 JavaScript Hoisting（巻き上げ）の仕組みをGIFアニメで分かりやすく解説 Hoisting（巻き上げ）は、JavaScriptでのエラーの原因をGoogleで検索しても分からず、StackOverflowなどで質問した際に目にする用語の1つです。「そのエラーはHoisting（巻き上げ）が原因で発生している🙃」と言われることがあります。 Hoisting（巻き上げ）とは何のことでしょうか？
各種WebAPIの簡単な使い方と、組み合わせで実現する新たな体験・可能性を考える | ログミーBusiness
各種WebAPIの簡単な使い方と、組み合わせで実現する新たな体験・可能性を考える提供：LINE株式会社 2020年2月1日、「PWA Night CONFERENCE 2020」が開催されました。Web体験を進化させる、新しいWeb開発コンセプト「PWA」をテーマに、Web開発に携わるエンジニアたちが集まった本イベント。プレゼンテーション「Webでできる体験を考える会」に登壇したLINE株式会社の折原レオナルド賢氏は、既存のWebAPIを用いてできることや実現できるユーザー体験について、自身の経験や今回の発表に際して行った検証結果を用いて紹介しました。講演資料はこちら Webでできる体験を考える折原レオナルド賢氏：それでは「Webでできる体験を考える会」ということで始めたいと思います。去年の今頃、こんな記事を書かせていただきました。 もしかしたらこれによって今回呼んでもらったのかなと思
What's coming in ESLint v7.0.0 - ESLint - Pluggable JavaScript Linter
ESLint v8.x reached end-of-life on 2024-10-05 and is no longer maintained. Upgrade or consider long-term support options Published 20 Feb, 2020 under API Changes What's coming in ESLint v7.0.0 We want to share with you the significant changes that will be coming in v7.0.0 so you can better prepare for the changes and understand why the changes are necessary. Last week, the Technical Steering Commi
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - echamudi/opencv-wasm: Precompiled OpenCV 4.3.0 to JavaScript + WebAssembly for node and deno. 🦕
