フロントエンドやるなら入れておくべきESlintってなに？ - Qiita
プログラミング勉強日記 2020年11月28日 昨日の記事でPrettierについて扱ったが、Prettierと合わせて使用することのできるESlintについて紹介する。 ESlintとは ESlint(読み方：「イーエスリント」)は、JavaScriptやTypeScriptなどの静的解析ツールである。ESlintを導入することで、単純な構文エラーやプロジェクト固有のコーディング規約を定義することができる。厳密なルールを定義することで、複数人で開発する場合でもシステム全体のコードの一貫性を維持することができる。 ESlintの特徴 自由に多くのルールを設定できる 独自ルールを作成するAPI 固有のライブラリー、フレームワーク、および実践のルールを持つ多数のプラグイン ES6、ES7、JSXの内蔵サポート 迅速に開始できるように、推奨ルールだけでなくサードパーティの設定利用が可能 Subl
boxednode - nodeエンジンとJavaScriptファイルをまとめて実行ファイル化 MOONGIFT
nodeを使って作られたツールが増えています。npmでインストールすればいいのですが、node自体のバージョンアップも激しく、追従するのも大変です。開発者であれば構わないでしょうが、開発者以外の方がnodeをセットアップして使い始めるのはちょっと敷居が高いです。 そこで使ってみたいのがboxednodeです。boxednodeを使えばnodeの実行エンジンとJavaScriptファイルをまとめてパッケージしてくれます。 boxednodeの使い方 パッキングする際のコマンドです。 $ boxednode -s example.js -t example パッキングしたら実行権限が付いているので、そのまま実行できます。 $ ./example こんにちは、世界！ boxednodeはnodeのコンパイルから実行するので、バイナリができあがるまでに時間がかかるのが難点です。なおバイナリサイズは
Writing custom TypeScript ESLint rules: How I learned to love the AST
Writing custom TypeScript ESLint rules: How I learned to love the AST In this blog post, we’re going to learn how to write a custom ESLint plugin to help you with otherwise manual tasks that would take you days. The task? An eslint rule that adds generic to enzyme shallow calls, so we avoid type errors about our components during tests. Let’s dive into the world of ASTs: They’re not as scary as th
Testing UI - Next JS, Typescript, Jest and React Testing Library
Testing UI - Next JS, Typescript, Jest and React Testing Library Intro As you know, React is just JavaScript. That means it can be tested just like any other JS application. There are lots of testing libraries and test runners out there, but I find that the best setup is Jest + React Testing Library. I use it on a daily basis at work and on my side projects. Worth mentioning that this is also a st
A Guide to Web Scraping With JavaScript and Node.js | HackerNoon
Too Long; Didn't Read A Guide to Web Scraping With JavaScript and Node.js demonstrates how to use the Axios and Cheerio packages to extract data from a simple website. We’ll be using a headless browser, Puppeteer, to retrieve data from the web page that loads content via JavaScript. The data extraction technique is becoming increasingly beneficial in retrieving information from websites and applyi
2020年でJavaScript学ぶならきっとブラウザ向けJSガン無視していきなり初手node.js（ただし暫く何も足さない）がいいんじゃないかというメモ
※ @mizchi さんのアンサー記事「プログラミング初心者のための JavaScript と Node.js の歴史、それを踏まえた勉強方法」 もこの後にあわせてどうぞ。 https://zenn.dev/mizchi/articles/3789a101dae388d98159 Python3とPHP7をちょぼちょぼとやっている個人がJavaScript(2016年以降)/node.js/JS系ライブラリ/JS系Webフレームワーク/TypeScript等を攫っている中で一つ思ったことをメモった。JavaScriptやるなら絶対node.jsの実行環境揃えてからがいい、そうしないでJSやるくらいなら汎用性信じてPython3一択に絞った方がいい、と思ったという件です。 具体的には、以下の構成のみでJavaScriptの開発演習をすればいいんじゃないか、という話です。 続きを読む
Elsa - 小さくてセキュアなJavaScript/TypeScript実行環境 MOONGIFT
nodeやWebブラウザ上のJavaScript実行エンジンとしてはv8が最もよく知られています。かつてに比べると圧倒的に拘束で、JavaScriptがWebアプリケーションなどで十分に使えるようになったのはv8エンジンのお陰でしょう。 そんな中、新しいJavaScript/TypeScript実行エンジンとしてElsaを紹介します。言語はGoを採用しています。 Elsaの使い方 実際に使っているところとしては、普通に使えますといった感じです。 $ go run main.go run js/00_core.js { "FSCwd": 5, "FSDirExists": 4, "FSExists": 3, "FSMkdir": 9, "FSRead": 2, "FSRemove": 7, "FSStats": 6, "FSWrite": 1, "Fetch": 20, "Log": 10,
Web scraping with JS
Brief overview of what we gonna do today If you’ll try to google “web scraping tutorial” you’ll get a bunch of tech articles on the subject that tells you how to achieve the result using python. The toolkit is pretty standard for these posts: python 3 (hopefully not second) as an engine, requests library for fetching, and Beautiful Soup 4 (which is 6 years old) for web parsing. I’ve also seen few
2020-10-27のJS: React 17、Node v15.0.0、LibSass is Deprecated
JSer.info #511 - React 17が正式にリリースされました。 React v17.0 – React Blog React 17では新しい機能はありませんが、今後のアップデートを段階的に行いやすくするための仕組みが追加されています。 今後React 18がリリースされた際に、React 17とReact 18が一つのアプリ内で同時に実行できるようにするための仕組みを追加しています。 これは、アプリ内で段階的にReactをアップデートできるようにするのが主な目的です。 この変更に関連して、React内でのEvent Delegationの仕組みが変更されています。 今まではDocument nodeに対してイベントを移譲していましたが、React 17からはrenderしたRoot nodeに対してイベントを移譲します。 その他の破壊的な変更としては、event pooli
webpack v5がリリースされたので、現状をまとめてみた
10/10 に webpack v5 がリリースされたので、今回は変更点や気をつけたい点をまとめてみました。 プロダクションで使うのはまだ早いかも(2020/10/27時点) webpack v5 のリリースは行われたが、まだバグが多くあり、webpack で使用する loader や plugin は対応が追いついていません。 パッとwebpack 5 関連の Issueを眺めるだけでも、まだ多くの問題があることがわかります。 なので、webpack v5 を使用するのは安全にいきたければ 1,2 ヶ月ほど待ってもよいと思います。 いまはこのバグ対応によりすでに webpack のバージョンは v5.3.0 になっています。 試して見たい方は v4 から v5 へのマイグレーションガイドを参考にするとよいです。 周辺ツールの現状 webpackを使用するにあたって特に重要な webpac
Async Clipboard APIでJavaScriptからクリップボードを操作する
JavaScriptからのクリップボードの操作は、長いあいだ開発者たちに切望されていました。かつてはFlashを使って実現するハックなどがありましたが、各ブラウザがexecCommandによるクリップボード操作を実装したことで、現在は落ち着きつつあります。 ただ、APIが綺麗に整備されているとは言いにくく、あまり現代的ではありません。そこで、スマートかつ現代的にクリップボードを扱うことができる、Async Clipboard APIの実装が進みつつあります。 Async Clipboard APIはその名の通り非同期でクリップボードを扱うAPIです。Async Clipboard APIはPromiseを返すので、直感的に扱えるようになっています。 従来のAPIでも、execCommandを用いることによってクリップボードを操作することができました。しかし、バグが多くブラウザ間の整合性が取
TypeScript による Isomorphic な API Client 開発 - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは、フロントエンドエキスパートチームの @koba04 です。 本記事では、kintone の REST API を使うためのクライアントである @kintone/rest-api-client (以下 rest-api-client) の構成や工夫した点について紹介します。 本記事は rest-api-client の 1.6.0 のバージョンに基づいています。 @kintone/rest-api-client とは rest-api-client とは、kintone が提供する REST API を利用するためのクライアントライブラリです。 GitHub 上は kintone/js-sdk の Monorepo の 1 パッケージとして開発されています。 kintone/js-sdk での Monorepo 開発については下記の記事を参照してください。 https://blo
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
css-loader | webpack
Creating a JavaScript promise from scratch, Part 5: Promise.race() and Promise.any() - Human Who Codes
Learning Webpack Concepts and Creating your Custom Webpack Plugin.
フォルダ内の特定拡張子のファイルを全部置換するDeno/JavaScriptプログラム on GitHub
Scripting from Javascript to Typescript
JavaScript: Next.js 10 zielt auf das dynamische Laden von Bildern bei Bedarf
ESLintの設定をパッケージ化してnpmで公開する
JavaScript-based address bar spoofing vulns patched in Safari, Yandex, Opera