webpack@5で入るPersistent Cachingについて - 技術探しwebpack は in-memory のみで今まで永続的なキャッシュを実装していませんでした。理由としては、パフォーマンスよりも安全性を優先していたためです。 cache-loader を使ったことがある人はわかるかもしれませんが、確かに速くなる一方、安全性が損なわれているのは事実です。 この機能は、webpack はデフォルトでファイルキャッシュをオンにはしませんがそれでもビルドの速度を上げたい場合に使う機能です。 以下がデフォルトの挙動となります。 modecache
2020-05-12のJS: ESLint v7.0.0、Next.js 9.4、npm 7の変更予定
JSer.info #487 - ESLint 7.0.0がリリースされました。 ESLint v7.0.0 released - ESLint - Pluggable JavaScript linter ESLint v7.0.0 の変更点まとめ - Qiita メジャーアップデートであるため、ビルトインルールの変更が含まれています。 eslint:recommendedのルールを更新、いくつかのビルトインルールのデフォルトオプションの変更、Node.js関係のビルトインルールをeslint-plugin-nodeへ移行などが行われています。 また、.eslint.jsをデフォルトでignoreしないように変更、--configや--ignore-pathオプションでのパスの扱いの変更、プラグインの読み込み元ディレクトリが.eslintrc.*を基準とする変更なども含まれています。 その
モダンJavaScript概論 − Node, npm, ECMAScript, Babel, Webpack | Hypertext Candy
2020.04.30 モダンJavaScript概論 − Node, npm, ECMAScript, Babel, Webpack この記事では、モダンな JavaScript を書くための前提として知っておくべき、いくつかのキーワードを紹介します。想定読者は、初心者 〜 jQuery なら書けるレベルの開発者です。これから React や Vue.js を学びたい方、または Web 開発の世界に飛び込む新人さんなどの学習の助けになれば、と思います。 「モダン」な JavaScript ここで言う「モダン」とはどういう意味でしょうか？ 「モダン JavaScript」という表現は数年前から目にしますが、大抵 ES2015（JavaScript の 2015 年バージョン）以降の JavaScript を指しているようです。確かに、const / let やアロー関数などの文法的な改善、A
Webページの状態を集中管理できる「Nuxt.js」のVuexストアを使いこなそう
本連載では、Webページのユーザーインタフェース（UI）フレームワーク「Vue.js」と、Vue.jsを利用してWebページを作成できるフレームワーク「Nuxt.js」の活用方法を、サンプルとともに紹介します。前回はWebページの一部分を部品として再利用できるコンポーネント機能を説明しました。今回は、Webページの入力内容や表示内容といった状態を集中管理できるVuexストアについて説明していきます。 はじめに Nuxt.jsは、Webページのユーザーインタフェース（UI）フレームワークであるVue.jsに、Webページの作成に必要なUI以外の追加機能をまとめて提供するフレームワークです。 Webページを複数のコンポーネントに分割できるJavaScriptフレームワークでは、あるコンポーネントの状態（入力／表示内容）を他のコンポーネントで利用する場合、不整合なく状態を共有する仕組みが必要とな
ブラウザとnode.jsに両対応したライブラリを作りたいときのWebpackレシピ集 - Qiita
概要 Webpackを使ってNode.jsとブラウザに両対応したライブラリを作るときのレシピ集です いろいろなレシピを見てWebpackによるライブラリ生成の挙動を理解することを目的としています ブラウザにもNode.jsにも両対応したライブラリを作りたい ブラウザとNode.jsに両対応したいとおもったとき、 両方同時に対応した1つのバンドルjsを作る【統合型】と、 ブラウザ用、Node.js用と別々にライブラリを出し分ける【出し分け型】の2パターンある。 本稿では主に**【統合型】**について説明する ライブラリのビルドに関するWebpack設定項目 レシピ集に行く前に、 まず、ライブラリのビルドに関する設定項目をざっくりみていく。 webpack.config.js 以下のような典型的なwebpack.config.jsの中でoutput以下の項目でライブラリ生成のためのパラメータを
末尾再帰による最適化 - Qiita
はじめに ES6 (EcmaScript 6)を試そうと、Babelのドキュメントを読んでいたところ、末尾呼び出し（Tail Call）の最適化をしていることにびっくり。公式リリース（2015年6月）から３ヶ月あまり経ってはいますが、ES6が末尾呼び出し最適化を仕様としてサポートしていることをようやく知りました。 現状で末尾呼び出し最適化をサポートしているブラウザはなく（ブラウザやaltJSなどのES6互換表を参照）、唯一、ES6からES5へのトランスパイラであるBabelのみが部分的（直接的な末尾再帰のみ）ではありながらサポートしているようですね。 今回の記事では、来たるES6時代（いまさらの感はありますが）に備えて、末尾再帰とその最適化について簡単に解説した上で、Babelを利用して実際にJavaScriptでの末尾再帰の最適化を実験してみたいと思います。 ざっくり概要 再帰関数 は関
完全無料！JavaScriptのWeb開発手法を学習できるYouTube動画コースの厳選まとめ！ -
どうも、まさとらん（@0310lan）です！ 今回は、JavaScriptをベースにしたWeb開発手法のトレンドを無料で学習できる海外のYouTube動画コースをご紹介します！ フロントエンドからバックエンドまでクオリティの高い動画コースを厳選しており、GitやFirebaseなどの予備知識も含めて多彩なコースをまとめました。 英語だから…と言って見ないのは非常にもったいないレベルの動画ばかりなので、ソースコードの動きをよく見ながらぜひ挑戦してみてください。 なお、JavaScriptの基本はpaizaラーニングの「JavaScript入門編」で学ぶことができますので合わせてチェックしてみてください！ ■Web開発の基礎を学ぶ まずはWeb開発を始める前に抑えておきたい基本的な知識を学習できる動画コースから見ていきましょう！ 主に、HTML / CSS / JavaScriptの3点を重点
JavaScriptのモダンな書き方 - ES2020のオプショナルチェーン、null合体演算子、動的import、globalThis等を解説 - ICS MEDIA
JavaScriptのモダンな書き方 - ES2020のオプショナルチェーン、null合体演算子、動的import、globalThis等を解説 JavaScriptの仕様であるECMAScriptは年次で仕様が更新されています。ECMAScript 2020（ES2020）は2020年6月にリリースとなりました。現行のすべてのブラウザでES2020の機能は利用できますが、フロントエンドエンジニアにとって使いこなしたい記法ばかりです。 本記事ではES2020に焦点をあて、JavaScriptの新しい記述方法のメリットと使いどころを解説します。 オプショナルチェーン Optional Chaining（オプショナルチェーンやオプショナルチェーニングと呼ばれています）とは、?.構文を用いてnullやundefinedになりうる値へ安全にアクセスできる仕組みです。 利用シーン nullやunde
dotJS 2019 - Bert Belder - Deno
Filmed at https://2019.dotjs.io on December 5-6, 2019 in Paris. More talks on https://dotconferences.com/talks A decade after Node.js was first announced, JavaScript and the web platform have evolved, and TypeScript has changed the way JS applications are developed. Deno is a new JavaScript/TypeScript runtime that was designed with all those new capabilities in mind.
Deno: Will It Replace Node.JS?
A decade after Node.js was first announced, JavaScript and the web platform have evolved, and TypeScript has changed the way JS applications are developed. Deno is a new JavaScript/TypeScript runtime that was designed with all those new capabilities in mind. EVENT: dotJS 2019 SPEAKER: Bert Belder PUBLICATION PERMISSIONS: Original video was published with the Creative Commons Attribution license
実践形式で学ぶ！JavaScript Bootcamp2019を開催しました！ | フロントエンドエンジニア
ニジボックスでは、社員のスキルアップを全力で応援！そんな取り組みの一つとして、社員であれば職種や職域に関係なく誰でも参加できるさまざまな勉強会を開催しています。 それらの勉強会では、スペシャルゲストが講師として指導をしてくださることも！ 昨年の年末、12月23日に行われたJavaScript Bootcamp2019では、株式会社リクルートホールディングスの本社ビルの会議室を借りて、株式会社リクルートテクノロジーズのアプリケーションソリューショングループのグループマネジャーをされている古川陽介さんにご指導いただきました。 講師は、Node.jsグループコミュニティの代表 古川陽介さん 今回、JavaScript Bootcamp2019の講師としてニジボックス社員を指導してくださったのは、リクルートテクノロジーズの古川陽介さん。エンジニアの方であれば、名前を聞いたことがあるという方も多いの
思わずWeb開発で使いたくなる便利機能をAPIで提供するサービスを厳選してみた！ - paiza times
どうも、まさとらん（@0310lan）です！ 今回は、Webサービスやアプリ開発などで便利に使える機能をAPIで提供しているサービスを厳選してみたのでご紹介いたします。 画像系、ストレージ、CMS、認証系、APIモック…など、さまざまな用途に使えるサービスの特徴や基本的な使い方も合わせて解説しています。いずれも無料で使えるものばかりなので、ご興味ある方はぜひ参考にしてみてください！ ■イラスト風のアバター画像を取得できるAPI 【 Joe Schmoe 】 Webサイト、ブログ、SNSなどに利用可能なアバター画像を取得できるAPIです。 イラスト風の人物画像を取得できるのが特徴で、Webサイトのチームページにアバターとして利用できるほか、自分のプロフィール画像やブログに挿入する画像など無料で利用できます。 使い方は簡単で、以下のような構成のエンドポイントを実行するだけです。 https:/
超初心者がwebpackerについて調べてみたぞ - Qiita
Ruby on Rails を使って開発を始めた今日この頃。 サーバーサイドはそれとなく出来てきたからそろそろフロントも固めて行こうかしら。なんて思っていた僕はBootstrapをRailsで使おうと考えた。Bootstrapを使うのはいたって簡単。htmlのhead内に以下のリンクをぶち込めばいいだけ。 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"> なんて便利だこと。 しかし、Bootstrapを使うには他にも方法は
[やってみた] 2020年1月6日からAWS Lambda(Node.js 8.10)が作成できなくなっていて、去年のre:InventのWorkshopを復習したら躓いたので、node.js 10.x 用にLambda Layer作成して移行してみた #reinvent, | DevelopersIO
ちなみに追加したモジュールは既存のnode.js8.10のソースを変更して /var/runtime/node_modules/ のパスからバージョン間の差異をとってます $ nvm use 10 Now using node v10.18.0 (npm v6.13.4) $ mkdir node8_modules $ mkdir node8_modules/nodejs $ cd node8_modules/nodejs $ npm install base64-js buffer dynamodb-doc events ieee754 imagemagick isarray jmespath lodash punycode querystring sax url uuid xml2js xmlbuilder + dynamodb-doc@1.0.0 + imagemagick@0.1.
![[やってみた] 2020年1月6日からAWS Lambda(Node.js 8.10)が作成できなくなっていて、去年のre:InventのWorkshopを復習したら躓いたので、node.js 10.x 用にLambda Layer作成して移行してみた #reinvent, | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/077e7208313e69c09e715b9a5c4c45694b1e7a6a/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2018%2F11%2Feyecatch_aws-lambda_1200x630.jpeg)
Ship.jsでリリースフローを改善する - Qiita
PLAID で i18n おじさんエンジニアしてる kazupon です。 この記事は plaid advent calendar 2019 の 17日目の記事です。 はじめに 筆者は、PLAID のプロダクト開発以外にも、オープンソースソフトウェア (以下 OSS )開発者として vue-i18n といったオープンソースプロジェクトを持っており、Node.js においては npm または yarn といったパッケージマネージャーと呼ばれるもので、Node.js そして必要に応じてブラウザ向けに動作するコードをパッケージにして OSS として配布しています。 npm / yarn で配布する OSS は、一般的には semver のようなセマンティックバージョンニングの仕様に沿った形で、バージョンをリリース毎に発行して管理して、npm publish や yarn publish によって
2019-12-17のJS: npm v6.13.4(security update)、JSON Parse、WASI on Node.js
また、Node.jsに同梱されているnpmのアップデートを含むsecurity fixが2019-12-17にリリースされる予定です。 こちらはそれぞれのNode.js LTSバージョンと開発版のNode.js 13のリリースが行われる予定です。 December 2019 Security Releases | Node.js Previous Releases | Node.js JSON Parser with JavaScript | Tan Li Hauという記事ではJSONパーサを実装していきながら、パーサの実装方法について紹介していきます。 JSONの仕様の構文定義をみながら、JSONの文字列をパースする実装していくチュートリアルとなっています。 パース時の意図しないトークンが出現したときのエラーケースの扱い方などについても書かれています。 JSer.infoをサポートするに
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Black Clouds and Silver Linings in Node.js Security - LIRAN TAL
Node.JS Is Stupid And If You Use It So Are You
Enterprise-grade Node.js on Azure | BRK3067
JavaScript: Who, What, Where, Why and Next by Laurie Voss | JSConf EU 2019