GSAP入門 - アニメーション制作のための高機能なJSライブラリ（前編） - ICS MEDIA
JavaScriptライブラリの「GSAPジーサップ」はウェブサイトのモーション制作に役立ちます。GSAPは高機能であり、実行性能が良好で、互換性も高い利点があります。 始点と終点の間を補間することでモーションを実現することは「トゥイーン」と呼ばれます（Betweenが語源）。トゥイーンの機能を提供するJSライブラリは多くの種類が存在しますが、その中でもGSAPは評判が高く、機能の多さでは群を抜いています。当サイトの記事『トゥイーンライブラリの比較検証』でも、類似のライブラリに比べて性能が高いことを確認しています。 旧TweenMax時代から数えてGSAP利用歴18年の筆者が、GSAPのおさえておくべき最低限の使い方から、現場で役立つテクニックを紹介します。 ▼GSAP公式サイト GSAP入門は前後編の2回にわたり解説します。前編では基本的なGSAPの使い方を中心に説明します。 GSAPの
Node.jsのバージョン管理にVoltaを推したい
Volta とは Voltaとは、JavaScript ツールマネージャーです。 タイトルでは Node.js のバージョン管理としていますが、 npm・yarn のバージョン管理も行うことができます。 公式サイトでは、「The Hassle-Free JavaScript Tool Manager（手間のかからない JavaScript ツールマネージャー）」と紹介されています。 チームの Node.js のバージョン管理を Volta に統一したところ非常に DX が上がり、Volta の恩恵を感じています。 この記事では、開発者の Volta 人口を増やすべく Volta の紹介と使用方法について解説していきたいと思います。 なかなか詳しく解説している日本語のソースはないので、公式ドキュメントを読んで適宜和訳しています。 公式ドキュメントを読むのがめんどくさいという人に読んでいただい
オープンソース開発者が広く使用されている自分のライブラリを改ざん、大量のプロジェクトに影響 | ソフトアンテナ
オープンソース開発者が広く使用されている自分のライブラリを改ざん、大量のプロジェクトに影響 2022 1/10 開発者Marak Squires氏が、広く使用されている自分自身が作成したオープンソースライブラリ"faker.js"と"color.js"を意図的に破損させ、これらのライブラリに依存している多数のプロジェクトが影響を受けているとBleepingComputerが報じています。 不正なライブラリは「LIBERTY LIBERTY LIBERTY」という3行のテキストを出力するほか、奇妙な文字や記号を無限に出力するようになるとのこと。BleepingComputerはこの動作が、ライブラリの開発者Marak Squires氏が意図的に行った悪質なコミットが原因であることをつきとめます。 Bleeping Computerは、2020年11月にGitHubに投稿されたSquires氏
webpack で JavaScript と CSS を minify する単純な例 | knooto
JavaScript と CSS を minify する手順 1. 作業フォルダ上で npm init -y コマンドを実行して package.json を生成します。 2. 作業フォルダ上で npm install --save-dev webpack webpack-cli css-loader mini-css-extract-plugin optimize-css-assets-webpack-plugin コマンドを実行して必要なライブラリを導入します。 css-loader は JavaScript 上で CSS を require や import できるようにするものです。 mini-css-extract-plugin は CSS の内容を JavaScript とは別ファイルにビルドするものです。 optimize-css-assets-webpack-plugin
絶対つまづかないwebpack入門 - JavaScriptのモジュールバンドラ - ICS MEDIA
webpack（ウェブパック）とはJSファイルをまとめる高機能なモジュールバンドラー。まとめることでウェブページのHTTPリクエストの数を減らしたり、高度なウェブアプリケーションの開発に役立ちます。 連載ではTypeScriptやBabelなどのES2015+の環境構築、ReactなどのJSライブラリの設定方法を網羅。サンプルファイルで詳しく解説します。 webpackの入門記事は他のサイトにもありますが、対象バージョンが古くて使えなかったりします。検索結果の上位の野良記事を参照にしたら古いバージョンの内容ばかり。解説記事通りにやったのにうまく動かない･･･なんて困った方も多いのではないでしょうか。本記事は常に最新版に対応させているので、安心して読み進めてください。 ※本記事では2025年5月現在のwebpack 5（2020年10月リリース）以上で解説しています。 本記事で解説しているこ
ESLintでJavaScriptの構文チェックを始める ｜ Tips Note by TAM
ESLint の考え方は「Everything is pluggable」。 全てのチェック項目は自由にON/OFFの切り替えが可能で、独自のルールを作成して追加することも可能です。 また既存のルールについては比較的ドキュメントが充実しています。 ・eslint/docs/rules at master · eslint/eslint JSCS 構文チェックも可能ですが、エラーが発生した箇所をフォーマットに合わせて自動修正させることが可能です。 2016年4月、JSCSはESLintに統合されることが発表されました。 すぐできるESLintの使用環境 ESLint はカスタマイズの自由度がとても高い構文チェックツールですが、 複雑なカスタマイズをしようとすると、それなりに手間がかかります。 使ったことが無い方は、とりあえず手間を掛けずに一度ツールを使ってチェックしてみたい、 と思われるかも
「エンドユーザー自らシステムを構築する時代」を卓越したJS技術で現実化するマッシュマトリックスのクラウドサービス
JavaScriptのスペシャリストとして、ノンプログラミングでアプリケーションを作成するためのフロントエンドエンジン（2007年度の「IPA 未踏事業」に採択）などを開発してきた冨田慎一氏。「業務に合わせてエンドユーザー自身が構築できる」という理想のシステムを提供するため、2008年マッシュマトリックス社を設立してJavaScriptの腕を振るい続けている。本稿では、冨田氏がその理想に考え至った経緯や現実とのギャップ、クラウドサービスの将来像などを聞いた。 本記事の目次 （→シリーズの特集ページ） ▶ 1か月で数万ダウンロードのエンタープライズ向けnpmパッケージを開発 ▶ システムの調達・構築にITエンジニアを介さなくてもよくなってきている ▶ イメージは執事のような自分専用サービス ▶ サービスは自由度と理解のしやすさのバランスが肝心 ▶ エンドユーザー・開発者・コンシューマ・エンタ
React + BrowserifyプロジェクトでJS/CSS/HTMLを圧縮(Minify)する - Umi Uyuraのブログ
ReactとMaterial UIを組み合わせると、それだけでBrowserifyで結合したJavaScriptファイルが1MB超えてしまうので、やっぱり圧縮とかした方が良いのかな―と思い、やり方を調べてみました。 ※2015/08/03更新 Licensifyを開発された @t_wada さんから改良の連絡をいただいたので、Licensifyの最新版1.4.0をもとに内容を更新しました。 Licensify - Nodeモジュールのライセンスコメントを生成する JSファイルを圧縮すると、ライセンスが記載されているコメントが消えてしまうという問題があるということで、本題の前に、Browserifyと組み合わせて、読み込んだNodeモジュールのライセンスコメントを生成してくれる Licensify を試しておくことにしました。 インストールはnpmから。 $ npm install lice
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - jsx-eslint/eslint-plugin-jsx-a11y: Static AST checker for a11y rules on JSX elements.