Stack Overflow: 100万人の開発者を手助けするVim終了方法 | POSTD
今朝のことですが、 Stack Overflowで人気のある質問 が1つの値を越えました。 注釈： 見出し: Vimエディタの終了方法を教えてください 質問者: jclancy 赤丸囲みの中: ビュー：1,000,082回 jclancyさん、あなただけではありません。この質問が投稿されてから5年、あなた以外に100万人以上の開発者がVimで身動きできなくなって、何らかの助けなしには抜け出せませんでした。実際、Vimエディタを終了させるのは難しく、開発者の間では共通のジョークになっています。 注釈： 誰も簡単にVimから抜け出せない ベテランのVimユーザからこういう評判は不当だと言われたことがあります。（私もやっとここ数年でこの問題についてのコツをつかんだのですが、）確かにベテランの言い分は正しいと思います。Vimの終了方法を忘れてしまうのには2つの理由があると思います。開発者は、Git
正式リリースされたES8の主な新機能 ???? | POSTD
EcmaScript仕様第8版の新機能 EcmaScript 8もしくはEcmaScript 2017が、6月末にTC39から正式にリリースされました。私たちはこの1年、EcmaScriptについて色々と議論しているようですが、それは無駄なことではありません。現在、ES標準は新しい仕様のバージョンが年1回公開されています。ES6は2015年、ES7は2016年に公開されましたが、ES5のリリース時期をご記憶でしょうか。JavaScriptが魔法のように普及する以前の、2009年のことでした。 つまり私たちは、安定した言語としてJavaScriptの開発上の変化をたどっており、今や自分の語彙にES8を加える必要があるのです。 ES2017 (the 8th edition of the JavaScript Spec) was officially released and publishe
webpackとRollup：似て非なるもの | POSTD
先日、Facebookは 膨大なプルリクエスト をReactにマージして、既存のビルドシステムを Rollup ベースのシステムに移行しました。 その結果 、 何人もの人々 から「なぜwebpackではなくRollupを選んだのか」という質問が寄せられました。 これは、もっともな疑問でしょう。 webpack は、近年JavaScriptコミュニティで最も評価されているツールの1つです。毎月のダウンロード数は何百万件にもおよび、何万個ものウェブサイトやアプリケーションに使用されています。巨大なエコシステムがあり、コントリビュータも多くいます。さらにオープンソースプロジェクトとしては珍しく、 かなりの寄付金 が集まっています。 それに比べるとRollupは小規模です。しかしReact以外にも、Vue、Ember、Preact、D3、Three.js、Momentなど、数々の有名なライブラリに
全てのJSライブラリはTypeScriptで書かれるべきである | POSTD
私はJavaScriptプログラマで、ライブラリをいくつか作っています。しかし最近では RxJS version 5 のために TypeScript を書いています(RxJS version 5は Angular 2 の内部で使われていますが、Angular 2もTypeScriptで書かれています)。現在私は Cycle.js をTypeScriptで書きなおしているところです。 静的型付けと動的型付けの優劣の話はやや議論を呼ぶ話題なので、その議論をすべて再発させるつもりはありません。しかし、私は、 沢山の開発者に使われることを意図した 全てのJavaScriptライブラリはTypeScriptで書かれるべきだと信じています。これはアプリケーションやウェブサイトをTypeScriptで書くということの話ではなく、ライブラリに関する話です、ライブラリはTypeScriptで書かれるべきで、
RailsのAPIにHATEOASを散りばめてみる : RESTの拡張、HATEOASの詳解と実装例 | POSTD
概念としてとしてのRESTは、 Roy Fielding が博士論文「 Architectural Styles and the Design of Network-based Software Architectures 」で導入したものです。その16年後、アーキテクチャとしてのRESTは、APIを設計・構築するための最も広く受け入れられた方法となっています。RESTについては私たちはみんな聞いたことがありますし、自分たちが実際にRESTfulなAPIを構築しているとほぼ皆が思っています。しかし、それは本当でしょうか？ 「RESTとは何か？」ということを自分たちにもう一度思い出させたうえで、さらにRESTを補う別の方法、「HATEOAS」と呼ばれるものの話に続けていきましょう。 RESTとは何か？をもう一度 私はこれを説明するための良い方法について考えていたのですが、Ryan Tomak
Reduxのパターンとアンチパターン | POSTD
Redux は、 Flux のようなアーキテクチャを使用してアプリケーションの状態を管理できる非常にシンプルなライブラリです。私たち Affirm では今、 Reduxのタイムトラベル機能 に注目しています。Affirmの主要事業は、透明性の高い消費者ローンを提供することなので、ローン申し込み時の全過程をユーザ視点で再現できると非常に有用なのです。 Reduxはフレームワークというよりも、パターンの適用に役立つ関数セットです。よって、適切なパターンを慎重に適用しないと、Reduxを使ったことを後悔する結果になりかねません。この記事では、Affirmで確立したReduxのベストプラクティスや、ミスを犯しやすいポイントについて説明します。 ImmutableJS ImmutableJS は、不変の永続データ構造を扱うためのライブラリです。私たちがこのライブラリを好んで使う理由は2つあります。
Reactを使ったモジュラーCSS : CSS-in-JSとCSS Module | POSTD
Buffer のメンバーはReactが大好きで、フロントエンドの多くのコードベースを徐々にReactに移行させています。ReactにFluxを加えると、モジュラー形式の小さなアプリでできた複雑なプロダクトを構築するための、とても健全な方法になると思います。そこで、１つ１つの新しい小さなアプリと機能を、大規模な構造体に追加される、Reactの新しいブロックと考えます。 私は最近、このような新機能の１つに取り組んでいますが、React＋Fluxのアプリケーションを作るのがいかに簡単であるかと、その理由について、さらに夢中になってしまいました。Reactを使うと有意味なコンポーネントを集めてUIを宣言的に構築するのが楽になり、Fluxはその混成体に妥当なデータフローをもたらします。 複雑なアプリケーションを作るときに発生する課題について多くの考察がなされましたが、React＋Fluxの組み合わせ
OSを書く：初歩から一歩ずつ | POSTD
(注：2017/9/27、いただいたフィードバックを元に翻訳を修正いたしました。) （傑作映画 『おつむて･ん･て･ん･クリニック』 に登場する著書です） このチュートリアルは、アセンブリで とても 簡単なオペレーティング･システムを皆さんが自分自身で書けるようになるために書きました。元々は、 OSDev wiki でこのチュートリアルのベースとなるものを見つけたのがきっかけです。しかし、そこには何がどのように、どうして行われているのかという説明が一切ありませんでしたので、このチュートリアルを書くことを決めました。ということで、起動プロセスの基礎と、実行するのに必要なツールについて紹介していきます。 OSXやLinux、Windowsなどのよく使われているオペレーティング･システムはドライバを持っており、ハードウェアとの間のインタフェースを提供し、一定レベルの安全性とセキュリティを保証しま
Node.jsのマイクロサービスの構築を通してDockerを学ぶ – 後編 | POSTD
前編はこちら： Node.jsのマイクロサービスの構築を通してDockerを学ぶ – 前編 ステップ3：マイクロサービスをDocker化する さて、ここからがお楽しみです！ 私たちには、互換性のあるNode.jsバージョンがインストールされている開発マシン上で実行できるマイクロサービスがあります。やりたいことは、 Dockerイメージ を作成できるように、サービスをセットアップすることです。そうすれば、Dockerをサポートしているあらゆる場所にサービスをデプロイすることができます。 これを行うには Dockerfile を作成します。Dockerfileは、イメージを構築する方法をDockerエンジンに指示するレシピです。 users-service ディレクトリに簡単なDockerfileを作成し、それを私たちのニーズに適応させる方法を探ることから始めましょう。 Dockerfileを
AsyncとAwait : コールバック地獄を避けるための最新のやり方、そしてその未来 | POSTD
(2016/7/7、いただいたフィードバックを元に記事を修正いたしました。) JavaScript、特にNode.jsといえば、 コールバック地獄 がよく連想されます ^(1) 。たくさんの非同期I/Oを扱うコードを書いたことがある方には、おそらく以下のようなパターンはおなじみでしょう。 export default function getLikes () { getUsers((err, users) => { if (err) return fn(err); filterUsersWithFriends((err, usersWithFriends) => { if (err) return fn(err); getUsersLikes(usersWithFriends, (err, likes) => { if (err) return fn (err); fn(null, lik
Node.jsでのJavaScriptメモリリークを発見するための簡単ガイド | POSTD
目次 初めに 極小理論 ステップ1. 問題の再現と確認 ステップ2. 最低3回のヒートダンプ採取 ステップ3. 問題の発見 ステップ4. 問題解決の確認 他のリソースへのリンク まとめ Something you might want to bookmark: Simple Guide to Finding a JavaScript Memory Leak in Node.js by @akras14 https://t.co/oRyQboa8Uw — Node.js (@nodejs) January 6, 2016 注釈：お気に入りに登録してください。 Simple Guide to Finding a JavaScript Memory Leak in Node.js （Node.jsでのJavaScriptメモリリーク発見簡単ガイド） @akras14 http://www.ale
バッドUIを改善する方法 ― UIの「5つの状態」を考える | POSTD
(訳注：2020/08/22、画像と動画が正しく表示されていなかったためリンクを修正しました。) こんにちは。このブログは12月にO’Reillyから出版予定の私の著書『 Designing Products People Love 』からの抜粋です。ぜひ本も読んでみてください。また、FacebookやTwitter、 Slackなどで活躍されている20人以上のプロダクトデザイナーにインタビューもしています。* 無味乾燥なUIを経験したことはありますか？ 何か が足りないと感じてしまうようなUIを作ってしまったことはありませんか？ もしそうであれば、使い勝手の悪いUIを経験したのだと思います。 使い勝手の悪いUIには進捗インジケータがありません。ユーザにどこで障害が起きたのか知らせてくれません。怖いエラーメッセージでも表示してくれれば、なお良いのですが。わずかなデータのみの奇妙なグラフです
生のReactを知ろう – JSX、Flux、ES6、Webpackを使わず… | POSTD
(編注：2016/07/29、いただいたフィードバックをもとに記事を修正いたしました。) 免責事項： 私はJSX、Flux、 ES6 、そして webpack を非常に気に入っています。これらのツールについては他のシリーズで話します。 React.jsが騒ぎを起こしているのはご存知の通りです。確かに、 XMLHttpRequest 以来の良いツールです。しかし、調査に数時間を費やした挙句、あまりに多くの用語に 圧倒された だけで終わっていないでしょうか。JSX、flux、ES6、webpack、react-routerが使える今、 *他に必要なのは React の使い方を説明してくれる人だけです。* 喜んでください、それがまさに当シリーズでやろうとしていることです。信じられませんか？大丈夫、 2分後、 初めてのReactアプリを作った後には納得いただけるでしょう。何もダウンロードせずに、で
Angular 2で作った最初のアプリの事後分析 : 使ってわかったAngular 2の長所と短所 | POSTD
最近、Angular 2を使ってWebアプリ作成の手伝いをする機会がありました。このフレームワークの複雑さに戸惑いもありましたが、Angular 2は間違いなくすばらしいものです。この事後分析では私がAngular 2のフレームワークを使った時に感じたいい面と悪い面の両方を掘り下げていくことにします。 Angular 2 Angularは携帯電話やデスクトップのWebアプリケーションを作成するための開発プラットホーム。 https://angular.io/ Angular 2＋リアクティブプログラミング＝❤ 私はすでに、Angular 1アプリケーション ではRxJSをかなり使っていました。特に、サービス間のメッセージ・バスを行うアプリを作成する時です。Angular 2はObservableを非常によくサポートしているので、アプリ全体にリアクティブプログラミングを取り入れることができ、
ES6 チートシート | POSTD
日々の仕事の中で役に立つES2015（ES6）のティップス、コツ、ベストプラクティス、プログラムの見本をご紹介します。コントリビューション歓迎です！ 目次 var vs. let / const IIFEからブロックベースへ アロー関数 文字列 デストラクチャリング モジュール パラメータ クラス シンボル マップ WeakMaps Promises ジェネレータ Async/Await var vs. let / const var の他に、値を格納する let と const という識別子が新たに追加されました。 var とは異なって、 let と const はクロージャのスコープ内で最初に記述されることはありません。 var の使用例です。 var snack = 'Meow Mix'; function getFood(food) { if (food) { var snack
FacebookのFluxアーキテクチャの始め方 Part 1 | POSTD
私のように、Reactを使ってより進んだことがしたいと考えたなら、おそらく Flux に注目した経験があると思います。ざっと目を通してタブを閉じ、JavaScript開発者としての自分の人生を見直したことでしょう。 もしReactになじみがなければ、私の記事 「React入門」 を読んでみてください。 Fluxとは？ Fluxは、遠目には始めるために複雑な手順を踏まなければいけないように映ります。しかし、 GitHubにあるexample を見てみれば、これがどのように機能するのかが実に明確になってきます。 簡単に言うと、Fluxは美化された 出版-購読型モデル のアーキテクチャです。データはシステム内を一方向に流れ、そこから様々な利用者が必要に応じてデータを取得します。これについて考えるには、私たちの体に例えてみると簡単です。 イベント – 血液 血液は私たちの体内を一方向に流れています
Javaのマイクロフレームワーク ― この新トレンドは見逃せない | POSTD
この記事は、JavaとScalaの例外分析・パフォーマンス監視のツール Takapi の blog に投稿されたものです。 Javaのマイクロフレームワークとは何か、推奨される理由とは？ どんなプログラミング言語にも、長所と短所はあるものです。例えばJavaは、安全性の高さや、厳しいテストを経ていること、後方互換性などの利点を持つ言語です。しかし、その代償として、アジリティ（俊敏性）や合理性といった面が少なからず犠牲になっています。冗長で、Java自体が肥大化しているという事実も否定できません。とはいえ、新規開発や大規模な開発を行いたい場合、JVM（Java仮想マシン）はバックエンドとして非常に魅力的です。JVMはパワフルな上に、非常に厳しい環境でテストされています。このような利点があるため、結果的にJavaは広く使用され、積極的にデプロイされているのです。 しかし、このJavaの現状を皆
JavaScriptのクロージャは内部でどう機能するのか | POSTD
もうだいぶ前からすでに私はクロージャを使っています。使い方を学びましたが、実際にクロージャがどう機能するのか、また、使うと隠れたところで実際に何が起きるのかを明確に理解しているとは言えませんでした。そもそも、クロージャとは一体何なのでしょうか。 ウィキペディア はあまり役に立ちません。クロージャはいつ生成され、いつ削除されるのでしょうか。どのように実装されるべきなのでしょうか。 "use strict"; var myClosure = (function outerFunction() { var hidden = 1; return { inc: function innerFunction() { return hidden++; } }; }()); myClosure.inc(); // returns 1 myClosure.inc(); // returns 2 myClos
Chrome開発者ツールの小技集 | POSTD
最近、普段以上にChromeの開発者ツールを使うことに時間をかける機会がありました。その過程で、自分が今まで気づいていなかった機能をいくつか見つけました（少なくとも今までその機能を探す必要に迫られていなかった、とも言えるのですが。例えばブラックボックス化や非同期のスタックトレースなど）。そのため、開発者ツールでとても気に入っているいくつかの機能についてまとめてみたくなったのです。 小さな虫眼鏡ののアイコンは、特定の要素やCSSプロパティに対して、「どのCSSファイルに書かれているどのセレクタ/クラスが最終的なスタイルを決めているか」を示してくれます。例えば、どれかDOM要素に対して「要素を検証」を選び、右側の「Computed」というタブを選びます。確認したいCSSプロパティを見つけてその虫眼鏡アイコンをクリックすることで、すぐさま右側に正しいCSSファイル内のクラス/セレクタを表示してく
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ページネーションのベストプラクティス | POSTD