このブログのコンセプトって○○なん、知ってた? 何それ気になる〜

【コーディング週間日報】3/28(日)〜 4/3(土)の学習

たーやま

3/28(日)〜 4/3(土)の間に
学習したメモをまとめます。

目次

3/28(日)のアウトプット

今日は主に PHP 周りを学習。最後は MySQL もしました。

PHP に関しては、デイトラで卒業制作終わらしています。

何なら案件もしてたので、レベル的には易しく感じました。

けど、MAMP の使い方はすっかり忘れてたため、思い出せてよかったです。

Udemy
PHP+MySQL(MariaDB) Webサーバーサイドプログラミング入門 本格的なWebシステム開発に欠かせない、サーバーサイドプログラミングをPHP+MySQLで学ぼう。

デイトラ学習生は、PHP周り飛ばしていいと思います。

Progate すら触ったことない人ならやった方がいいと思いますが…。

たーやま

一応最初からやったから、メモ残しておくわ。

MySQL は、デイトラではほとんどやってないので、個人的には役にたちました。

MAMPの設定

いっつも Local by flywheel 使っているので、一応メモ。

初期設定(Macの場合)

Windows ではないので、Windows使ってる人はググってください。

一応、1記事だけ載せておきます。

Code for Fun
MAMPのインストール方法(Windows & Mac対応) macOS 版のバージョンを 5.2 → 6.0.1 に更新しました。(2020年10月) ここでは https://www.mamp.info/en/ で公開されている Windows 版 MAMP 4.

まずフォルダを新規作成しましょう。

MAMP起動 > りんごの横のMAMP > Preference > Posts の Apache Prot を8888にしましょう。

PHPは7.4.2に。Web Server は Apache にして、Document Root はデスクトップで作成したフォルダを設定。

これで起動できるハズです。

ただ、今回は MAMP 使ってますが、WordPress に特化したいなら、圧倒的に Local by flywheel の方が使いやすいです。

環境構築迷ってる人は、Local by flywheel を強くオススメします。

たーやま

ぽちぽちするだけでええからな。

バズ部
超簡単にローカル環境が構築できるLocalbyFlywheelの使い方 Local by Flywheel(ローカルバイフライホイール)とは、簡単にWorpdressサイトを構築できる、ローカル環境構築ツールである。 プログラムのコードが書けない人や、コマン...

日付の設定

MAMP > bin > php > 設定しているバージョン(わいは7.4.2) > conf の中にある、php.ini をいじればできます。

php.ini の中にある…

[Date]
; Defines the default timezone used by the date functions
; Will be changed by MAMP to system timezone
; date.timezone = "Europe/Berlin"

ここの欄を変更します。初期設定のままでは、ドイツのベルリン指定になります。

[Date]
; Defines the default timezone used by the date functions
; http://php.net/date.timezone
; date.timezone = "Asia/Tokyo"

日本で作業しているなら、“Asia/Tokyo” でOK。他の国にいるなら、この記事を参考に。

あわせて読みたい
PHP: サポートされるタイムゾーンのリスト - Manual

注意すべき点は、date.timezone 横にあるセミコロン「 ; 」は外すということ。

このままだとコメントアウトの状態になっているので、いくら更新しても変わりません。

なので、date.timezone 横にあるセミコロン「 ; 」は外しましょう。

ちなみに上2つのセミコロンは外さなくていいです。

完成版はこんな感じ。

[Date]
; Defines the default timezone used by the date functions
; http://php.net/date.timezone
date.timezone = "Asia/Tokyo"

phpMyadmin(MySQL)の入り方

MAMP で Start Servers を選択したら、サイトが出てきます。


そこの「MySQL」欄にある「MySQL can be administered with phpMyAdmin.」の「phpMyAdmin」ってリンクを選択したら入れます。

phpMyadmin(MySQL)を好きな言語に

ホーム画面の「Appearance Settings」欄にある「Language」から選択できます。

変なとこいじって戻れないときは、phpMyadmin のロゴか、その下にある家のマークを選択したらホーム画面に行けます。

PHPの関数について…

WordPress ではあんま見やん関数でしたが、今後のために記載。

print構文:文字列を出力する

<?php
 print(‘ほげほげほげほげ’);
?>

これで「ほげほげほげ」の文字列が出力されます。

ただ、print じゃなくて echo でも出力できます。

<?php
$x = ‘あいうえお’;
if ( $x !== ‘’ ) {
 echo ‘xには文字が入っています’;
}
?>

