PHP: 変数がセットされていることを確認する方法

if ($var), isset, empty, is_null など,変数の値のセット状況を判定する方法がある.
それぞれの違いについて調べてみた.

参考: PHP isset, empty, is_null の違い早見表

「if ($var) / empty」と「isset / is_null」は判定結果が逆となっていますね.

設定済みの判定は,if (!empty($var)) がいいのかな?

PHP初学者のプログラミング Tips

他のプログラミング経験者が PHP のコードを見て,「PHPってこうやるんだなぁー」と感じたところをメモしておきます.

‘?’で区切られた最初の値を取得する

list( $activate_path ) = explode( ‘?’, wp_unslash( $_SERVER[‘REQUEST_URI’] ) );

ファイルの有無を判断する

if ( file_exists( ABSPATH . ‘wp-config.php’ ) ) {

クラスのインスタンスか?判定する

型演算子 instanceof を使用する.

バージョン比較する

version_compare( phpversion(), ‘7.0.16’, ‘>=’ )

カレントディレクトリの指定ファイルを処理する

require( dirname( __FILE__ ) . ‘/wp-blog-header.php’ );

リクエスト種別を判断する

if ( ‘POST’ != $_SERVER[‘REQUEST_METHOD’] ) {

指定文字列が含まれていないことを確認する

if ( 0 === strpos( $_SERVER[‘REQUEST_URI’], ‘http’ ) ) {

フォルダにある処理が記述されていない index.php はファイル一覧を公開しないためのファイル

WordPress には,セキュリティーに配慮した,以下の記述のみの index.php が配置されているディレクトリがある.

1
2
<?php
// Silence is golden.

javascript を使用する

1
2
3
4
5
6
<?php if ( ! empty( $input_id ) ) : ?>
<script type="text/javascript">
try{document.getElementById('<?php echo $input_id; ?>').focus();}catch(e){}
if(typeof wpOnload=='function')wpOnload();
</script>
<?php endif; ?>

@(エラー制御演算子)

「PHP はエラー制御演算子(@)をサポートしています。PHP の式の前に付けた場合、 その式により生成されたエラーメッセージは無視されます。」
とのこと.あまり使用しない方が良い気がしますね.
参考: エラー制御演算子

コロン構文

if文などで,本来「{」があるべき箇所に「:」があったので調べてみた.
php では,コロン構文といい,HTMLタグとPHPの処理が混在する箇所で使用されているらしい.
判定処理が複数のタグに渡る場合などは使用せざるを得ないですね.

グローバル変数

PHP の独自言語仕様と思える箇所もあるので,global キーワードなど最初にチェックしておいた方が良いと思います.

参考: PHP $GLOBALS(グローバル変数)のすべて!【初心者向け基本】

定数定義

クラス外で定数を定義する場合,define,クラス内で定数を定義場合,const.という使い分けで良いと思います.

用語

PEAR (PHP Extension and Application Repository) : PHPで記述されたPHP拡張ライブラリ
PECL (PHP Extension Community Library) : C言語で記述されたPHP拡張ライブラリ

PhpStorm で Git リポジトリにプロジェクトを追加する方法

1. バージョンコントロールで git を選択

VCS – Enable Version Control Integration …

2. プロジェクト フォルダを add,commit する

処理時にアナライズ処理?が入るため,大量にコミットする場合は,SourceTree の方がいいかも?

参考: Gitリポジトリを設定する
参考: JetBrains IDE(IntelliJ IDEAなど)を使う時のgitignoreについて

Sass 始める時に参考にしたこと

▼ 設計手法について

設計手法については幾つかあるらしいですが,なんとなく主流は BEM と呼ばれるものらしい.

BEM

3つの要素を元に名前を設定する.
Block, Element, Modifier

Block__Element–Modifier
Block–Modifier

▼ Sass の表記

div タグの class 属性などは以下のように記述する.

class セレクタの始まりを「.」にする
id セレクタの始まりを「#」にする

▼ Sass 主な機能

& 親参照

以下の html と main.scss をビルドすると添付のような文字色で表示される.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" href="./dist/css/main.css">
  <title>Document</title>
</head>
<body>
  <p>赤い文字</p>
  <p class="green">緑文字</p>
  <p><span class="blue">青い文字</span></p>
</body>
</html>
1
2
3
4
5
6
7
8
9
/* main.scss */
p {
  color: red;
  &.green {
    color: green;
  }
  .blue {
    color: blue;
  }

▼ mixin

@mixin で定義して,@include で適用する.

▼ インターポレーション(#{})

変数の参照

参考:
今更ながらBEMについてと、それに対応するSassについてまとめてみる
BEMをSassで快適に書く方法

▼ sass と scss の違いは?

記法のことを指していることが多く,scss 記法が CSS に近いルールで記述できる.
主流はこちらになっている.

HTML,CSS3 メモ

いまさらながらですが,ちゃんとHTML,CSS3とか見たことがなかったので,体系立てて少し見てみました.
用語,仕様が複雑ですね… ベンダープレフィックスとか…

▼ レイアウトの変遷

1. テーブルレイアウト
2. float
3. Flexbox
4. Grid Layout

レイアウトには流行廃りがあって,上記のような感じらしい.
プログラマであれば,今後は bootstrap4 あたりをチェックすれば良いと思う.
でも結局なんとなく全部把握しておく必要があるかも…

参考: CSSレイアウトにfloatは古い! 初心者でも始められるFlexbox入門

日本語対応!CSS Flexboxのチートシートを作ったので配布します

▼ ブラウザ間の差分をなくす方法

html 各要素のブラウザ毎に異なる差異をなくしてスタイルをリセットするスタイルシートを適用すれば良い.
sanitize.css

リセットCSS,ノーマライズCSS,サニタイズCSSなど初心者には区別が付けにくい言葉があったので,ついでに調べておく.

【サンプルあり】リセット・ノーマライズ・サニタイズCSSの違いと使い方

▼ html ファイルから css ファイルの指定方法

1
<link href="css/base.css" rel="stylesheet" type="text/css">

▼ css セレクタ

より後から読み込まれたスタイルが適用される.
・要素の状態によって適用できるセレクタに擬似クラスがある.
・全ての要素に適用する「*」.
・擬似要素 :first-letter / :before / :after

参考: CSS 複数のセレクタを指定する/絞り込むサンプル
参考: CSSのセレクタとは?覚えておきたい25種類と書き方
参考: cssを書く人がブクマしておきたいジェネレーターサイト8選

▼ css ショートハンド

margin プロパティなどの数字の指定方法は以下の通り.

1つ 4辺とも同じ値
2つ 上下,左右
3つ 上,左右,下
4つ 上,右,下,左

指定しない場合,デフォルトになる

参考: 余白については以下の記事が良かった.

CSSのmarginとは?paddingとは?余白の指定方法まとめ

▼ 特殊文字

1
2
3
4
5
     &nbsp;    &#160;    ノーブレークスペース(前後で自動改行しないスペース)
"    &quot;    &#34;    クォーテーション(引用符)
&    &amp;    &#38;    アンパサンド
<    &lt;    &#60;    小なり
>    &gt;    &#62;    大なり

&#以降はUnicodeのコード番号

▼ レスポンシブ対応の仕組み

css で以下のようにメディアクエリを記述し,スクリーンサイズで処理を分岐する.

1
2
3
4
5
6
7
8
@media screen and (min-width:480px) {
    /* 画面サイズが480pxからはここを読み込む */
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    /* 画面サイズが768pxから1024pxまではここを読み込む */
}
@media screen and (min-width:1024px) {
    /* 画面サイズが1024pxからはここを読み込む */

Atom で HTML を編集する際に知っておくと便利なこと

▼ Emmet

【概要】
Emmet とは HTML,CSS コーディングをサポートするプラグイン.
【使い方】
タグ入力後,「Tab」キーを押下
【例】
・ html の雛形を入力する
「!」入力後,「Tab」キーを押下

・ 「要素.class名」の指定
div.box と入力し,「Tab」キーを押下

1
<div class="box"></div>

・ 「>」でネストを指定
div>p と入力し,「Tab」キーを押下

1
2
3
<div>
  <p></p>
</div>

参考: EMMETの使い方

▼ フォルダ配下の検索方法を調べる

command + shift + f
「ファイルまたはディレクトリのパターン」を指定しないと検索できないことに注意.

▼ html を整形する

“atom-beautify”プラグインで整形することができる.

エディタ上で右クリック > Beautify editor contentsをクリック
ショートカットキーは,control + option + b(eautify)

▼ ファイルの差分を調べる

“split-diff”プラグインを使用する.

API 開発時の便利ツール Postman

API 開発時にレスポンス内容を確認したり,テスト実行したり,環境変数に応じて URL を変更したりできる.
便利ツールの個人的なメモ.

クライアントアプリは以下からダウンロードできる.
Postman

アプリの使い方,何ができるか?は以下の良記事を読めば把握できる.
参考:API開発・テスト便利ツール Postmanの使い方メモ
参考:APIの開発がむちゃくちゃ捗る「Postman」の使い方
参考:RESTサービスを触る際の必須ツールPostmanを使ってみました
参考:[ツール] Postmanを利用したAPIの試験 [機能の紹介]

PHPの終了タグは付けない方がいい件

先日,PHPの header 関数でリダイレクトする処理を記述したのですが,どうしてもリダイレクトしてくれなくて,色々試した結果,PHPの終了タグ「?>」が記述されているとリダイレクトしないという現象に遭遇しました.

私の認識では,PHPの終了タグはあっても,なくても,どちらでも良いものという認識であったため,少し驚きました.
(いかなる場合においても,あった方が良いくらいの認識でした.)

リダイレクトしない理由として,直前にHTML出力があるとリダイレクトしないというのは,なんとなく出力バッファなどの理由により,問題があるような気がするのですが,終了タグというのは想像できませんでした.…というわけで,メモしておきます.

参考:PHPの最後の終了タグ ?> は付けないでおこうねというお話

JetBrains IDE Support と Xdebug helper について調べた件

PhpStorm のデバッグでなんとなく必要なのだろうと Chrome に2つの機能拡張をインストールしていたが機能を把握していなかったので,調べてみた.
結果,PhpStorm のデバッグ作業では,Xdebug helper だけでよいようだ.

日本語のPhpStorm 2019.1 ヘルプには以下の記述がある.

IntelliJ IDEAでアプリケーションをデバッグするために、ChromeのJetBrains IDEサポート拡張をインストールして使用する必要はありません。

▼ JetBrains IDE Support 2.0.10

JetBrains Chrome拡張機能を使用したデバッグセッション中、HTML、CSS、およびJavaScriptのライブ編集を使用できます。また、DOM ツリーと実際のページのソースコードを表示することもできます。

▼ Xdebug helper 1.6.1

Xdebugヘルパー拡張
PHP デバッグ接続のリッスンを開始
IDE key 設定などができる.

以前はブックマークレットでIDE key設定を行ったりしていた記憶がありますが,この機能拡張からも出来るのですね.
個人的には少し頭の整理が出来ました.笑