保守性の高いReact hooksコードの指針
前提 本記事は保守性の高いReact hooksコードの指針を記述します。指針はtipsに近いものから原則に近いものまで雑多に含まれます。総じてReact hooksの標準的なAPIを上手く扱う方法が多めです。 これらは保守性の低いコードを反面教師とした私的な経験則に基づきます。（思い出し次第随時追加していきます） ご留意ください。 解消したい痛み 再現が困難な不具合の発生 容易に無限ループが発生しうる 不具合発生箇所の特定が手間 分岐が多くコードリーディングに手間がかかる 解消する手法 useEffectは１ページに１つ useEffectにdeps自動補完除外コメントを入れる stateはプリミティブにする propsにフラグがある場合はコンポーネントを分ける useEffectは１ページに１つ 悪例: ユーザーイベントの処理 const [foo, setFoo] = useStat
Extracting Logic from React Components - Jack Franklin
July 17, 2017Extracting Logic from React ComponentsIn the previous screencast we took a React component that was doing too much and refactored it, splitting it into two components that are easier to maintain, use and test. Although I'd recommend watching that video first, you don't need to have watched it to read this blog post. You can find all the code on GitHub if you'd like to run it locally.
データベースリファクタリングについて話をしてきた #OSO2017 - そーだいなるらくがき帳
岡山にはオープンセミナー岡山と言う最高のイベントがあります。 okayama.open-seminar.org 昨日は id:t-wada さんや id:naoya さんの資料がホットエントリー入りしてました。 この登壇はそれと同じイベントになります。 その他の方も超豪華講師陣の中で、私が出来る精一杯の経験も踏まえたお話をさせていただきました。 speakerdeck.com この中で出て来る、データベースリファクタリングは本当に素晴らしい本です。 OracleベースなのですがMySQLだろうがPostgreSQLだろうが必ずためになる本です。 ですが、この本は既に廃刊になっており再販の予定もありません… 僕は後世に絶対必要な本の一つだと思っているので再販のためにも皆さんの要望の声を上げていただけるとうれしいです。 そしたらもしかしたら本が世に復活するかもしれません。 またSQLアンチパタ
Railsフレームワークで多用される「options = {} 」引数は軽々しく真似しない方がいいという話｜TechRacho by BPS株式会社
2017.03.22 Railsフレームワークで多用される「options = {} 」引数は軽々しく真似しない方がいいという話 こんにちは、hachi8833です。今回はBPSのSlackでのやりとりを元に記事にいたしました。 私も軽々しい方なので、メソッド定義でoptions = {}が使いたくなったらよく考えることにします。 = {}引数の使い方と歴史 今回の記事化にあたり、morimorihogeさんから= {}引数について詳しく教えていただきました。 本題に入る前に、ここでは= {}引数について必要な部分のみをまとめ、Rubyの引数そのものについては別記事といたします。 はじめに: 「オプション」とは まずおさえておきたいのは、ITの文脈でオプション（option）という言葉を使ったら、その項目は原則として「必須ではない」「あってもなくても動く」という共通理解が求められるというこ
ガード節を用いた if-then-else 文の置き換え : 小野和俊のブログ
昨日 if-then-else 文の順序に関するエントリを書いたところ、いくつか「レアケースは先に切って return する」というブクマコメントがあり、確かにこの点も考慮すべき重要な点なので前のエントリの補完的な意味も含めてエントリを書く。 if (よくあるケース/正常なケース) { // 処理 } else if (比較的特殊なケース) { // 処理 } else if (さらに特殊なケース) { // 処理 } else { // 処理 } しかしもしこれがメソッド/関数で、次のように後続の処理がないものだった場合を考えてみる(後続の処理がある場合には先のエントリに書いた検討を行う)。 public void method() { if (よくあるケース/正常なケース) { // 通常の処理 } else if (特殊なケース1) { // 特殊な処理1 } else if (特殊
Refactoring a JavaScript video store
The simple example of calculating and formatting a bill for a video store opened my refactoring book in 1999. If done in modern JavaScript, there are several directions you could take the refactoring. I explore four here: refactoring to top level functions, to a nested function with a dispatcher, using classes, and transformation using an intermediate data structure. 18 May 2016 Many years ago, wh
How to create giant memory leaks in AngularJS (and other client-side JavaScript)
This guide shows how to create an AngularJS application that consumes more and more memory until, eventually, the browser process crashes on your users. UI/UX Design by We make sure that your target audience has the best possible experience with your digital product. You get: Design tailored to your audience Proven processes customized to your needs An expert team of experienced designers Read mor
AngularJSのベストプラクティスに従っていますか？ -- angular-hintの使い方 - Qiita
最近、AngularJSリファレンスという書籍を書いていたのですが、紙面や時間の都合上書けなかったこともたくさんありました。 というわけで、書籍に書ききれなかった内容を落ち穂拾い的に紹介していきたいと思います。 今回はangular-hintというツールを紹介します。 https://github.com/angular/angular-hint これは、Angularチームの1人が開発しているツールで、AngularJSを使って開発したアプリケーションに組み込んで実行すると、エラーを検出してくれたり、ベストプラクティスに従っているかどうかをチェックしてくれたりします。 ただし、説明文にWIP(Work In Progressの略)と書いてあるので、まだ開発中のようです。 angular-hintを組み込むとアプリケーションが動かなくなることもあるのでご注意ください。 angular-hi
GitHub Code Review Tool for JS, Ruby, Swift, and more - Hound
JavaScript Ruby Python Swift PHP Sass Go Elixir TypeScript CoffeeScript Haml Shell Read more about Hound’s supported linters Convention Defining and sticking with a consistent style helps reduce the amount of decisions that developers need to make when writing code, helping to keep their focus on logic, not semantics and formatting. Consistency When every line of code is written in the same style,
HoundCIでリポジトリに番犬を飼おう
プルリクエストのレビュー時に 「規約では１行あたり最大８０文字なので、１文字削ってください」 などと一々指摘していると人間関係が破綻する可能性があります。 こういう定量的なものに関してはロボットに任せるのが一番です。 そこでHoundCIを使いましょう。 これはRubocopにリポジトリを監視させるというコンセプトのサービスです。 HoundCIを使うメリット コーディング規約違反のコードがmasterに入る前に必ず検知できる チームメンバー全員でRubycopを使う必要がない ダルいコーディング規約に関する議論が可視化できる 人間関係が壊れない（重要） 気軽にみんなでRubocopを使える Rubocopをsyntasticを使ってVimから自動実行する Rubocopを使ってコーディングルールへの準拠チェックを自動化 Qiitaの上のような記事を読んでから、暇があったら導入しようと思っ
ホーム - CloneTracker
当社はCookieを使用して、お客様が当社のWebサイトでより良い体験を得られるようにしています。引き続き閲覧する場合は、プライバシーポリシーに同意したことになります。
Instantiating Service Objects
Instantiating Service Objects In my last blogpost about adapters I promised a more detailed insight into instantiating Adapters & Service Objects. So here we go. Boring style class ProductsController def create metrics = MetricsAdapter.new(METRICS_CONFIG.fetch(Rails.env)) service = CreateProductService.new(metrics) product = service.call(params[:product]) redirect_to product_path(product), notice:
Top 8 Tools for Ruby on Rails Code Optimization and Cleanup | Infinum
Keeping your code clean and organized while developing a large Rails application can be quite a challenge, even for an experienced developer. Fortunately, there is a whole category of gems that make this job much easier. For most people, dead/inefficient code will build up over time. Others will find themselves in a similar predicament when they take over someone else’s project. Actually, my own e
Rendering Collections in Rails
Partials are a great way to break down complex view into more manageable chunks as well as keeping view code DRY. However, rendering a partial for each item in a collection looks ugly: <% @user.comments.each do |comment| %> <%= render partial: 'comments/comment', locals: { comment: comment } %> <% end %>
Using Polymorphism to Make a Better Activity Feed in Rails
You won’t find “polymorphic partials” in Rails’ API documentation. However, the general programming technique of polymorphism can be applied to Rails partials. Example: an activity feed for an eBay marketplace Imagine you are signed into an application similar to eBay. You can buy or sell items on the marketplace. In order to buy an item, you need to bid on it. You see an activity feed that includ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
翻訳: ”命令型のコールバック、関数型のプロミス: Node が逸した最大の機会” by James Coglan
すぐできる AngularJS
Adapters 101
Ruby 2.0で必要なくなったmagic commentをまとめて消したい！ - Qiita
式の分割：説明変数の導入 - Strategic Choice