Talk at 関西Node学園 梅田キャンパス 1時限目 https://nodejs.connpass.com/event/82614/

先日、reduxのメンテナであるMark EriksonさんがBlogged Answers: Redux — Not Dead Yet! という記事を書いていて「はーなんだろうなー」と流し読みしていた。 そんな折、React 16.3 がリリースされ、Context APIが刷新されたのを見て、「あ、これは確かに向き合い方ちょっと変わるかも」というのを思ったのでまとめてみる。 Redux — Not Dead Yet!を要約する元記事をざっくり要約してみるとこんな感じ Reduxはどこにも行かないよ。メンテしていくし、役割もあるよContext APIによってReduxを置き換えられるパターンはありえるよ。ただその場合、最初からReduxいらなかった可能性あるよGraphQLがReduxを置き換えることはあるかも。でもReduxのほうがハマるパターンもあるよ最近Dan Abramovさん
マーチン・ファウラー氏「リファクタリング 2nd Edition」で20年ぶり内容刷新、サンプルコードはJavaScriptに。Web主体で書籍はエッセンシャル版の位置づけ マーチン・ファウラー氏が20年ぶりに大幅に内容を刷新した書籍「リファクタリング 2nd Edition」を今年秋に出版する計画だ。サンプルコードはJavaからJavaScriptに変わる。また、コンテンツ本体はWebサイトとなり、書籍はそのエッセンシャル版の位置づけとなる。 「リファクタリング」とは、ソフトウェアの機能追加や変更、性能向上などに備えるため、開発されたコードの外部に対する振る舞いは変更せず、より整理された、あるいは洗練されたコードに書き換えること、あるいはその手法のことを指します。 いまでは開発者の間で広く知られているこのリファクタリングについて、その目的や手法などを書籍としてまとめあげ、出版したことで啓
最近ReactとVueをどっちも触る機会があったり、「ReactとVueどう選定するの?」という問いを投げられ、スッと答えられなかったな、と後悔があったりしていたので、Vueを触って得られた感想をまとめてみる。 結論としてなにか新しいことを発見したというものではなく、世間で言われている事を自分なりに再構築しただけの結論になったと思う。 TL; DRVueからは全体的に優しさ(Gentleさ)を感じる事が多く、良い点だと感じた大規模になるときReactの堅牢さは魅力的。Vueが大きくなった時に支えられ設計が出来るかは個人的には懐疑的。「こうだったらVue、こうだったらReact」みたいな分岐点があるというわけではないので、最終的には好みになってくると思う。ぞうさんが好きかきりんさんが好きか。これまでのフレームワーク遍歴今回の話をするにあたって、僕と各フレームワークの付き合いをまとめておくと、
「TensorFlow.js」公開、Webブラウザ上で機械学習の開発、学習、実行が可能に。WebGL経由でGPUも活用 TensorFlow.jsの基となったオリジナルの「TensorFlow」は、Googleが開発しオープンソースとして公開されている機械学習ライブラリです。Windows、Mac、Linuxなどに対応し、Python、C++、Java、Goなどに対応したAPIを備えています。 今回発表されたTensorFlow.jsはそのJavaScript版で、Webブラウザ上で実行可能。TensforFlow.jsのAPIはオリジナルTensorFlowのPython APIのすべてをサポートしているわけではありませんが、似た設計となっており、機械学習のモデルの構築、学習、学習済みモデルの実行が可能なほか、学習済みモデルのインポートも可能。 WebGLを通じてGPUを利用した処理の高
Go と Vue.js を使ってどれくらいシームレスにウェブアプリを作れるかを確認したかったのでタスク管理アプリを作ってみた。サーバは Go なので vue-cli や webpack 等は使わない。全て CDN から。Vue.js でアプリのベースを、UI コンポーネントとして Element、Ajax ライブラリとして axios を使った。 以前、Riot.js を使って Todo アプリを作った時はサーバ作るのにも少し時間が掛かったので、今回は横着して echo-scaffold を使った。 GitHub - mattn/echo-scaffold README.md Echo Scaffold Echo Scaffold is CLI to generate scaffolds for the echo framework. https://github.com/mattn/ec
昨日 Twitter でこんな記事を発見しました。 PWA が来るって言っているエンジニアは今すぐ辞めろ 「instagram の PWA が最高〜!ネイティブと見分けつかない!!とかほざいているグー○ルのエバンジェリストだかエンジニアが騒いでいたので触ってみたのだが、オワコンであった。」 もしかしてこれのことかな? Instagram PWA is sooooooo impressive. I probably won't be able to distinguish it with its native app. InstagramのPWAが、デキが良すぎて感動してる。ネイティブアプリと見分けられる自信ない。 pic.twitter.com/DS8TfceBZ6 — Eiji Kitamura / えーじ (@agektmr) 2018年1月26日 確かに、この言い方は若干煽り気味のと
先人たちが1年前に通った道で、いろいろいまさらかよって話なんですが。基本的に以下の記事読んだら分かります。要はGulpとかGruntといったモノ使わずにnpm run hogehogeでビルドしよーぜって話です。 task automation with npm run オレ的Gruntに対する最新の気持ち - from scratch Node - npm で依存もタスクも一元化する How to Use npm as a Build Tool // package.json "scripts": { "start": "npm run start-serve & npm run watch", "test": "stylestats public/files/css/maple.css", "start-serve": "browser-sync start --server publ
(Updated on: 21.11.2021) This guide is intended to catch you up with the most important reasoning, terms, tools, and approaches to JavaScript testing for the year 2022. It combines information from the best articles recently released (they are referenced at the bottom) and adds from my own experience. It’s a little long but whoever reads and understands this guide, can safely assume they know the
--inspect, --inspect-brk --trace-opt, --trace-deopt --prof --trace-events-enabled --trace-gc node-report Performance Timing API 優しいコードの書き方へ v8::SnapshotCreator さいごに Node9が10/31に出ました🎉🎉🎉 Node v9.0.0 (Current) | Node.js 今回はNode単体の話なので、Express、Nginx等のチューニングに関してはココには書きません。 また、libuv等のコード内部の話もしません。 --inspect, --inspect-brk もともとあった、--debugから移行されました。(v8.0.0 ~) Chromeを使いデバッグ、プロファイリング等を使えるようになります。 ブラウザで使え
ES2017で仕様に入ったAsyncFunctionとawait単項演算子。 これらを使うと非同期処理を同期的に書くことができ、非同期処理のループもシンプルに書けるようになる。 この記事の内容は全てNode.jsのv8.6.0で動作確認している。 非同期処理の基礎はこちら。 AsyncFunction 関数定義の前にasyncとつけると、その関数はAsyncFunctionになる。 async function myFunc(){ return 'foo'; } console.log(myFunc); // [AsyncFunction: myFunc] console.log(myFunc()); // Promise { 'foo' } myFunc().then(res => console.log(res)); // foo 非同期処理をシンプルに書けていることが分かる。 Asy
一年以上前の記事なので、コードが古いです。気をつけて読んでください。 PWAとは? 目的 技術スタック Service Worker PWAのview App Shell Content キャッシュ戦略 読み込みフロー Web App Manifest デザイン FirefoxとChromeしかService Workerないけどどうするの? ネットワーク 実装 ライブラリ webpack-offline 構成 ファイル ルーティング アセットのインストール API周り SSR 資料 さいごに そういえばPWAの実装したことがなかったなと思ったので少し触ってみた。 PWAとは? PWA(Progressive Web Apps) インストールが不要で、不安定なネットワークでも素早く起動し、プッシュ通知を可能にします。 また、ホーム画面にアイコンも表示でき、アプリと同様の扱いをすることが可能
米Leaning Technologiesは6月19日、Webアプリケーション向けJavaコンパイラ「CheerpJ」を発表した。既存のJavaアプリケーションをWebアプリケーションにJARアーカイブから直接変換できるという。 CheerpJはJavaのバイトコードをJavaScriptに変換するコンパイラ。同社は2003年にC++をJavaScriptにコンパイルする「Cheerp」をリリースしており、そのJava版となる。CheerpJでは、既存のJavaアプリケーションとライブラリをWebアプリケーションに変換することを目指す。 ソースコードにアクセスすることなく、任意のJavaアプリケーション、ライブラリ、アプレットをWebブラウザ上で動作するWebアプリケーションに変換できる。クライアント側でJavaのインストールは不要で、リフレクション、動的なクラスローディングなどJavaと
久しぶりにJavaScriptを勉強しようと思ったら、すっかり浦島太郎状態だった……なんて人も多いのでは? モダンなJavaScriptの知識をコンパクトにまとめました。 JavaScriptを取り巻く環境がどんどん変化しています。新たなツールやフレームワークが生み出されているだけでなく、言語そのものがES2015(ES6)の登場で大きく変わりました。JavaScript開発の学習がいかに難しいか愚痴をこぼす記事がたくさんありますが、無理もないことです。 本記事ではモダンJavaScriptを紹介します。JavaScriptの進展を解説し、フロントエンドWebアプリケーションを作るために使われているツールや手法の全体像を確認します。JavaScriptを学び始めたばかりの人や、以前は使っていて数年間離れたため変化を知りたい人はぜひ読んでください。 Node.jsについて Node.jsは
JavaScriptにおける非同期処理は一種の悪夢です。非同期処理は容易にコードを複雑化させ、品質の低下を招きます。そこでこの問題を解決するため、非同期処理を簡単に扱うことができる、Promiseやasync/awaitという機能が導入されました。この記事では、Promiseとasync/awaitを用いた非同期コードの単純化について簡単な解説をします。 実行順序がコード通りにはならない非同期処理 非同期処理とは何でしょうか。非同期な処理は、コードの順番通りには実行されません。どういうことか、簡単な例を見てみましょう。 setTimeout(() => console.log('hello'), 500); console.log('world!'); このコードでは500ミリ秒後に「hello」と表示し、その後に「world」を表示しようとしています。ですが、実際には「world」の後に
5日にリリースされたChrome 59で、ブラウザと共にアップデートされたデベロッパーツールの新機能を紹介します。 What's New In DevTools (Chrome 59) Chrome 59 - What's New in DevTools -YouTube ページの軽量化: 未使用のCSSとJavaScriptを見つける フルサイズのスクリーンショットをキャプチャ リソースのロードをブロック 非同期コードの検証 コマンドメニューの統一 ページの軽量化: 未使用のCSSとJavaScriptを見つける 新機能の一つ目は「Coverage tab」。ページで使用されていないCSSとJavaScriptを見つけることができます。 command + shift + P で、「Show Coverage」を入力して選択。 ※「cov」まで入力すれば、上位に表示されます。 Show
Stay Relevant and Grow Your Career in TechPremium ResultsPublish articles on SitePointDaily curated jobsLearning PathsDiscounts to dev toolsStart Free Trial7 Day Free Trial. Cancel Anytime. Key Takeaways Event bubbling in JavaScript refers to the order in which event handlers are called when one element is nested inside a second element, and both elements have registered a listener for the same ev
JavaScript Primer 迷わないための入門書 Tweet Watch Star Xのハッシュタグ: #jsprimer これからJavaScriptを学びたい人が、ECMAScript 2015以降をベースにして一からJavaScriptを学べる書籍です。 プログラミングをやったことはあるが、今のJavaScriptがよくわからないという人が、 今のJavaScriptアプリケーションを読み書きできるように書かれています。 初めてのプログラミング言語としてJavaScriptを学ぶ人は、まずは「はじめに」から読んでみてください。 書籍版 このウェブサイトの内容はアスキードワンゴから書籍として出版されています。 書籍版の内容はウェブサイト版と同一ですが、本として読めるように最適化されています。 書籍版は次のサイトから購入できます。 Amazon 達人出版会(電子書籍版) 詳細につ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く