Controlledのメリット ReactではControlled Componentといって、デフォルトで<input>などにデータは保存されず、onChangeイベントでデータを拾って回収する必要があります。 ただ、必ずしもこれは入力フォームのデータをそのまま保存する必要がない、ということでもあります。たとえば、内部で扱うデータは摂氏だけど、onChangeで華氏→摂氏に変換、valueで逆変換を行えば、データ構造に変化なくフォームだけ華氏に切り替えられます。 不可逆変換の、UX上の問題点 そのように、可逆な変換を行う分にはユーザーが気づく機会もなく、便利なだけなのですが、不可逆な変換を入れるととたんにややこしくなります。 たとえば、onChangeで数字をコンマ区切りにするような処理を入れた場合、「12,345」を入力するつもりであっても、「1234」まで入力したところで「1,234
イベントなどでのiPad/iPhoneの使用時に、iOSアップデートのアラートを表示しないように出来ないか、Appleサポートに問い合わせをしてみました。 通知の流れ ネットワークに接続されていると、自動的に1-3が行われる。 アップデートがあることをデバイスが検知 デバイス内にアップデートデータをダウンロード アップデートを勧めるアラートの表示 タイミングについて iOSがアップデートされるタイミング 事前の案内を行なっていない。 デバイスがアップデートデータをダウンロードするタイミング ソフトウェア自体の修正、セキュリティ強化などを含めているため、事前の告知ではなく、リリースされ次第の通知。 デバイス内にアップデートのデータがダウンロードされていると、アップデート通知表示が出るようになる。 アップデートのデータを削除した場合（下記 ネットワークに繋がない場合の対処法参照）でも、再ダウン
フロントエンドエンジニアの今村です。 この記事はAngular Advent Calendar 2018 11日目の記事で、テーマは多言語対応です。 Angular Advent CalendarなのでAngularの話を中心に書きますが、手法としてはAngularに限らず、ひろく（TypeScriptで書かれた）Webフロントエンド全般の多言語対応に適用可能なものです。というのも、私は以前にも似たような記事をQiitaに投稿していて、その時はReactをやっていました。 この記事ではQiitaに投稿した方法を少し改良したやり方をご紹介しますが、TypeScriptの型に甘えて多言語対応を実現したいという気持ちは一貫しています。 TL;DR 辞書ファイルをTypeScriptで書きたいという思いのもと、Angularの標準のi18n機能やその他のライブラリに頼らずに実装した多言語対応を紹介
In this guide you will learn how to scaffold a Monorepo to manage multiple Create React Apps that share common components, with a Storybook. UPDATE: 2019/07/17Please use React Workspaces Playground, instead of this guide. React Workspaces Playground is a supported codebase where you can test drive everything in this guide with the latest version of React and Storybook. This guide demonstrates how
Status of ECMAScript module (ESM) support in Node.js: Experimental support for ESM was added in Node.js 8.5.0 (2017-09-12). Afterwards, the Node.js Foundation Technical Steering Committee formed the Modules Team to help design missing pieces and to guide the implementation towards its (non-experimental) release. The Modules Team is comprised of people from several different web development areas (
この記事はRecruit Engineers Advent Calendar 2018 - 13日目の記事です。 追記 本記事の内容にて、s-dev taksで登壇してきました speakerdeck.com 前書き 本記事は個人的な見解を示したものであり、所属する組織を代表するものではありません。内容には留意しておりますが、もし不適切な内容や誤りがあれば、私個人当てにご指摘のコメントをいただけますと幸いです。 超概要 カットオーバーから数年経ったtoCサービスにおいて、エンジニアオンリーのチームで企画・開発・分析、プロダクト改善のサイクル全てを担うチームの立ち上げを行いました 開発しか知らない僕らがよりよい価値を世に届けるために、企画や分析方面への染み出しを行う中での泥臭い取り組みや、やってみて分かった知見を共有します 経験ベースで築いてきた知見なので、理論を踏まえてなかったり、原理原則
はじめまして、アプリG サーバサイドエンジニアの田中です！ 最近は、せっかく買ったGoogle HomeとEcho dotになるべく家電操作を頼るようにしてみてます。 この記事は、 「JapanTaxi Advent Calendar 2018」の17日目です。 はじめに JapanTaxiアプリのサーバサイドでは、地図関連からタクシー配車に関わるやりとりまで、さまざまな内外のサービス連携をAPI接続を通しておこなっています。 今回は、アプリ上で空車のタクシー表示や目安料金算出などに使っている経路探索関連の外部APIを、コストと精度の観点から内部APIに段階的に置き換える中で多発した「コネクションエラー」との出会いから別れまでの話をしたいと思います。 内部APIへの置き換えの概要 内部APIへの置き換えにあたり、アプリからの1リクエストに対して、サーバサイドでは複数の並列APIリクエストを
（2019/02: 記事公開後のひと言） なんだか「GLBoost更新止まってない？」とか「作者、Twitter垢どうしたの？」 とか、ご心配（？）というか当然の疑問をお持ちになった方もいらっしゃるようなので、説明しておきますと…。 GLBoostの更新が滞りがちなのは、すでに開発が完全に新ライブラリの方に移ってきているためです。基本的に今後GLBoostはメンテナンスモードとなり、新ライブラリの正式公開を待つばかりの状況でございます。 あと、私のTwitterなどにつきましては、ちょっと思うところがありましてSNSのいっさいがっさいを少し前に一気に断ってしまいました（笑） 当時それなりに色々あったからなのですが、今となっては私個人としては何に対しても誰に対しても、もはや何のわだかまりもありませんし、元気にしております。みんな仲良く元気にやれるといいね！ しばらくはQiita記事や一部のS
jsincss An event-driven virtual stylesheet manager About Jsincss is a plugin that allows you to use JavaScript to template the creation of CSS stylesheets at runtime based on events happening in the browser. This allows you to use JavaScript to easily extend CSS to include new features. This plugin is a JavaScript module that loads JS-in-CSS stylesheets, manages the creation of <style> tags to out
<!DOCTYPE html> <meta charset="UTF-8"> <title>Flexbox overflow-wrap Test</title> <style> /* 体裁用 */ * { margin: 0; padding: 0; box-sizing: border-box; font-family: monospace; } html, body, main { height: 100%; } main { width: 640px; background: ivory; margin: 0 auto; } article { border: 4px solid blue; margin: 20px auto; background: pink; } p { border: 4px solid red; height: 4em; } /* 横方向 Flex */ .
2019/06/21 追記 記事内容を Babel 7.4.0 に対応したものに更新しました。 主に追記した箇所は以下に関してです。 @babel/polyfill が非推奨になった（Babel 7.4.0 から） @babel/preset-envのuseBuiltInsを利用して、core-js@3から必要な polyfill のみを import できるようになった（Babel 7.4.0 から） Stage 4 未満のプロポーザルの polyfill も import する（Babel 7.4.0 から） （補足）@babel/polyfill と core-js@3 で、「どのブラウザでどの polyfill を import する必要があるかを判別するために利用するデータ」が異なる はじめに 今更ですが、Babel 7 の主な変更点をまとめた備忘録です。 ほとんどの内容は公式ド
2018年のOSS活動の振り返り記事です。 今までの振り返り。 今年のOSS活動振り返り @ 2017 | Web Scratch 今年のOSS活動振り返り @ 2016 | Web Scratch 今年のOSS活動振り返り @ 2015 | Web Scratch 今年のOSS活動振り返り @ 2014 | Web Scratch 2018年のGitHubのContributionsは8000~10000ぐらいを推移していましたが、後半はどうも上手くコミットできてなかった気がします。 (2014年から増えているのはJSer.infoをTumblrからGitHub Pagesに移行しました - JSer.infoが半分ぐらいの理由です) GitHubのCurrent Streakは1881日で5.153424658年継続的にコミットは続いています。 データの取得には次のツールを使いました。
As of December 15th 2018, the HTTP Archive is crawling the full list of desktop origins from the Chrome User Experience (CrUX) Report for the desktop crawls (mobile will be added as of January 1, 2019). The URL list used is the latest available at the time of the crawl (November 2018 in this case). That change makes the HTTP Archive data set much more useful for doing across-the-web kinds of analy
3,000+ gorgeous SVG logos, perfect for your README or credits page Please wait... If you have JavaScript disabled or the index never finishes loading, please try Reloading this page - only if you have JavaScript enabled Browsing the A-Z list - works without JavaScript, but so many SVGs can crash your browser Searching with LogoSearch - works without JavaScript Letting me know via the contact page
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