<?php
$x = ‘あいうえお’;
if ( $x !== ‘’ ) {
 print ( ‘xには文字が入っています’ );
}
?>

// どちらでも出力結果は同じ

四捨五入、切り上げ、切り捨て

round 関数で四捨五入

四捨五入するときは、round( ) を使います。

<?php echo round(1.41421356); ?>
// 出力結果:1

ただ、小数点以下を全部四捨五入してしまいます。

小数点第X位で四捨五入したいなら、2つめの引数を入れましょう。

<?php echo round(1.41421356, 2); ?>
// 出力結果:1.41

この場合は2つめの引数に2を入れたので、小数点第2位までを表示し、第3位以降を四捨五入した結果が表示されています。

切り上げは ceil 関数

切り上げを行いたい場合は、ceil 関数を使います。

<?php echo ceil(1.7320508); ?>
// 出力結果:2

これは round関数みたいに、2つ目の引数に数を指定しても、その値を残して切り上げはできません。

なので、小数点第X位以下で切り上げたいなら独自に関数を作成する必要があります。

あわせて読みたい
PHP 四捨五入/切り上げ/切り捨てのサンプル | ITSakura
floor 関数で切り捨てを

切り捨ては floor 関数を使えばいいです。

<?php echo floor(2.2360679); ?>
// 出力結果:2

これもceil 関数と同じで、引数を渡しても切り捨てはできません。

小数点第X位以下で切り捨てたいなら、つい先ほど紹介したリンクをみてください。

郵便番号

$addr = '000−0000';

$addr = mb_convert_kana($addr, 'a', 'UTF-8');
if (preg_match("/\A\d{3}[-]\d{4}\z/", $addr)) {
  print('郵便番号:〒' . $addr);
} else {
  print('※郵便番号を000-0000の形式でご記入ください');
}

Aは先頭という意味。

アルファベットの先頭がAであることから連想できるかと思います。zは最後って意味です。

たーやま

最初は3つの数字、最後は4つの数字って意味やな。

3/29(月)のアウトプット

今日は MySQL を中心に学習しました。

とっつきにくそうなイメージでしたが、すこしだけ理解が進んだ気がします。

ひとまず、学習したことをまとめます。

SQLの記述

phpMyAdmin にログイン後、フォルダを指定。

データベースは、「最近」と「お気に入り」の下にあるごちゃごちゃしたところにあります。

自分が開きたいフォルダを指定して、SQL のタブを選択しましょう。

そしたら、SQL を記述できるところへ行けます。

ちなみに、SQL のメソッドは小文字でも記述できるけど、基本大文字やから注意してください。

SQL の構文

テーブルの作成

新しいテーブルを作成したいときは、「CREATE TABLE」を使います。

テーブルっていうのは、データベース直下にあるやつです。

CREATE TABLE my_items ( id INT, item_name TEXT, price INT );

この場合は、my_items っていうデータベースに、整数の入る id, テキストが入る item_name, 整数が入る price の3カラムを作成しました。

「返り値が空でした」って出ても気にしなくていいです。正常な動作なので。

データの追加

何かのデータを追加したいときは、「INSERT」を使います。

INSERT INTO my_items SET id=1, item_names=’ぶどう’, price=350;

この場合は、「my_items」っていうデータベースに、id が 1、 item_names がぶどう、price が 350 っていう新しい値を追加したという意味。

ちなみに  item_names=’ぶどう’ の記号は、シングルクオーテーション「 ‘ 」でもダブルクオーテーション「 “ 」でも、どっちでもいいです。

データの変更

データの変更は「UPDATE」文を使います。

WHRER でどこのカラムの値を変えたいかを入力しないといけません。

UPDATE my_items SET price=200 WHERE id=1;

WHERE を使わんかったら、全ての値を変更してしまいます。

データの削除

データを削除したい場合は、「DELETE」文。

DELETE FROM my_items WHERE id=2;

my_items にある id=2 っていうやつを削除しますわ」って意味です。

「WHERE」を入れないと、全て消えてしまうので注意!

プライマリーキーの設定

重複を避けるために、プライマリーキーを設定しましょう。

構造 > チェックボックスにチェックして、「主」を選択でプライマリキーの設定ができます。

もしうまくいかない場合は、コードがでてきて編集できるようになるのでそこから編集してください。

例えばこんな感じで出てきます。

ALTER TABLE `my_items` ADD PRIMARY KEY ( `id` );

実行したら、きちんと編集できているはずです。

