JavaScript(ES2015&React)で画像を扱う：リサイズとプレビュー表示 - dackdive's blog
はじめに web サイト／アプリケーションで画像のアップロード機能などを実装する場合、 最近のスマホのカメラで撮影した画像はサイズが数 MB にも及ぶので、あらかじめクライアント側で送信可能なサイズまで縮小する必要があります。 今回はそのような画像のリサイズの実装方法を整理しつつ、サンプルコードを React で書いてみます。 冒頭に画像のリサイズについて色々書いてますが、結論としては便利なライブラリでよしなにやってくれるので実装方法だけ知りたい場合は読み飛ばしてください。 JavaScript で画像を扱う際の基本 まず、JavaScript で画像ファイルを扱うにあたっての非常に基本的な話。 <input type="file"> 要素で選択した画像ファイルのデータを取得し、プレビュー表示するには以下のようにします。 class ImagePreviewer extends React
`for-await-of` and synchronous iterables
This blog post describes how for-await-of handles synchronous iterables. for-await-of is a core construct of asynchronous iteration. You can read up on it in the blog post “ES proposal: asynchronous iteration”. Note: you can run the examples in Node.js 9.2+ via: node --harmony-async-iteration Refresher: asynchronous iterables # Asynchronous iterables return asynchronous iterators, whose method ne
Reading streams via async iteration in Node.js
Update 2018-04-24: Using the library stringio to read lines from stdin. Node.js 10 was released on April 24, 2018. This version provides experimental support for asynchronously iterating over readable streams. This blog post explains how that works. Reading streams asynchronously # In this section, we examine two ways of reading data from a stream asynchronously: via callbacks and via asynchronou
How to use ES8 async/await with streams?
In https://stackoverflow.com/a/18658613/779159 is an example of how to calculate the md5 of a file using the built-in crypto library and streams. var fs = require('fs'); var crypto = require('crypto'); // the file you want to get the hash var fd = fs.createReadStream('/some/file/name.txt'); var hash = crypto.createHash('sha1'); hash.setEncoding('hex'); fd.on('end', function() { hash.end(); console
Capturing an image from the user | Articles | web.dev
Many browsers now have the ability to access video and audio input from the user. However, depending on the browser it might be a full dynamic and inline experience, or it could be delegated to another app on the user's device. On top of that, not every device even has a camera. So how can you create an experience that uses a user generated image that works well everywhere? Start simple and progre
これさえ見れば脱・JavaScript初心者！海外のYouTube動画を一挙大公開 - paiza times
どうも、まさとらん（@0310lan）です！ 今回は、基本的なJavaScriptプログラミングが出来るようになった人向けに、さらなるステップアップを目指せる「YouTubeチャンネル」を厳選してまとめてみました！ 海外のプログラミング系YouTube動画は、有料でもおかしくない「質」の高さと豊富なコンテンツ量に魅力があり、確実にレベルアップが期待できるのでぜひ参考にしてみてください。 ■JavaScriptの勘所を勉強できるYouTubeチャンネル！ 【 Fun Fun Function 】 プログラミング動画とは思えない超ハイテンションなノリで、JavaScriptを学ぶうえで欠かせない勘所を分かりやすく教えてくれるのがコチラのチャンネル！ 「Spotify」の開発にも携わっていたというプログラマーの彼は、得意のJavaScript言語を分かりやすく伝えることに情熱を注いでおり、それは
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ヤフー株式会社におけるフロントエンドの取り組み #devsumi #devsumiB