jQueryへの別れ：現代的な開発のための必須JavaScriptメソッド - Qiita

2023/06/21 328 users jQuery Qiita タスク 制約 スタイリング

jQueryは依然として有用ですが、制約もあります。2015年にリリースされたES6のブラウザサポートは、96%以上という高いレベルに達しており、要素の選択、スタイリング、アニメーション、データの取得といった基本的なタスクにおいて、jQueryからの移行を考える時期となっています。 以下は、バニラJavaScriptにおけるいく... 続きを読む

jQuery使いのエンジニアがReactとNext.jsでWebサイト制作するために最低限押さえておきたいコード（基礎編）

2023/01/23 357 users jQuery React Svelte Vue 構文

なぜ書いたか 筆者もWebサイト制作をそこそこ長くやってきておりいまは業務でVueを書いたりちょっとReactを書いたりSvelteを書いたりしていますが、2年前くらいまではReactやES6の構文すら書いたことがありませんでした。 WordPressでのサイト制作が多く、機能が少ないサイト制作会社ではjQueryで充分なことも多く、恥ず... 続きを読む

JavaScriptの次の仕様ES2022の新機能まとめ - ICS MEDIA

2022/06/10 148 users 新機能まとめ - ICS MEDIA 年次 ES2022

JavaScriptの仕様であるECMAScriptはEcma Internationalによって定められています。ECMAScript 2015（ES6）の登場以降は、ECMAScript 2016、ECMAScript 2017･･･と、年次で仕様が更新されています。最新のECMAScript 2022（ES2022）は今月6月22日のEcma InternationalのGA 123rd meetingにて承認される見込みです。 ES202... 続きを読む

TypeScript Deep DiveでTypeScriptに入門する ｜ DevelopersIO

2019/10/02 64 users jsx React TypeScript node.js

TypeScript Deep Dive とは TypeScript Deep Diveとは、TypeScriptはもちろん、JavaScript（ES6）/ サーバーサイドJavaScript（Node.js）/ Reactなどで使うJSX など、TypeScript周辺技術を包括的に学ぶことができるTypeScriptの入門サイトです。 TypeScript Deep Dive TypeScript Deep Dive 日本語版 GitHub TypeScript ... 続きを読む

新人にドヤ顔で説明できるか、今風フロントエンド開発ハンズオン(git/node.js/ES6/webpack4/babel7) - Qiita

2018/11/13 689 users Git Qiita 反面 node.js ドヤ顔

新人にドヤ顔で説明できるか、今風フロントエンド開発ハンズオン(git/node.js/ES6/webpack4/babel7) 概要 今風の手法でJavascriptアプリを作ろうとすると色々ツールがあって便利な反面、複雑でわからないことがたくさんあります。 わからないことがあったら、それを放置せず、しっかり理解して大いに寄り道しつつブラウ... 続きを読む

Vim script で ES6 Promise 実装した - はやくプログラムになりたい

2017/12/18 65 users Vim script Promise プログラム 実装 最後

2017 - 12 - 19 Vim script で ES6 Promise 実装した Vim Vim Advent Calendar 2017 の19日目の記事です． Vim script で ES6 の Promise を実装した話を書きます． もし Vim script が分からなくても，最後の章「Promise の実装の詳細」は Vim script とは独立した内容になっているので，P... 続きを読む

Vue.jsの流行とネイティブアプリフレームワークWeex、そして台頭する中国語コミュニティについて - 株式会社クイックのWebサービス開発blog

2017/03/04 54 users YARN Webpack Vue.js Babel 流行

2017 - 01 - 23 Vue.jsの流行とネイティブアプリフレームワークWeex、そして台頭する中国語コミュニティについて こんにちは。五所です。 最近は時代についていこうと、フロントエンドの情報収集をしています。 React, Redux, AngularJS, ES6, Webpack, Gulp, Babel, Yarn... 情報収集すればするほど、頭がいっぱいになるのですが、その... 続きを読む

2016年、サーバーサイドエンジニアがゼロからReact/Reduxを学習したときの方法を振り返る | BLOG | 株式会社スタジオ・アルカナ

2016/12/12 698 users redux React Babel サーバーサイドエンジニア

こんにちは。スタジオ・アルカナのサーバーサイドエンジニアなっちゃんです。 この記事は React Advent Calendar 2016 の13日目の記事です。 それは2016年も後半へ差し掛かったある日のことでした… 上司「次の案件、この辺の技術使うから軽く勉強しておいてー」 つ React.js + Redux.js + redux-saga + Cordova + ES6 + Babel ... 続きを読む

Web制作者が備えておきたい最新版チートシートのまとめ、CSS3 Flexbox, CSSアニメーション, jQuery3, ES6, Bootstrap4など | コリス