あと、テーブルを新規作成するときも、プライマリーキーは設定できます。

新規作成を押した後に出てくる、インデックスのところから選択できます。

自動で値を割り当てる AUTO_INCREMENT

手打ちで数を入力すると、重複したり値を飛ばしてしまったりする恐れがあります。

それらを防止するために、AUTO_INCREMENT を使いましょう。

構造 > 変更したいカラム横にある「変更」を選択 > 「A_I」 のチェックボックスにチェックする > 保存

これで AUTO_INCREMENT の設定はOK。

ところで、データベースでは一度作成した数字を削除したら、もう二度と使いません

例えば、id を5つ設定したとして、3つ目の値を削除したとしましょう。

そのあと、新しい値を作成しました。

1, 2, 3, 4, 5 になると思うかもしれませんが、そうはなりません。

1, 2, 4, 5, 6 になります。3 は永久欠番になって使われないようになります。

3/30(火)のアウトプット

PHP と SQLのアウトプットを中心に学習。

Mac だと若干動作やコード内容が変わってたけど、難なく突破できました。

PHP と SQL の接続・実行

PHP と SQL の接続

SQL と PHP を接続するためには、PHP のコードに次のように記述する。

<?php
 try {
  $db = new PDO('mysql:dbname=〇〇;host=localhost;charset=utf8','root','root');
 } catch (PDOException $e) {
  echo ‘DB接続エラー:’. $e->getMessage( );
 }
?>

// PDO = PHP Data Object の略
// dbname の後の〇〇には、自分が接続したいデータベースの名前を入れてください。

try の記述と catch の記述をすることで、エラーが起きた時に例外を発生させることができます。

ここで言うなら、catch の内容が例外処理。PDOExceptionの内容を渡して、内容を echo するって意味になります。

PHP で SQL の処理を実行する

exec メソッドで外部コマンドを実行する

SQL で作成したテーブルに PHP を使って新しい値を挿入したいときは、exec メソッドを使えばいい。

<?php
 try {
  $db = new PDO('mysql:dbname=〇〇;host=localhost;charset=utf8','root','root');
 } catch (PDOException $e) {
  echo ‘DB接続エラー:’. $e->getMessage( );
 }

$count = db->exec( ‘ INSERT INTO 〇〇 SET XX ’ );
echo $count. ‘件のデータを挿入しました’;
?>

// 〇〇には自分のデータベース名を、XXには挿入したい値を入れること。

記述したあとに、ローカル環境phpMyAdmin で再読込をすると、値が更新されます。

ローカル環境を再読込するにつれて値が増えていくため、不必要な記述は削除してください。

クエリを実行する「query メソッド」

SQLで作成したテーブルを、画面上に表示させることもできます。

query メソッドの登場です。

<?php
 try {
  $db = new PDO('mysql:dbname=〇〇;host=localhost;charset=utf8','root','root');
 } catch (PDOException $e) {
  echo ‘DB接続エラー:’. $e->getMessage( );
 }

$records = db->query( ‘ SELECT * FROM 〇〇 ’ );
while ( $record = $records->fetch() ) {
 print( $record[‘XX’]. “\n” );
}
?>

// 〇〇 は自分のデータベースで、XX は入れたい値を入れること。

input タグの type 属性

input タグで知らなかった type 属性がありました。聞いたことがあるのも含めて、おさらいしておきます。

type=”text”
▶︎ 一行のテキストボックスを作成する。

type=”email”
▶︎ メールアドレスの入力欄を作成する。

type=”tel”
▶︎ 電話番号の入力欄を作成する。

type=”url”
▶︎ URL の入力欄を作成する。

type=”radio”
▶︎ ラジオボタンを作成する。

type=”submit”
▶︎ 送信ボタンを作成する。

type=”date”
▶︎ 日付の入力欄を作成する。

type=”file”
▶︎ サーバーファイルを送信する。

type=”button”
▶︎ 汎用ボタンを作成する。

まだまだありますが、使いそうなのはこれくらいかな。

他の type 属性が気になった場合は、ここから調べてみてください。

あわせて読みたい
<input>: 入力欄 (フォーム入力) 要素 - HTML: HyperText Markup Language | MDN HTML の <input> 要素は、ユーザーからデータを受け取るための、ウェブベースのフォーム用の対話的なコントロールを作成するために使用します。端末とユーザーエージェント...

type 属性の「file」について

type 属性を「file」にした場合は、form 要素にある属性が必要になります。

