コーディングガイドラインまとめ【2019年 → 2020年度版】

新規サービス開発や、古びたシステムを担当した時に毎回調べるHTML, CSS, Javascriptのコーディングガイドライン。こちらをまとめてみました。

Javascript

google

英語版ですが、Good / Badで例が全パターンまとまっているのでとてもわかりやすいです。

これを例にレビュー時にここがBadだから修正お願いしますとか言いやすい。

日本語版があると良いのと、もう少しスタイリッシュなUIを期待したいところ。

https://google.github.io/styleguide/javascriptguide.xml

jquery

こちらも英語版ですが、Googleと同じくGood / Bad で分かれています。

Airbnb

Babel利用前提として作られています。最近はReact/ Next.js、Vue / Nuxt.jsを使うユーザも増えているので、Babel前提の企業も多いのではないでしょうか。
そんな時にこのガイドラインをベースに考えられるとスムーズかと思います。
GitHub

JavaScript Style Guide. Contribute to airbnb/javascript deve…

wordpress

日本語のJavascriptコーディング規約です。

Jqueryのコーディング規約をベースとして、一部WP用に変更しているようです。

Japanese Team

今や JavaScript は WordPress コアだけでなく、テーマやプラグインなどの WordPres……

felixge Node.jsスタイルガイド

個人の方がNode.jsのガイドラインを書いています。Node.js全般のガイドラインを書いているため、最近の分野では適応しやすいです。

HTML/CSS

Google

Godd / Bad で構成されており、大変見やすいガイドライン。

英語版しかないので翻訳して確認が必要になりますが、事例があるので読めなくてもコードは読めるのでわかりやすいです。

wordpress

日本語版がありましたので、こちらを記載します。

事例とともに色分けされているのでとても見やすいです。

Japanese Team

HTML 検証 すべての HTML ページは「W3C Validator」を使用してマークアップが整形式である……

crono drive

各タグの使い方や構成などが細かくガイドライン化されています。
他のガイドラインよりもコードの書き方以前にタグの使い方をまとめているので、参考になる箇所も多いのではないかと思います。
綺麗なコードを書くためにエンジニア全般に人気の書籍がこちら。

Fatal error: Uncaught Error: Call to undefined function set_post_views() in /home/jszk/desnote.com/public_html/wpjs/wp-content/themes/the-thor-child/single.php:658 Stack trace: #0 /home/jszk/desnote.com/public_html/wpjs/wp-includes/template-loader.php(78): include() #1 /home/jszk/desnote.com/public_html/wpjs/wp-blog-header.php(19): require_once('/home/jszk/desn...') #2 /home/jszk/desnote.com/public_html/index.php(17): require('/home/jszk/desn...') #3 {main} thrown in /home/jszk/desnote.com/public_html/wpjs/wp-content/themes/the-thor-child/single.php on line 658