JavaScript Standard Style
JavaScript Standard Style Sponsored by English • Español (Latinoamérica) • Français • Bahasa Indonesia • Italiano (Italian) • 日本語 (Japanese) • 한국어 (Korean) • Português (Brasil) • 简体中文 (Simplified Chinese) • 繁體中文 (Taiwanese Mandarin) JavaScript style guide, linter, and formatter This module saves you (and others!) time in three ways: No configuration. The easiest way to enforce code quality in your
イマドキのJavaScriptの書き方2018
PySpa統合思念体です。これからJavaScriptを覚えるなら、「この書き方はもう覚えなくていい」（よりよい代替がある）というものを集めてみました。 ES6以降の難しさは、旧来の書き方にプラスが増えただけではなく、大量の「旧来の書き方は間違いを誘発しやすいから非推奨」というものを作り出した点にあります。5年前、10年前の本やウェブがあまり役に立たちません。なお、書き方が複数あるものは、好き嫌いは当然あると思いますが、あえて過激に1つに絞っているところもあります。なお、これはこれから新規に学ぶ人が、過去のドキュメントやコードを見た時に古い情報を選別するためのまとめです。残念ながら、今時の書き方のみで構成された書籍などが存在しないからです。 たぶん明示的に書いていても読み飛ばす人はいると思いますが、すでに書いている人向けではありません。これから書くコードをこのスタイルにしていくのは別にいい
クリーンなJavaScriptコードを書くためのガイド - Qiita
Clean Code PHP / Clean Code JavaScript 以下はClean Code JavaScriptの日本語訳です。 clean-code-javascript Introduction Robert C. Martinの著書Clean Codeは、JavaScriptにも当てはまることばかりです。 これはスタイルガイドではありません。 JavaScriptで3R(Readable、Reusable、Refactorable)なコードを推進するためのガイドです。 ここに書いてあることの全てに従わねばならないわけではなく、普遍的に合意されているわけでもありません。 ただのガイドラインであり、それ以上のものではありません。 しかしこれらは、Clean Codeの著者らが長年の集合知の結果をまとめたものです。 ソフトウェアエンジニアリングの歴史は僅か50年程度のものでし
【全訳】JSだけじゃない！AirbnbのCSS/SCSSスタイルガイド - リクルート住まいカンパニー Tech Blog
こんにちは！2016年に新卒で入社した、SUUMOのフロント開発グループでエンジニアをしているやなぎさわです。 入社早々SUUMOのCSSを再設計をする機会があり、CSS/SASSのスタイルガイドを研究していたのですが、JavaScriptのスタイルガイドで有名なAirbnbがCSSのスタイルガイドを公開しているのを見つけました。 一人で開発していたり、CSS/SASSを書く人が少人数である場合は意外とその重要性に気付きにくいのがこのCSS/SASSのコーディング規約です。CSSは単純な言語であり単にスタイリングを当てるだけであればわりと簡単にできてしまうのですが、大規模開発や修正が頻繁に必要となる運用フェーズになるとその単純さがゆえにバグを作り出しやすくなってしまいます。 特にCSSでは全てのセレクタのスコープがグローバルであり、気を抜くとすぐにクラス名などが被ってしまいます。BEMとO
細かすぎるけど伝わってほしい私的BEMプラクティス30（ぐらい）
BEMのいいところは、それが何者なのかが明白ということに尽きる。とある要素を見たときに、そのスタイルがどこに書かれているのか、何を表しているのかがクラス名を見ればわかる。手を入れる際も、どこに追記すればよいのか、どれくらいの影響を及ぼすのかの大部分が推測できる。 レスポンシブ・デザインと相性がいいとか、流行りのコンポーネント指向と相性がいいなど、BEMの良さは他にもいくつか挙げられるけど、決定的なのは明瞭さであると思う。 BEMを使いはじめてかれこれ３，４年くらい経った。その間に色々な命名規則や設計思想が登場してきたけれども、今のところは浮気する程の魅力を他に感じることもなくBEM一筋でやってきている。ただし実践するにつけて、より明瞭で破綻しづらい設計を実現するために、様々な制約やガイドを設けてやってきたので、「もともとのBEM」からは多少なり離れているかもしれない。 ただし、それはBEM
フロントエンドチェックリスト（日本語訳） - Qiita
GitHubで公開されているフロントエンドチェックリストというドキュメントが、網羅されている内容が幅広く便利そうだったので、日本語に翻訳しました。 日本語版は、以下のGitHubリポジトリにあります。GitHub側と自動的に連携するようにしておりますので、誤訳や誤りなどがあれば GitHub のプルリクエストまたは Issue で報告していただけると幸いです。 https://github.com/miya0001/Front-End-Checklist 日本語版への貢献方法 最終更新日時: 2017-11-19 03:50:47+09:00 (未翻訳) Front-End Checklist The Front-End Checklist is an exhaustive list of all elements you need to have / to test before lau
真偽値を返す関数のネーミング - Qiita
みんな exists を使ってます。 納得できようができまいが、exists なのです。 ソフトウェアの世界では、Apple と Microsoft と Google が黒と言ったら黒です。 黙って従いましょう。 このように、関数名の表現に困ったら、世の中の API を参考にすると良いです。 非ネイティブの我々では思いつかないような的確な表現が見つかることもあります。 関数の名付け方 真偽値を返す関数は if 文で使われることが多いので、頭に if を置いて最もしっくり来る表現が良いと思います。 個人的には、真偽値を返す関数名を考えるときは以下のフォーマットに当てはめるようにしています。 if オブジェクト名 関数名 「項目が選択中だったら」なら "if item is selected" なので関数名は item.isSelected() となります。 同様に「項目が存在したら」なら "
PHP: Clean Code (clean-code-php) 蜜柑薬 - Qiita
もくじ はじめに 変数 関数 オブジェクトとデータ構造 クラス S: 単一責任の原則 (SRP) O: オープン/クローズドの原則 (OCP) L: リスコフの置換原則 (LSP) I: インターフェイス分離の原則 (ISP) D: 依存逆転の法則 (DIP) 同じことを繰り返すな (DRY) はじめに この記事はRobert C. Martinの本「Clean Code」のソフトウェアエンジニアリングの法則をPHPに適合させたものです。これはスタイルガイドではありません。読みやすく、再利用しやすく、そしてリファクタリングしやすいPHPコードを書くためのガイドです。 ここで挙げられるすべての原則は厳密に守らなくてはいけないわけではなく、少し守らなかったところで一般には許容されます。あくまでガイドラインですが、Clean Codeの著者たちがみな長年に渡って経験してきたことです。 この記事(
翻訳: Kotlinベストプラクティス『Idiomatic Kotlin. Best Practices』 - Qiita
この記事について Philipp Hauer's Blog Idiomatic Kotlin. Best Practices この記事はKotlinらしくKotlinを書くベストプラクティスが書かれており、とても参考になります。 許可をいただいたので、翻訳させていただきます。 もし間違えやもっと良い翻訳などあれば編集リクエストかtakahiromまでお願いします。 kotlinを最大限活用するために、Javaにおけるベストプラクティスを考え直す必要があります。Javaのベストプラクティスの多くはKotlinに提供されている機能によって置き換える事ができます。Kotlinらしい(Idiomaticな)Kotlinを書いて、Kotlinのやり方を見ていきましょう。 警告の言葉 : 以下のリストは網羅的ではなく、また私の控えめな意見を言っているだけです。さらにいくつかのKotlinの機能は健全な
今日から使える文章校正テクニック | DevelopersIO
渡辺です。 昨日のエントリーが結構反響大きめだったので、第二弾です。 文章校正をしていてよくあるパターンを幾つか抽出してみました。 ただし、前回紹介しているパターンは除外していますので、あわせて確認ください。 重複を減らす 文章校正の基礎は 重複を減らす ことです。 次の文章を見てみましょう。 AWSを使い慣れている人にとっては簡単な作業ですが、使い慣れていないと戸惑う所も多いところです。 この文章がくどく感じる理由は、「使い慣れている」が重複していることです。 前後関係もありますが「ところ」がなにを指しているのかも曖昧ですね。 後半の「使い慣れている」を削除し、バランスを取るために作業を後ろに移動しました。 さらに、前の文章を受けるため、「これは」を追加します。 これは、AWSを使い慣れている人にとっては簡単ですが、そうでないと戸惑う作業です。 スッキリしました。 しかし、「慣れていると
なぜあなたのPull Requestは読まれないのか - Qiita
Pull Requestを出してレビューしてもらってから反映。 どこにでもあるありふれた開発フローに付きまとう、どこにでもあるありふれた問題。 「Pull Requestがレビューされない」 もちろん開発フローにレビューが含まれている以上、レビューをしないメンバーにも非がないとは言えませんが、多くの場合はレビューされないPRには問題があるものです。 デカい 兎にも角にもデカいPRは読むのがつらいです。 もちろん要件が明記されていないなど、他にもPRが読みにくくなる原因はたくさんありますが、一番はこれです。 極端な話、1行変更のPRは他に何も書かれていなくても実装内容を察することができますが、10ファイル100行の差分と箇条書き20点の要件が書かれたPRは内容を把握するだけで一苦労です。 しかし、このこと自体は数カ月でもコードを書いていれば自然と勘づくもの。 問題はなぜPRが大きくなってしま
外国人が語る：英語でクラスやメソッド等の名付け方 - Qiita
アメリカ人です。 Hello 👋 この記事の目的 多くの日本人は自分の英語力には自信がないではないでしょうか。残念ながら「英語がわからん」、「英語が全然できない」という声をしょっちゅう聞いています。でも、今まで英語ができて意味がちゃんと伝わる何人かの日本人に会ったがあります。完璧な英語ではないけど(外国人も英語でミスる時もある...)、がんばって話そうとするので充分仕事ができる人たち。そういうがんばる姿勢はオープンソースのプログラムや英語圏のプログラムに手を出すためには一番大事なことだと思います（外国人側もすごく助かります）。日本の文化では「私はできる！」と自慢することは少ない中、この記事を通して、流暢に話せなくても自分のプログラミングの命名の仕方にはちょっとだけでも自信を持たせたいなと思います。完璧じゃなくていいです。Let's go! 合わせて読んでいただきたい 【日本人エンジニア必
API design guide | Cloud APIs | Google Cloud
Send feedback API design guide Stay organized with collections Save and categorize content based on your preferences. Changelog Introduction This is a general design guide for networked APIs. It has been used inside Google since 2014 and is the guide that Google follows when designing Cloud APIs and other Google APIs. This design guide is shared here to inform outside developers and to make it eas
[社内新人向け]Gitで使ってほしくないコマンド - Qiita
社内に新人が増えてきたので、弊社のWeb開発でのGitのゆるーい利用方針をまとめます。 本当はネガティブなことばかり書かずに、「覚えて欲しいコマンド、使ってほしくないコマンド」というタイトルにしたかったのですが、予想以上に長くなりそうなので分けます。 (追記：第二弾できました) → [社内新人向け]Gitで絶対にオススメなプラグインや設定3つ 社内環境 Web系開発がほぼ100％ ブランチワークはGitflowをベースにしたプルリク駆動開発 少人数チームなので、エンジニアは全員LinuxのCUI操作をできて欲しい（vagrantや開発サーバ上の操作など） GitのGUIクライアントは、SourceTreeとGithub公式を試しましたが、初学者が使うと却って危ない挙動をしてしまうケースがあったので、全員CUI操作をしてもらうことにしました CIツールはまだ導入できず。各サーバーへのデプロイ
![[社内新人向け]Gitで使ってほしくないコマンド - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/c02b564a55050853439b0f6986d3aa42501396d4/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCJUU3JUE0JUJFJUU1JTg2JTg1JUU2JTk2JUIwJUU0JUJBJUJBJUU1JTkwJTkxJUUzJTgxJTkxJTVER2l0JUUzJTgxJUE3JUU0JUJEJUJGJUUzJTgxJUEzJUUzJTgxJUE2JUUzJTgxJUJCJUUzJTgxJTk3JUUzJTgxJThGJUUzJTgxJUFBJUUzJTgxJTg0JUUzJTgyJUIzJUUzJTgzJTlFJUUzJTgzJUIzJUUzJTgzJTg5JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz00YzYzNDI4NzA3YjAxYTI4Y2QzMzAyOTFjYzQzMTkxYQ%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDB6YXJhbW1lJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1mZDc5M2U2Y2U4OTg4ZTM4OTI2YmE3NDkyOTc1MDJkZQ%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3Dc30c566ec78e040079beb6919643238f)
Polyfill のあり方と Web の進化と協調するためのガイドライン | blog.jxck.io
Intro W3C の TAG から、主にブラウザ API の Polyfill に関するドキュメントが公開された。 Polyfills and the evolution of the Web Polyfill は便利な一方で、時として標準化の妨げになってしまう場合があるため、それを避けるために、 Polyfill 実装者、利用者、仕様策定者などが、どう振る舞うべきかという趣旨である。 今回はこの内容を元に、 Web の進化と協調する Polyfill のあり方について、主に「実装者」がどうすべきかに着目し記す。 Web における Breaking Change Breaking Change は、簡単に言えば 後方互換を失うことで既存のものが壊れる可能性がある変更 のことを表す。 そして、 Web における Breaking Change (Break the Web)、具体的には W
実装を引き受ける前に詰めておくべきWebフロントエンドの想定漏れチェックシート - Qiita
リキッドレイアウトのように幅が常に変動するレイアウトのデザインは、動かないカンプからは実際の挙動が読み取れず、デザイナーの意図が汲み取りきれないことが多い。また、複雑化するアニメーションの実装においても、カンプだけではコミュニケーションに不備が生まれてしまう。ほかにも、CMSを使った案件ではデザインカンプと実際のデータの間に齟齬がある可能性もある。 実装効率を高めてスケジュール通りに仕事を終わらせるには、とにかく事前に仕様を固めることが大事だ。ワイヤーフレームやデザインの途中の段階からなるべくデザイナーとコミュニケーションを重ね、想定外の要件が発生しないように気をつけるべきだろう。 この記事では、デザイナーやフロントエンドエンジニアが見落としがちなWebフロントエンドの課題について列挙していく。 ホバー表現を後から指示される ツッコミ 後から仕様追加されると困るから先に決めて! メモ 最近
誰も教えてくれない「分かりやすく美しい図の作り方」超具体的な20のテクニック
【追記】この記事をきっかけに、名著「ノンデザイナーズ・デザインブック」の20周年記念特典eBookの制作に協力させていただきました。詳しくはこちらを御覧ください。 ノンデザイナーズ・デザインブック20周年記念の特典に寄稿しました デザイナーである・なしに関わらず、仕事の中で伝えたいことを「図」で説明する機会は多々あります。提案書で事業内容を説明することもあるでしょうし、具体的な数値をグラフで説明することもあるでしょう。そんな中でこんな指摘を受けたことはありませんか？ ・最終的に何を言いたいのか結論が見えないよ。 ・関係性が複雑すぎて理解しずらいんだけど。 ・要素が多すぎて全てを把握するのが大変。 ・何をどこから見れば良いの？ ・結局一番言いたいことはなんなの？ ・文字サイズがたくさんありすぎてまとまりがないね。 ・安っぽいチラシみたいでダサイなぁ。 ・全体的にバランスが偏ってて不安定。 ・
これだけは覚えたい、ユニットテストを書くための４つのデザイン - Qiita
もうちょっと規約的なものを「JavaでのUT作成基準を整理してみた」にもまとめてみました。 はじめに 去年、ブログの方に「ふつうのユニットテストのための７つのルール」という記事を書いたのですが、思ったより反響がありました。 あの記事で書いたのはあくまで原理・原則で、それを実現するためにはいくつかのテクニックが必要です。 特に、ああいうルールを作って「ユニットテストを書く事」を厳守するようにしても、 適切なテクニックを知らなければメンテが困難だったり、品質に寄与しなかったり、実行性能が悪いゴミが量産される可能性があります。 じゃあ、どうすれば良いかというと「最初からユニットテストが書きやすいように元のコードを設計する」ということです。 そう。まず身に付けるべきは「テストコードの書き方」では無く「テスト対象コード」すなわち「プロダクトコードの書き方」なのです。 また、ここで言ってる「最初から」
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - shieldfy/API-Security-Checklist: Checklist of the most important security countermeasures when designing, testing, and releasing your API
マテリアルデザインでやってはいけない68のこと（間違いチェックリスト）