それが enctype 属性

enctype 属性を使う時も注意があり、method 属性を「post」にしないといけません。

また、ファイルをアップロードしたいときは、enctype 属性の中身を「multipart/form-data」にしてください。

<form action=”” method=”post” enctype=”multipart/form-data”>
 <input type=”file” name=”image” size=”35” value=””>
</form>

3/31(水)のアウトプット

今日は MySQL もしたけど、HTML と CSS 周りを固める学習もしました。

基礎的なことが多いけど、意外と抜けている知識は多いかと思います。

より深く知識を習得していくために、基礎から細かい知識をメモしました。

Block 要素と Inline 要素

Inline 要素

代表的なタグ:a, span, img, buttton, iflame など。

横並びにコンテンツを配置したいときに使います。

改行がされないので、画面幅に達すると折り返されます。

横と縦の幅が指定できないので、width やheight を指定したいなら、display: block; などを使ってください。

たーやま

display: inline-block; でも縦横の指定はできるけど、横並びになります。

<span>ほげほげほげほげほげお</span>
<span>ほげほげほげほげほげお</span>
<span>ほげほげほげほげほげお</span>
<span>ほげほげほげほげほげお</span>

<style>
 span {
  width: 100px;
  height: 400px;
  background-color: blue;
 }
</style>

中央揃えにする際は、親要素に「text-align: center;をしましょう。

Block 要素

代表的なタグ:div, p, ul, ol, form など

上下にコンテンツを配置したいときに使い、改行されて表示されます。

横と縦の幅を指定することができます。

<div>ほげほげほげほげほげお</div>
<div>ほげほげほげほげほげお</div>
<div>ほげほげほげほげほげお</div>
<div>ほげほげほげほげほげお</div>

<style>
 span {
  width: 100px;
  height: 400px;
  background-color: blue;
 }
</style>

中央揃えにしたいなら、「margin: 0 auto;」を指定する。

たーやま

style 属性はあくまで例として使ってるだけやから、案件とか仕事とかではちゃんと分けてね。

CSSの詳細度

割とこんがらがる内容やと思います。

Sass を使ってても役に立つところなので、メモしました。

HTML 要素は下記の通りです。

<body>
 <div class=”parent”>
  <span id=”first” class=”class”>クラスです。</span>
  <span>スパンです</span>
  <span>すぱんです</span>
  <span>supanです</span>
 </div>
</body>

親要素のみの場合

.parent {
 color: blue;
 font-weight: bold;
}

この場合は言わずもがな、文字は blue になります。

親要素と子要素を指定した場合

.parent {
 color: blue;
 font-weight: bold;
}

span {
 color: purple;
}

この場合は、文字が purple になります。span の方が、親要素の div よりも詳細度が高いためです。

親要素、子要素、クラス指定の場合

.parent {
 color: blue;
 font-weight: bold;
}

span {
 color: purple;
}

.class {
 color: orange;
}

この場合は、クラスがついている span は orange で、他は purple になります。

詳細度は、クラス > span > parent って感じですね。

親、子、クラス、id 指定の場合

.parent {
 color: blue;
 font-weight: bold;
}

span {
 color: purple;
}

.class {
 color: orange;
}

 #first {
 color: red;
}

id は詳細度が高いので、この場合は span のクラスよりも id のカラーが優先されます。

id > クラス > span > parent って感じです。

親 + 子、クラス、id 指定の場合

.parent {
 color: blue;
 font-weight: bold;

 span {
  color: green;
 }
}

span {
 color: purple;
}

.class {
 color: orange;
}

 #first {
 color: red;
}

この場合は、id がついてる span については red で表示されますが、他の文字は green になります。

ただの span よりも .parent span の方が、詳細度が高いためです。

同じ場所をあとから指定した場合

.parent {
 color: blue;
 font-weight: bold;

 span {
  color: green;
 }

 span {
  color: black;
 }
}

span {
 color: purple;
}

.class {
 color: orange;
}

 #first {
 color: red;
}

この場合は、id がついてる span については red で表示されるけど、他の文字は black になります。

同じ指定の場合は、後に指定したスタイルの方が優先されるので、green にはなりません。

4/1(木)のアウトプット

入社初日。今日から研修期間です。

既存サイトのURLやFTP情報から、ローカルの環境を作成しようと試みました。

WordPressでのサイト制作の経験があったので、環境構築はある程度できるものだと思っていました。

が、めちゃめちゃ悔しかったです…。全く手が動きませんでした…。

