ReactComponent のリファクタリング指針 - freee Developers Hub
エンジニアの id:t930 です。 freee Developers Advent Calendar 2017 19日目いきます。 React はその名前を聞くようになってから3年以上が経過し、Webアプリケーション開発の文脈においてはもはや枯れた技術と言えるでしょう。会計freeeでも2015年ごろに Backbone.js から React へのリプレースを行い、現在では Reactコンポーネントだけでも900近いファイルが存在しています。当然このような規模でやっているとリファクタリングも必要になってくるわけで、本記事ではそんな中で得られたReactコンポーネントにおけるリファクタリングの指針について紹介していきます。1 適切な単位に分割する React に限った話ではないですが、巨大で見通しの悪いコンポーネントはメンテナビリティや再利用性の低下を招きます。表示領域、責務、意味付けに
Clean Code vs. Dirty Code: React Best Practices
This article will focus on clean code practices as they apply to modern React software development. I’ll also talk about some of the “sugar” that ES6/ES2015 brings to the table. What is clean code, and why do I care? Clean code is a consistent style of programming that makes your code easier to write, read, and maintain. Often a developer spends time on a problem, and once the problem is solved, t
ユーザー基盤を作り直しながらRailsでのサービス層に向き合う - クックパッド開発者ブログ
こんにちは。パートナーアライアンス部の諸橋 (@moro) です。 突然ですが、わたしはいまクックパッドの「ユーザー基盤」を再構築しようとしています。 一口に「ユーザー基盤の再構築」といっても、そのゴールが何を指すかは(わたし自身にとってもまだ)漠然としており、固定されたゴールは見いだせていません。しかし後述するように、いくつかの問題は明確な形を取っています。言い換えると、それら明確な問題と向き合いながら『柔軟でいい感じのユーザー基盤を目指す』というのがこの再構築プロジェクトの目的です。 その第一歩目として、ユーザー登録部分を現状のクックパッド本体とは別の小さなRailsアプリケーションとして実装を進め、つい先日、一部の限定された利用者の方に向けて公開することができました。 今後も様子を見ながら公開範囲を拡大していく予定です。 再構築の背景 ではその「明確な問題」とはなんでしょうか。 最大
Big Sky :: golang のリファクタリングには gofmt ではなく、gorename を使おう。
今まで golang で変数名や関数名のリネームには gofmt の -r オプションを使ってきましたが、これからは gorename を使いましょう。 文法を解析して正しくリネームしてくれるので、gofmt で起き得た誤爆も心配ありません。インストールは以下の様に実行します。 $ go get golang.org/x/tools/cmd/gorename 使用方法は以下の通り。 gorename: precise type-safe renaming of identifiers in Go source code. Usage: gorename (-from <spec> | -offset <file>:#<byte-offset>) -to <name> [-force] You must specify the object (named entity) to rename
The Refactoring Tales - JavaScriptのリファクタリング本を読んだ
GitHub: jackfranklin/the-refactoring-tales 読んだ日付: 2015年1月11日 まだ4章の途中までしか書かれてないですが、ウェブ版は無料で読めてPDF版等は買えるようになるようです(6-7章ぐらい予定) The Refactoring Tales - JavaScript Playground またGitHubにソースが公開されています(ウェブページはまだ反映されてない感じのtypoの修正等がありました) 感想 1,2章はフロントのJavaScriptで、jQuery世界を例にjQueryでべったり書いてしまったものをどうやって分けていくかの話。 1章はとても読みやすくて完成度もあるので読んでみるといい気がします、2章のカヌーセルの話はもっと深くやっても良かったような気がします。 縦に並ぶ$を見かけるとつらい感じになりますが、まずは手が出しやすい場
小さいモジュールに分割しまくる時の気持ち - mizchi's blog
最近、業務と趣味の副産物で、一日に1~2個のnpmモジュールを作っている。基本的にGithubで公開している。 node界でそういうことをしているのは主に substack (James Halliday) 氏だ。 趣味と仕事の横断 自分は基本的に、仕事で使うテクノロジーと趣味で使うテクノロジーを合わせていることが多い。会社ではツールを作っていても家では同じテクノロジースタックでゲーム作ってたりする。 最近だと mizchi-sandbox/ar2 がそれに該当する 会社のコード、自分はあんまり家に帰ってまで触りたいという気持ちがあんまりないんだけど、どうせ家でもコード書いてて、業務中のコードを切り出してOSS化してあると家で触るモチベーションになって便利。 趣味でノウハウが溜めて、業務にフィードバックするというループに載せることで、26歳としてもそこまで高くない社会人としての自覚をコーデ
「CoffeeScriptのリファクタリング」の実践とレビュー - mizchi's blog
CoffeeScriptのリファクタリング - ワザノバ | wazanova CoffeeScriptのリファクタリングと聞いたので、いてもたってもいられなくなった。まず、お題の結果を見ずにやってみる。 これが元のコード $(document).ready -> photoHTML = (photo) => "<li> <a id='photo_#{photo.id}' href='#{photo.url}'> <img src='#{photo.url}' alt='#{photo.alt}' /> </a> </li>" $.ajax url: '/photos' type: 'GET' contentType: 'application/json' onSuccess: (response) => for photo in response.photos node = $(phot
CoffeeScriptのリファクタリング - ワザノバ | wazanova
http://blog.arkency.com/2014/07/6-front-end-techniques-for-rails-developers-part-i-from-big-ball-of-mud-to-separated-concerns/ 1 comment | 0 points | by WazanovaNews ■ comment by Jshiike | 約2時間前 シングルページアプリもあり、それでなくてもフロント側のコードを書く機会は増えてきてますが、コードをうまく整理して、 簡単に、もっとテストしやすいコードを書く。 クオリティを下げることなく開発スピードをあげる。 ためのノウハウの一端を開発会社のArkencyがシェアしてくれています。 シリーズの初回は、シンプルなリファクタリングのケーススタディ。 CoffeeScriptのコードが、DOM変換、イベントハン
リファクタリングツールあれこれ 〜 Sphinxと戯れたいあなたに送る入門編 〜
1. コーディングスタイルを知る PEP8 – Style Guide for Python Code PEP257 – Docstring Conventions Pythonコミュニティが推奨するスタイルが存在する PEP 8 -- Style Guide for Python Code via http://legacy.python.org/dev/peps/pep-0008/ インデントはスペース4 行の長さ最大79文字 import分の順序 命名スタイル etc .. PEP 257 -- Docstring Conventions via http://legacy.python.org/dev/peps/pep-0257/ ツールでチェック pep8 … pepe8のチェック pep257 … pep257のチェック pyflakes … 文法エラーなどをチェック flak
Graspを使ったJavaScriptのリファクタリング
Refactoring your JavaScript code with Grasp | Grasp - JavaScript structural search, replace, and refactor という記事では、Grasp を使ったJavaScriptコードのリファクタリングについて書かれています。 この記事は Refactoring your JavaScript code with Grasp | Grasp - JavaScript structural search, replace, and refactor の簡単な紹介です Grasp は JavaScript ASTを元にgrepのような検索、sedのような置換などを行えるコマンドラインツールです。 GraspはNodeで(実際にはLiveScriptで)書かれているツールで npm 経由でインストールできま
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
無関係な情報＠テストの臭い - Strategic Choice
radonを使用したPythonのソースコードのメトリックスの取得 - Qiita