AtomでPHPの開発環境をつくる - Innovator Japan Engineers’ Blog
こんにちは id:hacktk です。 今回は開発環境の話をしたいと思います。 異なる開発環境でコーディングスタイルを合わせる話 AtomでPHP書く時に入れておきたいパッケージの話 ※ 2017年9月14日、Atom IDEのほうも書きました。 tech.innovator.jp.net ※ 2017年12月3日、Visual Studio Codeに移行しました。 tech.innovator.jp.net 背景 私は普段 Atom で開発をしていますが、他のメンバーは PhpStorm を主な開発環境としているようです。 こういった状況では、各人の環境によってコードのスタイルに差が出てしまいがちですよね。 (例えばタブのソフト/ハード、PHPDocの有り/無しなど) 幸いPHPにはPSR-2というコーディング規約*1があるので、それに従いましょう。 Atomではパッケージを入れること
CSSのクラス名を決めるときに使うリストをつくりました
CSSは設計手法も大事ですが、どういう単語で名前をつけていくかも大事だと思っています。 個人個人でばらつきが出るところでもありますし、「単語名 英語」で検索をして探した単語を使ったけど若干意味合いが違ったといったこともあると思います。 クラス名を決めるためのリストを見かけることもありますが、英単語の読みは書かれていても意味合いが書かれていることは少ないように思います。 自分の確認用と、チームで製作するさいの基準になるようなものを作りたいと思い、単語とその意味を短くまとめてGitHubにあげています。 CSS クラス名リスト | GitHub 以下投稿時の内容です。 名前をつけることは難しいですが、とても重要なことです。 CSSには設計思想が必要ですが、実践するにあたり、名前と機能の意味がとおり、名前のつけ方にブレがないようにするべきです。 このドキュメントでは、CSSでよく使われる単語を分
セミコロンは省略？人気スタイルガイドに学ぶJavaScriptのコーディング規則
インデントにタブとスペースのどちらを使うのがいい？ JavaScriptにセミコロンは付けるべき？ JavaScript Standard Styleを使えばそんな論争にけりがつくかもしれません。 最近、注目を集めている@ferossのJavaScriptスタイルガイド、JavaScript Standard Styleを紹介します。チーム内での開発が円滑になり、プログラミングがより楽しくなります。 JavaScriptスタイルガイドのコーディング規約は、タブとスペースのどちらが良いかといった不毛な議論を無くし、コードに一貫性を持たせてくれます。JSLintやJSHint、ESLintといったLinterで使用できる多くのスタイルガイドのうちの1つです。 もしLinterが分からなければ、SitePointの記事『A Comparison of JavaScript Linting Too
「Advanced Swift」のSwiftコーディング規約 - Qiita
以下は書籍「Advanced Swift」のSwiftコーディング規約の部分を翻訳したものです。原文はオンラインプレビューで公開されています。 Advanced Swift - Swift Style Guide この本を書くとき、そして私たちのプロジェクトでSwiftのコードを書くとき、以下のルールに従うようにしています。 可読性が最も重要です。これには簡潔性が助けになります。 関数には常にドキュメントとしてのコメントをつけましょう。ジェネリクスを使うものは特に。 型は大文字で始め（UpperCaseLetters）、関数と変数は小文字で始めます（lowerCaseLetters）。 型推論を使いましょう。型が明らかなのに明示的に書くことは可読性を損ないます。 曖昧さがある場合や規約を定義する場合は型推論を使わないようにしましょう。（例えばfuncが明示的な戻り値の型を持つのはこれが理由
やさしいPHPコーディング規約の導入・完全版 - コネヒト開発者ブログ
はじめに こんにちは、社内でコーディング規約おじさんと呼ばれ始めて久しい高野(@fortkle)です！ ここ2ヶ月間ほどに渡って通常の開発業務とは別に社内のアプリケーションにコーディング規約を導入する試みをしており、PHP7 Casual Talks や PHP BLT などのPHP関連の勉強会で都度共有してきました。 今回はそれらをまとめ、共有したいと思います。興味のある方の参考になれば幸いです。 開発効率を阻害するもの 弊社が運営している ママリjp、ママリQといったサービスが順調に成長していっている中、その成長を支える開発チームの人数も少しずつ拡大しています。今後もこの流れは続くと思いますが、エンジニアたるものそういった場合でも「コードの質」は落とさずに成長させたいものです。 弊社では非常に丁寧にコードレビューを実施していますが、質の高いコードを維持し続けるためにはコードレビューをよ
JavaScript(ES2015)でvarやletを使う必要はほぼ無い - id:anatooのブログ
ES2015でvarやletを使う場面はほとんど無いので、まずconstを使う。constだとダメな場合にはletを使う。 背景 ES2015では、変数を宣言するための文法としてconstとletが導入された。 const foo = 'foo'; let bar = 'bar'; constは再代入できない変数を宣言できる。letは再代入できる変数を宣言できる。 const foo = 'foo'; foo = 'hoge'; // ERROR let bar = 'bar'; bar = 'hoge'; // OK あれ、じゃあvarとletは同じなの？っていうとそうではなく、letやconstはvarとは違って、関数スコープよりも細かなブロック単位のスコープを提供する。例えばconstやletを使うと、if文やfor文などのブロック中でのみ有効な変数を宣言できる。 で、プロジェクトに
フロントで迷ったら読む自分用！javascript,css,htmlの命名規則やコメントの書き方・ルール・規約・ガイドラインについてとかとか - tweeeetyのぶろぐ的めも
はじめに サーバサイドの人間ですが、だからこそ大事にしたいフロント側のルール。 フロント側を一切を触らないのなら構いませんが触ることも多分にあるでしょう。 フロント大好きなのでそっちメインで触りたい時もあるでしょう。 ってことで、そんな自分がフロントのお作法として守っておきたいというときに参考にする自分用メモです こんなかんじ ってことでjavascript,css,htmlについて それぞれ自分が見返せるように参考サイトとティップスをメモ javascript 命名規則 コメント まとめ系 CSS 命名規則 id,class名のサンプル コメント まとめ系 HTML 文書構造 コーディング規約とかルールとか全般 ※HTMLは命名規則て感じではないですね 注釈 お作法といっても命名規則、コメントなどを主としてまとめました（htmlは文書構造) 部分的でも命名規則について参考になれば参考とさ
コーディングガイドライン - coding lab (コーディング・ラボ)
当コーディングガイドラインはcoding lab（コーディング・ラボ）で現在採用している仕様全般について、制作物の品質（アクセシビリティ・ユーザビリティ・互換性・更新性など）を維持する為に規定したものです。
スタイルリンク - 東京都江戸川区のフリーランス Webデザイナー WordPressエンジニア
WEBサイト制作 WEBサイトの新規作成やサイトリニューアル、部分的な修正、レスポンシブデザインによるスマホ対策、Javascriptで料金計算シミュレーションなどの実装、お問い合わせフォームのプログラム実装(CSVデータ蓄積も可能)など、様々なご要望に対応いたします。 WordPress構築 WordPressを使用することでWordやExcelを使える程度のPCスキルがあればWEBサイトを更新することができるようになります。 WordPressオリジナルのテーマやオリジナルプラグイン、WEBサービス、オウンドメディア、会員制ポータルサイト(Stripe実装)、業務ツールなど、ご要望に応じ開発いたします。
BEMによるフロントエンドの設計 | 第1回 基本概念とルール
BEMによるフロントエンドの設計 第1回 基本概念とルール この記事ではフロントエンドの設計方法「BEM」を紹介します。第1回目はBEMのもっとも基本となるBlock、Element、Modifierの概念と、class名の命名ルールを解説しています。 はじめに 最近フロントエンド界隈で、『BEM』という言葉を見かけることが増えてきました。BEMとは、Block、Element、Modifierの略語です。Webサイトのコンポーネント化のためのフロントエンド設計方法のひとつで、厳格なclass名の命名ルールが特徴的な手法です。 第1回は、BEMをまったく知らない方向けの入門編です。 なぜBEMが必要なのか 私たちはHTMLとCSSを使うことでしか、Webサイトを作ることができませんが、HTMLとCSSにはプログラム的な機能が備わっていません。そのために、フロントエンドエンジニアは次のような
SMACSSにBEMを取り入れたクラス名の命名規則 | SONICMOOV LAB
はじめに みなさまこんにちは！おはようございます！ マークアップエンジニアのうさこでございます！ またお前か・・・という声が聞こえてきそうですね・・・？花粉なんて爆発してしまえばいいと思っている今日この頃でございます。 さて・・・今回はコーディングをする際にきっと頭を抱える方も多いのでは・・・ クラス名の命名規則についてです！！ クラス名の命名・・・地味で単純な作業ですが、悩み始めると止まらず時間のロスに繋がっているのは紛れも無い事実なのです。。 目次 考え方 基本形 Prefix Block Element Modifier 注意点 さいごに 参考URL 考え方 目標はやはりこの4つとなります！ 予測しやすい 再利用しやすい 保守しやすい 拡張しやすい なぜ SMACSS と BEM なのか BEM の Block や Element の考え方は素敵すぎるのですが、クラス名がものすごく冗
PHPコーディング規約とサポートするツール - SHOYAN BLOG
この記事の内容 PHPのコーディング規約とそれをサポートするツールの紹介です。 座学形式で説明していきます。 概要を知りたい場合は以下のスライドを参照ください。 はじまり、はじまり みなさん、こんにちは。 PHPが大好きなプログラマことshoyanです。 今回、PHPのコーディング規約とそれをサポートするツールの紹介をしたいと思います。 なぜ必要か まずはなぜコーディング規約が必要なのでしょうか？ みんなに質問してみる しばらく沈黙 目のあった人に質問する なんか適当に答えてくれる ありがとうございます。 正解です。 補足として、なぜコーディング規約が必要になったかを説明します。 そもそもコーディング規約は一人で開発する場合には必要ありません。 二人以上で開発を行う場合に必要となってきます。 たとえば、太郎くんとドナルドさんが二人で開発をしていたとします。 太郎くんがコードレビューを依頼し
脱・読みづらいコード！今日から一段上のプログラマーになる方法 5 選 - xin9le.net
「ソースコードを綺麗に書く」というのは、プログラマーであれば誰しもが心掛けたいと思っている極めて重要な事柄です。そもそも「綺麗なコードってなんぞ？」という感じですが、いくつかあると思います。 改行位置/空行の数/インデントなどに一貫性があり整っていて、パッと見が綺麗 「こんな難しいことがこんなに簡単に書けるなんて！」というエレガントさ 理解しやすい etc... ひとつ目は美的感覚の問題なので、基本的には人それぞれということで今回は言及しないことにします。チーム開発の場合はソースコード整形ツールで一定のクオリティを維持するのがお手軽ですね。ふたつ目もさておき、今回は「理解しやすさ」について考えてみようと思います。主にプログラミングの勉強を始めた人向け。 ※ 画像を借りているだけで、この本のオススメをする記事ではありません！ 1. そのコードを誰が読むのかを考える 「理解しやすいコード」は「
こんなHTMLとCSSのコーディング規約で書きたい - Qiita
HTML と CSS のコーディングルールを作ろう HTML と CSS のコーディング規約を中心に、メンテナンス性の良い HTML や CSS をコーディングする際に重要だと思うポイントをまとめています。 誰に向けた記事か この記事には、HTML や CSS を書く人に役立ちそうな内容が書いてあります。 特に初級者から中級者の方で、HTML や CSS を一通り学習した方からの反応が良いです。 まだ HTML や CSS の学習を始めて間もないという方は、先に案件やプロジェクトをこなしコーディング経験を積むことをお勧めします。経験を積むとよりこの記事の内容への理解が深まるはずです。 HTML と CSS を書くときに大切なポイント2点 HTML と CSS を書くときに大切だと思うことを書きます。 1. HTML と CSS を書かない あなたがいま書いている HTML と CSS は、
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
PHP コーディング規約 - WordPress Codex 日本語版
CSSをBEM/MindBEMdingの命名規則で書いてみる
クロノドライブのコーディングガイドライン
http://buchineko.website/google_styleguide_css/
http://buchineko.website/google_styleguide_html/
WordPress コーディング規約 - WordPress Codex 日本語版