ひとまずメモできたところをまとめます。手順が部分的になるので、慣れた頃に再度リライトします。

たーやま

ローカル組むにしても、実務は違うわ…。
転職してホンマによかった。

なおFTPソフトは「Cyberduck」、サーバーは「Xserver」、ローカルは「MAMP」を使っています。

本番サイトからローカルの作成

1)FTPソフトからローカルのデータベースを作成

デスクトップで新規のフォルダを作成 > FTP で本番環境を起動 > 本番環境のファイル・フォルダを全てダウンロード > 新規作成したファイルに入れる > MAMPを起動 > データベースを新規作成

2)本番環境のphpMyAdminにログイン

Xserver のサーバーパネルにログイン > 「データベース」のphpMyAdminにログイン > エクスポート > エクスポートの方法は「詳細」を選択 > エクスポート

たーやま

1)と 2)に関しては、この記事を
振替ったらできるかと思います。

3)データベースと連携させる

① で作成したデータベースに、② でエクスポートした「.sql」のファイルをインポート > 「wp-config.php」の以下の内容を確認し、書き換える

// ** MySQL 設定 - この情報はホスティング先から入手してください。 ** //
/** WordPress のためのデータベース名 */
define('DB_NAME', '1)で作成したデータベース名');

/** MySQL データベースのユーザー名 */
define('DB_USER', 'root');

/** MySQL データベースのパスワード */
define('DB_PASSWORD', 'root');

/** MySQL のホスト名 */
define('DB_HOST', 'localhost');

/** データベースのテーブルを作成する際のデータベースの文字セット */
define('DB_CHARSET', 'utf8');

/** データベースの照合順序 (ほとんどの場合変更する必要はありません) */
define('DB_COLLATE', '');

// MAMPの場合は上記のユーザー名、パスワード、ホスト名であってるはず。

あと、環境開発のURLをこんな感じにすると楽です。

// ローカル開発環境のURL
define('WP_HOME', 'http://localhost/XXXXX');
define('WP_SITEURL', 'http://localhost/XXXXX');

// XXXXX は、フォルダの名前

データベースの照合順序のあとにでも貼っておいてください。

これで合っているはずなのに…

たーやま

なんで違うねん(笑)

デバックモードを ON にして確認することに。

すると、本番サイトのデータベース名だったことが判明しました。

ローカル環境で作成したデータベースの名前ではないために、データベースの名前が見当たらないのでしょう。

ということで、ローカル環境で作成したデータベースの名前に変えてみました。

するとどうでしょう…?

たーやま

なんで拒否られるねん…

終業時間が過ぎ、夕飯を食べた後も寝るまでずっとググったり考えたりしてました。

しかし、この日に解決することはできませんでした。

ちなみに、デバックモードを ON にしたい場合は、「wp-config.php」にある

define('WP_DEBUG', false);

上記のコードにある「false」を「true」にしましょう。

define('WP_DEBUG', true);

これでデバックモードを ON にできました。

たーやま

解決しないまま終わりました。
必要な知識なので、わかり次第更新します。

4/2(金), 4/3(土)のアウトプットについて

2日は仕事が終わった後も、仕事関係のことをしていました。

業務で使うFTPの情報を見たり、以前できなかったローカルについて調べたり…といった感じです。

特段お伝える情報がないため、メモは残しておりません。

たーやま

ちなみにまだ解決はしていません(笑)

3日はアウトプットをする時間がなかったため、メモ自体がありません。

3/28(日)〜 4/3(土)で感じたこと

実務とUdemyやオンラインスクールの学習では、レベルの差があり過ぎる。これにつきますね。

まぁ案件とった時から思ってましたけどね(笑)

今回も、ローカル環境の構築でここまで手こずるとは思いませんでした。

調べる力がついたと思いきや全く見当違いだったり、上司からの説明が早くてついていけなかったりします。

世の中そんな甘ないですね(笑)

ただ、諦めるとかそんな気持ちはないです。

たーやま

みんな通る道やしな。
あと、金払って得た知識やから元取りたいし。笑

ということで、来週もコツコツと精進していきます。

この記事が気に入ったら
いいね または フォローしてね!

よかったらシェアしてね!

この記事を書いた人

大阪出身26歳。宮古島の制作会社に勤めています。
コーディングとデザインにシバかれてます。

生き物や自然が好きやけど、特にクワガタムシが好き。
他、チャリとか釣りとか筋トレとかも好き。

目次
閉じる