2016/11/15 556 users コリス Flexbox セレクタ コーディング CSS

CSS3のFlexboxをはじめ、CSSアニメーション、CSSのセレクタ、jQuery3, ES6, Bootstrap4など、フロントエンドのマークアップやコーディングに役立つチートシートを紹介します。 ブックマークし ...記事の続きを読む 続きを読む

ES6時代のコーディングスタイルを考える - Qiita

2016/09/18 80 users コーディングスタイル const Qiita ジェネレータ

ここではコーディングスタイルを考える上で、ES6（ECMAScript2015)の以下の特徴に注目して考察するものです。 変数宣言は、 const を基本とする クラス宣言文や関数宣言文はブロックスコープ 文字列では、テンプレートリテラルを活用する ジェネレータのために、複数の構文が拡張された また、以下の基準を採用していることを特に触れておきます。 ES5コードの混在、ES5時代のスタイルとの互... 続きを読む

BabelでES6で書いて、webpackでビルドして、mochaでテスト書いて、power-assertでassertの出力を見やすくして、karmaで複数ブラウザのテストを自動化して、カバレッジを出力するようにした - UUUM攻殻

2016/09/16 100 users Karma Webpack assert Babel uuum

2016 - 09 - 16 BabelでES6で書いて、webpackでビルドして、mochaでテスト書いて、power-assertでassertの出力を見やすくして、karmaで複数ブラウザのテストを自動化して、カバレッジを出力するようにした おはこんばんちは!! 尾藤 a.k.a. BTOです。 UUUMでは業務の効率改善に kintone を導入しようとしているのですが、kintone ... 続きを読む

ES2015で始めるJavaScript入門 - Qiita

2016/09/08 284 users Qiita ECMAscript サーバサイド ナンバリング

JavaScriptとは Webブラウザで実行可能なインタプリタ言語 最近ではサーバサイドのものもある(Node.jsなど) 各ブラウザで独自の実装があるが、標準化されたECMAScriptに準拠している ES5, ES2015(ES6), ES2016, … ES2015からは毎年新しい規格が策定される これによりナンバリングは策定した年に変更 ES5(2011年策定)から4年ぶりに策定されたE... 続きを読む

生のReactを知ろう – JSX、Flux、ES6、Webpackを使わず… | プログラミング | POSTD

2016/03/31 313 users Webpack Flux react-router jsx

React.jsが騒ぎを起こしているのはご存知の通りです。しかし、調査に数時間を費やした挙句、あまりに多くの用語に圧倒されただけで終わっていないでしょうか。JSX、flux、ES6、webpack、react-routerが使える今、他に必要なのはReactの使い方を説明してくれる人だけです。免責事項：　私はJSX、Flux、 ES6 、そして webpack を非常に気に入っています。これらのツ... 続きを読む

JSをbrowserifyでビルドし、ライセンスコメントを適切に残す - $shibayu36->blog;

2016/01/06 99 users browserify npm TypeScript tech

2016 - 01 - 06 JSをbrowserifyでビルドし、ライセンスコメントを適切に残す tech 最近JSを利用するときは、依存モジュールはnpmを利用し、ES6やTypeScriptの仕様を開発には使った上で、ブラウザ用に コンパイル して配信するようになってきている。また同時にネットワークの負荷を下げるためにminifyを行う場合もある。 minifyはライセンスが絡むと少し難しい... 続きを読む

ES6のモジュールを解説してみた - uehaj's blog

2015/11/06 142 users モジュール uehaj's blog export

2015-11-07 ES6のモジュールを解説してみた js es6 javascript ECMAScript import export package module Tweet Share on Tumblr はじめに 予備知識 JSにおいてモジュールとは何か・何だったか ES6においてモジュールとは何か exportとimport モジュール利用の流れ export編 1. named e... 続きを読む

橋本商会 » coffeeからES6(babel)に少しずつ書き換える

2015/11/04 54 users Babel coffee Flux 橋本商会 shokai

coffee-scriptで書いていたwebアプリをES6(babel)に書きなおした。 全部を一気に書き直してハイ動いたーとやるのは無理なので、coffeeとES6のファイルが混在しても動かせるようにして、少しずつ書き直した。 書き直したのはこれ React+Fluxxor+socket.ioでfluxなチャットを作った https://github.com/shokai/node-flux-b... 続きを読む

karma+mocha+power-assertでDOM操作を含むユニットテストをES6で書く | WebDesign Dackel

2015/11/02 71 users ユニットテスト Pow DOM操作 QUnit モジュール

テスト周りは以前にmocha+chai、QUnitを少し触った程度であまり詳しくなく、少しずつ慣れていかなきゃなぁと感じていました。 そこで今回は簡単なモジュールを、コード本体とテストコードの両方をES6で書いてみました。 タイトルにもありますが、主要なライブラリは以下を使っていきます。 karma 0.13.14 : テストランナー mocha 2.3.3 : テスティングフレームワーク pow... 続きを読む

