Reactを使ったモジュラーCSS : CSS-in-JSとCSS Module | POSTD
Buffer のメンバーはReactが大好きで、フロントエンドの多くのコードベースを徐々にReactに移行させています。ReactにFluxを加えると、モジュラー形式の小さなアプリでできた複雑なプロダクトを構築するための、とても健全な方法になると思います。そこで、１つ１つの新しい小さなアプリと機能を、大規模な構造体に追加される、Reactの新しいブロックと考えます。 私は最近、このような新機能の１つに取り組んでいますが、React＋Fluxのアプリケーションを作るのがいかに簡単であるかと、その理由について、さらに夢中になってしまいました。Reactを使うと有意味なコンポーネントを集めてUIを宣言的に構築するのが楽になり、Fluxはその混成体に妥当なデータフローをもたらします。 複雑なアプリケーションを作るときに発生する課題について多くの考察がなされましたが、React＋Fluxの組み合わせ
React Fiberアーキテクチャについて | POSTD
初めに React Fiberは、現在進行形で進められているReactのコアアルゴリズムの再実装であり、Reactチームの2年以上にわたる研究の成果です。 React Fiberは、アニメーション、レイアウト、ジェスチャーといった領域に対する適性を向上させることを目指しています。React Fiberの目玉となる インクリメンタルレンダリング は、レンダリング作業を分割して、複数のフレームに分散させることができる機能です。 他には主に、新たな更新があった際に作業を休止・強制終了・再利用できる機能、更新の種類別に優先順位をつけられる機能、新しい並行プリミティブなどが挙げられます。 このドキュメントについて Fiberは、コードを見ただけでは分かりにくい斬新な概念をいくつも導入します。このドキュメントはそもそも、ReactプロジェクトにおけるFiberの実装に伴って私が取っていたメモを集めたも
6年間におけるGoのベストプラクティス | POSTD
（本稿は、QCon London 2016で行った講演の内容に基づいています。スライドとビデオは近日中に掲載予定です） 2014年に開催された最初のGopherConで、私は「 Best Practices in Production Environments（本番環境でのベストプラクティス） 」と題した講演を行いました。 SoundCloud の私たちはGoのアーリーアダプターで、その時点までに既に2年近く、本番環境向けの様々なGoコードを書き、実行し、メンテナンスしていました。そして私たちはいくつかのことを学んだので、その教訓をまとめ、多くの人に伝えたいと思ったのです。 それ以来、私はフルタイムでGoを使う仕事を続けています。SoundCloudではその後の活動やインフラチームで、そして現在は Weaveworks で Weave Scope や Weave Mesh の開発に使ってい
全てのJSライブラリはTypeScriptで書かれるべきである | POSTD
私はJavaScriptプログラマで、ライブラリをいくつか作っています。しかし最近では RxJS version 5 のために TypeScript を書いています(RxJS version 5は Angular 2 の内部で使われていますが、Angular 2もTypeScriptで書かれています)。現在私は Cycle.js をTypeScriptで書きなおしているところです。 静的型付けと動的型付けの優劣の話はやや議論を呼ぶ話題なので、その議論をすべて再発させるつもりはありません。しかし、私は、 沢山の開発者に使われることを意図した 全てのJavaScriptライブラリはTypeScriptで書かれるべきだと信じています。これはアプリケーションやウェブサイトをTypeScriptで書くということの話ではなく、ライブラリに関する話です、ライブラリはTypeScriptで書かれるべきで、
DHHはどのようにRailsのコントローラを書くのか | POSTD
私たちの救世主DHH™は最近の Full Stack Radioのインタビュー で、 Basecamp の最新版で彼がどのようにRailsのコントローラを書いたかを説明しています。下記は、彼のすばらしい話を書き取ったものです。 これまでに思うようになってきたのは、「RESTの原則に従うには、どのタイミングで新たなコントローラを作るべきかを一度決めたら、ほぼ異例なくその原則を遵守するべきだ」ということです。いつだってその方がうまくいくんです。自分の作ったコントローラの状態を悔やむのは決まって、作ったコントローラの数が少なすぎた時です。多くの処理を任せようとしすぎてしまうんです。 そこでBasecamp 3では、ある程度理にかなったサブリソースがあれば、毎回コントローラを分割していきます。フィルタなどの場合ですね。例えば画面があって、それがある状態になっているとします。もしこれにいくつかのフィ
珍しいワークフロー：Atomic Designの原則とSketchでデザインからプログラミングまで | POSTD
概要： Sketchを使ったAtomic Designの方法がプロダクトデザインの未来形です。 初めに この記事は、上のビデオの素晴らしい人物、Brad Frostの開発したシステムについて書いています。Atomic Designは今のレスポンシブなデジタルの世界に対応するために開発されたものです。 ここ何年も、私たちのデザインを少しでも理解してもらえるよう、スタイルガイド、基本的ガイドラインやムードボードなどのツールを作成してきました。同じように、開発者もBootstrapやFoundation、Bourbonなどのツールでプログラミング作業を楽にしようとしてきました。互いに妥協点を見いだし協力することで互いの作業を楽にできます。Atomic Designはまさにそれを実現しようとしています。 Atomic designはあるインスタンスやページをデザインすることではありません。大局的に
高速なWebサーバアプリケーションを構築するための6つの経験則 | POSTD
この記事では、Webアプリケーション（特にバックエンド部分）を構築するときにハイレベルなパフォーマンスを達成しようとするなら考慮するべき、最も一般的な原則のいくつかを取り上げたいと思います。私は、自分自身の経験から、主にPHPの世界で使われるいくつかの例、設計パターン、慣例やツールについて書きますが、ここで説明する概念は、どんな言語やフレームワークにも必ず当てはまると思います。 手短に言うと、基本ルールは次の6つです。 ルール1 . 時期尚早な最適化を回避する ルール2 . 最小限の作業で問題を解決する ルール3 . 今すぐやらなくてもいい作業は延期する ルール4 . 使えるときはキャッシュを使う ルール5 . リレーショナルデータベースのN+1問題を理解し、回避する ルール6 . 可能ならアプリケーションに水平スケーラビリティをもたせる ルール1: 時期尚早な最適化を回避する Donal
イベントループなしでのハイパフォーマンス – C10K問題へのGoの回答 | POSTD
この投稿は、私が去年OSCONで行ったプレゼンテーションを基に作成しています。プレゼンよりは簡潔に編集し直し、プレゼン後にいただいたいくつかのフィードバックに応える形で記事を書いています。 Go言語に関してよく言われるのは、Go言語はサーバでうまく機能し、静的なバイナリや強力な並行処理、高いパフォーマンスを見せくれるということです。 この投稿では、その後半の2つの項目に関して焦点を当てます。プログラマとってGo言語とそのランタイムは、スケーラブルなネットワークサーバをスレッド管理やブロッキングI/Oを気にせずに書くのにどんなに有効かを説明していきます。 効率的なプログラミング言語に関しての議論 技術的な話に入る前に、Go言語をターゲットにしたマーケットを説明する2つの議論に関してお話したいと思います。 ムーアの法則 画像は以下より引用； 2005年5月にHerb Sutter氏が書いたDr
Goで使える10のテクニック | POSTD
ここでは、私がたどりついた最善のやり方を紹介しましょう。個人的に過去数年にわたって大量のGoコードと付き合ってきた経験から集めたものです。これらは全て非常にスケーラビリティがあると思っています。私が、スケールする、と言うときは次のような意味があります。 アプリケーションが求める環境は、アジャイル環境の中で変化していきます。開発の3、4か月後に、全てをリファクタリングする必要が出てくるなど、考えたくもないはずです。新しい機能は簡単に追加できなくては意味がありません。 あなたのアプリケーションは多くの人々によって開発されます。可読性が高く、維持しやすいものでなくてはなりません。 あなたのアプリケーションは大勢の人々に使われます。バグは容易に特定でき、修正できなくてはなりません。 長期的にみるとこれらのことが重要になる、ということを私は今までに学んできました。小さなことであっても、多数に影響しま
大規模Reactアプリケーションを構築するためのベストプラクティス | POSTD
Sift Scienceで製作にReactを使い始めてからほぼ1年になりました。その間、Backbone+Reactという フランケンシュタインのような 複合アプリケーションを、Reactコンポーネントからなる、かなり大きな1つの階層に育て上げました。この記事では、UI不和を最小限にしながら、コードベースをスケーリングするために役立った技法とベストプラクティスを紹介します。また、一般的なコンポーネントのデザインパターンについて、いくつか説明します。 この記事が皆さんの時間の節約と精神衛生の維持に役立ち、UIが複雑になってもReactコードベースの保全性を維持する（破綻するのではなく）ための新しいツールを提供できれば幸いです。 componentDidUpdateで、もっとできる Reactの本質は、DOMの更新というタスクを命令的なものから宣言的なものに変えるということです。他のタイプの命
Haskellで生産性を高める-Pythonからの移行 | POSTD
(注記：11/30、いただいた翻訳フィードバックを元に記事を修正いたしました。) 最近、Haskellでも生産性の高い作業ができるほどに、この言語を使いこなせるようになりました。定期的にPythonを使いもしますが、今ではWebプロトタイプ作成のほとんどをHaskellで行っています。それで、時間が経ってしまう前に、この言語の学習経験を通じて考えたことなどをまとめたいなと思っています。 データファースト これはどちらかというと動的言語から静的言語への移行に関しての考えなのですが、Haskellのデータ構造は、ほとんどの場合、データ宣言と型シグネチャで提示されるのに対し、Pythonの場合、おおむねコードによって暗黙に定義されます。 Pythonの関数について私が初めて抱いた考えは、「コードに何が書かれているか？」でしたが、Haskellでは、「データはどう見えるか？ この関数は＿＿＿を受け
パフォーマンス分析の方法論23選 | POSTD
パフォーマンス分析のメソドロジーとは、システムやアプリケーションのパフォーマンスを分析する際に準拠できる手法です。メソドロジーを手がかりとして作業に着手できますし、根本原因やその他の要因の発見に役立ちます。異なる種類の問題を解決するのには、それぞれに適したメソドロジーがあります。目的を達成するまでに何度か方法を変えて試してみるといいかもしれません。 メソドロジーを使わない分析は手探りの探索になり、ある問題に対する手がかりが見つかるまで（もしあればですが）ずっと場当たり的にメトリクスを分析することになってしまいます。 このサイトでは以下のメソドロジーについて詳しい資料を公開しています。 USE（Utilization Saturation and Errors）メソッド ：リソースのボトルネックを見つける TSA（Thread State Analysis：スレッドステート分析）メソッド ：
Goはオブジェクト指向言語だろうか？ | POSTD
“オブジェクト指向”の意味を本当に理解するには、この概念の始まりを振り返ることが必要です。最初のオブジェクト指向言語はSimulaという言語で、1960年代に登場しました。オブジェクト、クラス、継承とサブクラス、仮想メソッド、コルーチンやその他多くの概念を導入した言語です。おそらく最も重要なのは、データとロジックが完全に独立したものであるとする、当時では全く新しい考え方をもたらしたことでしょう。 Simula自体には馴染みがない方も多いかもしれませんが、Simulaからインスピレーションを得たとされるJavaやC++、C#、Smalltalkといった言語は皆さんよくご存知でしょう。さらにそこからインスピレーションを得たものとしてObjective-CやPython、Ruby、JavaScript、Scala、PHP、Perlなど様々な言語があり、Simulaは現在使用されているポピュラーな
超高速なJSON APIをElixirフレームワークのPhoenixでビルドしてテストしよう | POSTD
連絡先リストの役割を果たすJSON APIをビルドしてみましょう。ElixirとPhoenixを使って書きます。 Phoenix はElixirベースのフレームワークで、記述の高速化と、低遅延のWebアプリケーションをできる限り楽しく作成する目的で作られています。ElixirやPhoenixのインストール手順についてはここでは触れません。まず初めに Phoenixのガイド を読んでください。 なぜElixirとPhoenixなのか Erlanｇは、ポンコツの板金にくるまれたフェラーリのようなものです。ものすごいパワーを持っていますが、見た目が悪いと感じる人が多いのです。WhatsAppはこれを使って膨大な数の接続を処理していますが、見慣れないシンタックスとツールの不足のせいで多くの人が苦労しています。 Elixir はそこを改善したものです。Erlang上に構築されていますが、美しくかつ楽
TypeScript、台頭か | POSTD
JavaScriptのコミュニティがツールやフレームワークを統合する頻度は、ニコラス・ケイジがいい映画を作るのと同じくらいの頻度です。何が言いたいのかというと、 あることはある のですが、あったとしたら注目を集めるぐらい稀だということです。 だから私は、AngularのチームがAngular 2の開発に使用する言語を自社の AtScript から TypeScript に 切り換えるという決断をした のは非常に興味深いことだと思いました。これまでも、AngularのチームはTypeScriptのチームと共に開発を行ってきてはいますが、直接TypeScriptを使用するという決断は、TypeScriptのプロジェクトを強く支持しているということに他なりません。 また、TypeScriptを活用しているプロジェクトはAngularだけではありません。全くの偶然ですが、私たちTelerikはAn
ReactをjQueryの数行に要約する | POSTD
「Reactが素晴らしい理由は、UIをアプリケーションの状態の純粋関数にできるからだ」いうような話を聞いたことがあるでしょう。しかしそれだけではなく、不変性と仮装DOMを利用して動作するということも聞きますよね。その上、保存、読み込み、取り消し、それにタイムトラベル・デバッグと呼ばれるすごい機能まで自由に手に入れられる。でも知っていますか？ Reactの核となるアイデアを利用し、その恩恵に預かるのにこれらのことは必要ありません。jQueryの数行にしてお見せします。 <span id="colored-counter">0</span> <input id="color"></input> <button id="inc"></button> <script> $('#color').on('keyup', function () { $('#colored-counter').css('
若手開発者の後悔 | POSTD
(編注：2020/08/18、いただいたフィードバックをもとに記事を修正いたしました。) これはある仕事熱心な若手開発者のほぼ実話です。2004年の後半、この若手開発者は小さな会社で働き始めました。条件は全て彼の望みどおりでした。給料はいいし、扱うのは彼の得意とするプログラミング言語、アプローチの複雑性、モデリングのアーキテキチャでした。 彼にとって今回の会社が初めての職場ではありませんでした。しかし、ここでの最初のプロジェクトは結果的に 問題だらけ に終わりました。当時、この若手開発者は、機能は絶対に変わらないものだと思っていました。しかし、それは間違いでした。機能が変更されるたびに完全なリファクタリングを行わなければなりませんし、バグを引き起こして膨大な時間を無駄にしてしまいます。彼は、テストを書くといった実直な方法も試してみましたが、書いたテストはメンテナンスが必要な上、書くのに時間
モノリシックなRubyからGoによるマイクロサービスへ | POSTD
過去9年わたりWebアプリケーションを開発してきたNiket氏（ @nexneo ）は、2013年からGoを使って作業をするようになりました。この講演では、彼がどのようにRubyのモノリシックアプリケーションを分解しつつ、Goで記述されたマイクロサービスへと至ったかについて説明しています。講演のスライドは、 speakerdeck.com/nexneo/joy-of-single-purpose-services-in-go で閲覧可能です。 Single purpose servicesというのは、単一の問題を解決するサービスのことです。 一般的に マイクロサービス としても知られています。 Niket氏は、学校側が親御さんたちと連絡したり成績表や出席を管理したりするための人気オンラインプラットフォーム、 Beehively の開発者です。BeehivelyはRubyベースのアプリケーシ
JavaScriptのフレームワークについて検討してみよう | POSTD
(注記：4/10、いただいた翻訳フィードバックを元に記事を修正いたしました。) ほとんどのプログラミング言語は、評判のよい安定した、ごく少数のアプリケーションフレームワークをサポートしています。Objective-CやSwiftのアプリケーションではAppleの優れたフレームワーク、Cocoaを使用しています。Rubyのアプリケーションは、大抵Railsを使います。Javaには確立されたWebアプリのフレームワークが少数あって、それらは比較的ゆっくりと移り変わっています。 一方でJavaScriptのフレームワークは、およそ16分ごとに、最新で最良のものが誕生しています。 研究によると、（より新しくより優れたフレームワークが発明されない限り）作るのが最も複雑なJavaScriptのアプリはToDoリストだそうです。幸い、ToDoのサンプルプロジェクト経由でJavaScriptのフレームワー
ノンデザイナーのための25のグラフィックデザインのコツ | POSTD
>このコツを大いに活用してグラフィックデザインに挑戦してみてください！ ソーシャルメディア向けのデザインからイベント用の招待状まで、どんなデザインであろうと使えるグラフィックデザインのアプリはたくさんあります。 ペアリングフォントやスケールから行揃えやホワイトスペースまで、デザインの世界は複雑な面を持ちます。この25のグラフィックデザインのコツが、創作過程のあれこれを通してあなたの手助けになるでしょう。 各項目をイメージした画像をクリックして、 独自のデザイン に編集してみましょう。楽しいデザインを！ 01. フォント頼みをやめて、書体を制限してみる このデザインを編集してみる シンプルかつ効果的なグラフィックデザインのために読みやすいフォントを使いましょう。いくつもの書体を使用したデザインは読みづらいものです。統一されたフォントを使うようにしましょう。 ここではAileronのフォントフ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
