PSRとコーディングスタイルの関係、そしてPERへ - Qiita
• PSR-1は高度な技術的相互運用性を目的としたコーディング標準 • PSR-2/→PSR-12はプロジェクト内での認知的摩擦を軽減するためのスタイルガイド • PSR-12はPER Coding Styleに進化した PSRとは何か PSRが何ではないかについて下記の記事にまとめたので、あとでゆっくり読んでください。 というか↑の記事にだいたい書いたので、この記事はコーディングスタイルに絞った内容ということになります。 重要な部分だけ抜萃して再掲しましょう。 PSRを管理するのはPHP-FIG (The PHP Framework Interoperability Group、PHPフレームワーク相互運用グループ)です。この組織はPHPのフレームワーク・CMS・ツールなどの開発者の寄合所帯です。 Frequently Asked Questions - PHP-FIGの内容をざっくり訳
レスポンシブwebデザインのコーディングでやってること - kojika17
今年、携わった案件のほとんどがレスポンシブWebデザインでした。 今更ですが、私がレスポンシブWebデザインのコーディングでやっていることや気を付けていることを整理してみたいと思います。 User Agent Style Sheetの対応 ブラウザのデフォルトで設定されているスタイルシートの差異を埋めるCSSは「Normalize.css」をよく使います。 デザインによっては、Eric Meyer’s的なRest CSSの方がやりやすい場合もあるので、そこは見た目に臨機応変に対応してます。 CSS Flexible Box 私が受け持つ案件では、最新ブラウザ、及びInternet Explorer 11（IE11）のみの対応が増えたため、近年では、Flexible Boxをカジュアルに使用できるようになりました。 個人的には、広い画面では横並びだったものを、displayプロパティを変更す
気をつけて！Git for Windowsにおける改行コード - Qiita
これをみるとinputやfalseはLF -> CRLFの自動変換を行わないので、これらを選んでしまいそうですが、 大規模開発で多数の開発者がtrueでインストールしてしまった場合、わざわざ変更をしてもらうまでの悪影響があるのか？がわからなかったので、それについて調べた結果を記載しようかと思います。また、これを書くきっかけとなった私のチームではまった落とし穴について書こうと思います。 core.autocrlfをtrueに設定をした場合 core.autocrlfをtrueに設定をした場合について整理します。 チェックアウトやコミットした場合の動きや、開発者がCRLFでファイルを作成した場合の動きは以下のようになります。 上記の図から確かにwroking directory上ではCRLFとLFが混在してしまう可能性がありますが、 repository上のファイルがLFである以上、core.
PHP_CodeSniffer & WordPressコーディングスタンダードで効率よくコードをチェック » 群馬県高崎市のWordPressホームページ制作会社 | Kiraba（キラバ）
投稿日: 2016/08/10 作成者: Horiguchi カテゴリ: PHP,Wordpress,ブログ 今回はPHP CodeSnifferを使ってWordPressのコーディングチェックと修正を効率良く行う方法をご紹介します。 コーディング規則に従っているかチェックするのを目視で確認していくのはけっこう大変です。PHP CodeSnifferを使えば誤っている箇所を指摘してくれるので効率よくコードを修正することができます。 ちなみに「Sniffer」とは嗅覚探知機の意味だそうです。名前の通りPHP Codeのエラーを探索してくれます。 Home Brewのインストール PHPのパッケージ管理システムComposerをHome Brewを使ってインストールします。 まずはBrewのインストールからやっていきましょう。以下のコマンドでインストールできます。 /usr/bin/ruby
フロント作業の効率化
下記勉強会の発表資料です。 --------------------------------------------------------- JSLOVE 〜JavaScriptを愛する人の話を聞いてみよう〜 http://devlove.doorkeeper.jp/events/5811 ---------------------------------------------------------
JavaScriptでセキュアなコーディングをするために気をつけること – cybozu developer network
（著者：サイボウズ kintone開発チーム 天野 祐介） kintoneはJavaScriptを使って自由にカスタマイズすることができます。 カスタマイズにより独自のリッチなUIを構築したり、新しい機能を追加したりできるようになりますが、セキュアなコーディングをしないとクロスサイトスクリプティング脆弱性を作り込んでしまう危険性があります。 この記事では、JavaScriptでセキュアなコーディングをするための基本的な点を解説します。 主な原因 脆弱性を作り込む主な原因になるコードは、要素の動的な生成です。特に、レコード情報などのユーザーが入力した値を使って要素を生成するときに脆弱性が発生しやすくなります。 対策 document.write()やelement.innerHTMLを使って要素を生成するときは、コンテンツとなる文字列をかならずHTMLエスケープするようにしましょう。 以下は
PHP_CodeSnifferを使ってWordPressのプラグインやテーマがコーディングスタンダードに準拠しているかチェックする | Firegoby
PHP_CodeSnifferを使ってWordPressのプラグインやテーマがコーディングスタンダードに準拠しているかチェックする 先日、海外のユーザーさんから「おまえWordPressのコーディングスタンダートをガン無視してるやないか！」というツッコミを頂きまして、「あーすいませんすいません」みたいなやりとりをしてたら、コマンドラインでコーディングスタンダードに準拠しているかどうかをチェックするツールを教えてもらいました。 PHP_CodeSniffer + WordPress-Coding-Standards コーディングスタンダードに準拠しているかどうかをチェックするためのツールとしてはPHP_CodeSnifferというのが有名です。 http://pear.php.net/package/PHP_CodeSniffer/ このPHP_CodeSniffer用に作られたWordPr
スマートフォンサイトのコーディング Tips あれこれ | バシャログ。
ゴールデンウィークはゴールデンに過ごせそうにない Latin です。 今回はスマートフォンサイトのコーディング周りでのあれこれをまとめてみます。 先日の macky の記事、「スマホサイトの矢印付きメニューをCSSのみで実装する。」もあわせてご覧ください。 viewport 系の設定 描画サイズをデバイスの横幅に合わせる、拡大縮小を不可に これが一番よく見る形式でしょうか？ <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> 文字サイズの自動調整をオフにする 各スマホブラウザでは、横向きにすると text-size-adjust の処理が走り、自動で文字サイズを最適化（拡大）する機能があります。 読
jQuery Coding Standards & Best Practices
All variables that are used to store/cache jQuery objects should have a name prefixed with a $. Always cache your jQuery selector returned objects in variables for reuse. var $myDiv = $("#myDiv"); $myDiv.click(function(){...}); Use camel case for naming variables. Use ID selector whenever possible. It is faster because they are handled using document.getElementById(). When using class selectors, d
JavaScriptのコーディングTips集 - 主に言語とシステム開発に関して
JavaScriptのプログラミングに関するTips集。 主に中級レベルの話題とノウハウを掲載する。 なお，JavaScript初級〜中級をクイズ形式で網羅的に学習するためには，下記のエントリを参照。 JavaScriptの動かないコード (JavaScriptエラー集) http://language-and-engineering.hatenablog.jp/entry/20080912/1221297779 ※JavaScript以外のプログラミングについては，こちらを参照。 ピュアJSを極める： JavaScriptで，クラスを継承する方法 （複数のサブクラスから共通クラスのプロトタイプを参照する） JavaScriptでの例外設計 （throw，try-catch-finally構文のイメージと利用パターン） JavaScriptで，動的に追加されたイベントリスナの実行順序を保
[取り組み] フロントエンドでコーディングスピードをアップさせる６つの方法！と思って書いてたら30個も書いちゃった。 - YoheiM .NET
[取り組み] フロントエンドでコーディングスピードをアップさせる６つの方法！と思って書いてたら30個も書いちゃった。 こんにちは、@yoheiMuneです。 フロントエンドとしてHTML,CSS,JSを中心と開発を行うことを仕事にして早くも半年が経ちました。 最近はだいぶ効率的にコーディングが出来てきたとやっと実感してきたので、ブログにも自分のコーディングスピードアップのコツを書きたいと思います！ 「こんなのよりももっと良いのあるよ」などたくさんの感じる点があるかと思います。ぜひTwitterなどで教えて頂けると助かります。 コーディングをスピードアップする６つ＋αのポイント 自分が思うにコーディングをスピードアップする最も大切なポイントは以下ではないかと思います。 めんどくさいと感じること、そして改善に動くこと 幸い自分はかなりのめんどくさがり屋で、コーディング中も「これ手動！？」「マウ
![[取り組み] フロントエンドでコーディングスピードをアップさせる６つの方法！と思って書いてたら30個も書いちゃった。 - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/d5148c26b0ae2a3585b08c6cf755d68966d223de/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F225.jpg)
現場で使える効果的なHTML&CSS構造設計（Effective HTML&CSS）
実務でよく使うhtml,css,jsの小技をつらつらと紹介します。 ※2/11のスクーの授業中で使った資料です。 https://schoo.jp/class/1776 【オシャレCSS編】 1. transformを使って要素を変形させるワザ 2. transitionを使い、CSSだけで簡単なアニメーションを行うワザ 3. keyframesを使ってCSSだけで複雑なアニメーションを行うワザ 4. 矢印アイコンをcssだけで表現するワザ 5. アイコンをアニメーションさせるワザ 6. CSSプロパティ”filter”で画像を加工するワザ 【地味だけど使えるワザ編】 7. 今どきの、要素を上下中央寄せにするワザ 8.「flexbox」で要素を自由自在に整列させるワザ 9. Windowsでwebfontをちょっとマシに見せるワザ 10. ア
HTMLコーディングの問題点を浮かび上がらせてくれるブックマーク·DiagnostiCSS MOONGIFT
DiagnostiCSSはJavaScript製のオープンソース・ソフトウェア（MIT License）です。 Webブラウザはよく出来ていて、Web標準に沿っていなくともそれっぽく表示してくれます。しかしそれに安穏としているとレガシーなブラウザなどで表示が失敗したり、意図した動作にならないことがあります。そこでDiagnostiCSSを使ってチェックしてみましょう。 MOONGIFTで実行しました。様々な枠が表示されました。 マウスオーバーで画面上部にメッセージが表示されます。例えばonclick指定の指摘です。 かなりダメなところは赤い枠になっています。 DiagnostiCSSでは問題のあるHTML要素について枠で囲むことで問題を把握しやすくしてくれます。主にインラインスタイルやイベント属性、無効なリンク、空または廃止予定の要素、必要な属性のない要素などがリストアップされます。 HT
メンテナブルCSS
概要 メンテナブルなCSSを目指し、定義された一般的なCSSルールの紹介と、それらのルールを適用するにあたって活用できるツールを報告します。 1. 序論 CSSは記述ルールが簡素であり、少しの学習コストですぐに記述ができる手軽なツールです。 しかし、大規模なアプリケーションで複数人で開発するケース等では、見栄えだけしか考えずに身勝手にコーディングしてしまうと、 非常にメンテナンスコストがかかる負の遺産が作られてしまいます。 そのためCSSの品質を保つために様々なプロジェクトで、CSSの定義ルールが決められています。 本稿では一般的なCSSの定義ルールと、そのルールがなぜ作られたのかを合せて報告致します。 また、CSSのルールを適用するにあたって、手動・目視でルールの適用をチェックするのは非常にコストが高い作業です。 これらルールの適用を補助するツール群を、合せて報告致します。
一度書いたコードは二度と探さない！スニペットを究めて快適コーディング！【HTML, CSS, JavaScript】 | WebNAUT by Beeworks
一度書いたコードは二度と探さない！スニペットを究めて快適コーディング！【HTML, CSS, JavaScript】 ※この記事は2013年8月26日に執筆された記事です。現在は仕様が異なる可能性があります。 気がつけば繰り返し同じ単語で検索し、同じコードを書いている…なんてことはありませんか？「この部分の記述、もう一回使うことがあるかも」と思ったらぜひスニペットとして登録しておきましょう！ スニペットとは繰り返し登場するコードの断片、またはそれをすぐに呼び出せるように管理するエディタの機能のことです。自分がよく使用する記述をスニペットにしておけばいちいち検索したり、昔書いたソースを探ってみたりすることなく、使いたい時に正確な記述をサッと呼び出して使うことができます。 Dreamweaver、Sublime Textなどのオーサリングツールやテキストエディタにはスニペットを自在に使うための
【業務効率が変わる！】こんな時に役に立つ「正規表現」の使い所 | WebNAUT by Beeworks
※この記事は2013年7月10日に執筆された記事です。現在は仕様が異なる可能性があります。 大変です！ あなたは、公開間近でクライアントから少々面倒な修正依頼を頂きました。 対応したいのですが、大型案件の為、納品するページ数は膨大にあり、該当する箇所がどれほどあるのか想像がつきません。 さて、この場合どのような対応がベストでしょうか？ 今回は、ベストな対応をしたい方の為に便利な正規表現の使い所をご紹介します。 公開間近でクライアントからこんな修正依頼が、、、 クライアントから下記の修正依頼を頂きました。 該当するページ数は未だ不明ですが、調査対象は明日公開予定の膨大な数のHTMLファイルです。 1. ¥を円の表記に統一（¥9,000→9,000円） 2. 「しております」「してます」を「しています」に統一 3. 外部リンクのaタグは別窓指定 4. 素材と販売元の行を入れ替える 5. 最後の
LESSで3倍ラクするスマートフォンコーディング 記事一覧 | gihyo.jp
運営元のロゴ Copyright © 2007-2024 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
コーディングがラクになる！？ “自分仕様”のさくさくコーディング法
クリーンな WordPress サイトのための PHP コーディングのお作法 ― 計画的に WordPress を拡張していくためのフレームワーク思考 | WordCamp Tokyo 2011
http://www.hp-stylelink.com/news/2013/10/20131008.php