JavaScript - 末尾再帰による最適化 - Qiita

2015/10/05 132 users Qiita Babel altJS ドキュメント 最適化

はじめに ES6 (EcmaScript 6)を試そうと、Babelのドキュメントを読んでいたところ、末尾呼び出し（Tail Call）の最適化をしていることにびっくり。公式リリース（2015年6月）から３ヶ月あまり経ってはいますが、ES6が末尾呼び出し最適化を仕様としてサポートしていることをようやく知りました。 現状で末尾呼び出し最適化をサポートしているブラウザはなく（ブラウザやaltJSなどの... 続きを読む

ECMAScript 2015(ES6)の概要と次世代JavaScriptの新たな機能 | HTML5Experts.jp

2015/09/29 143 users HTML5Experts.jp 概要 機能 泉水翔吾 経緯

ECMAScript 2015(ES6)の概要と次世代JavaScriptの新たな機能NEW 泉水翔吾（株式会社サイバーエージェント） ECMAScript,JavaScript2015年9月29日 この記事は「ECMAScript2015/ES6特集」の第1回目です。この特集ではJavaScriptの次世代仕様であるECMAScript 2015（ECMAScript 6）を取り上げ、歴史や経緯... 続きを読む

ES2015(ES6)な時代だからこそ、ES5を改めて調べたJavaScript初級者のメモ - Qiita

2015/09/12 127 users Qiita Babel メモ ECMAScript5 ES5

はじめに ECMAScript2015(第6版、通称ES6)が承認され、Babelも登場し、世はまさにES2015時代。なのだけど、JavaScript初級者としてはES5自体をちゃんと把握していなかったりするので、今さらながら調べてみることにした。 間違っている所があれば、ご指摘いただけると大変助かります。 ECMAScript5で追加されたもの ECMAScript5 compatibilit... 続きを読む

React TutorialをES6で書きなおしてみた - console.blog(self);

2015/08/03 57 users self MAE React Tutorial チュートリアル

2015-08-03 React TutorialをES6で書きなおしてみた JavaScript できあがったのはこちら。 sadah/react-tutorial-es6 Reactを触ってみたいと思って、チュートリアルをやってみた。翻訳してくださっているかたがいて、訳もわかりやすくてとても助かった。 Tutorial | React React.jsチュートリアル【日本語翻訳】 | mae'... 続きを読む

JavaScript - イマドキのJSテスト - テスト環境をモダンフロントエンドツール群で整備する編 〜 JSおくのほそ道 #032 - Qiita

2015/07/08 59 users Qiita JSおく Webpack いまどき Karma

こんにちは、ほそ道です。 今回はビルドツール・モジュールローダ・altJS(JSコンパイラ)を組み合わせてさらにテストコードのおくのほそ道に入り込んでいきます。 今回Gulp + Webpack + Karma + Jasmine + ES6を使用しますが、 GruntだったりBrowserifyだったりMochaだったりCoffeescriptだったりに置き換えても基本的な考え方は近しい感じにな... 続きを読む

どうやってECMAScript 6を学び始めるか

2015/06/26 119 users ECMAScript 6 azu JSer.info ISO

どうやってECMAScript 6を学び始めるか ^ 自分でちゃんと見て読んで大丈夫というものしか出してないので、かなり最小限の紹介です。 ^ azuです。JSer.infoなどをやっています。 ES6的にはPromise本を書いたり、日本のISO/IEC JTC 1 SC22でES6のレビューに参加してます。 ECMAScript 5を知る ^ ES6の話をする前にES5の話です。 ES6 の前... 続きを読む

ES6がリリースされたのでPromiseについて学びましょう | Web Scratch

2015/06/23 59 users Promise aka 去年 Web scratch

去年の6月23日にJavaScript Promiseの本 Ver 1.0をリリースしてから今日でちょうど一年になります。 JavaScript Promiseの本を書きました | Web Scratch そして、ECMAScript 2015(aka. ES6)も2015年6月18日正式版がリリースされました。 ECMAScript 2015 is now an Ecma Standard これ... 続きを読む

cssnextを使って最新のcss syntaxで開発するのが良さそう | 69log

2015/06/19 153 users cssnext Babel altJS 備忘録 CSS

ここ最近CSSを扱うことが多かったので、その際にPostprocessorを検討時にcssnextについてまとめた備忘録。 JavaScriptの最近の事情javascriptではES6でコードを書き、BabelでTransplieするという流れが定着しつつある。 これは、これまで必要だったライブラリが不要になり、コードが依存するライブラリを減らすことができ、altJSに頼らないで開発できるという... 続きを読む