jsのpromise

jsはシングルスレッド。ひとつの流れしか実行することができない。同時に複数のスレッドを実行できない。
animateとか、ajaxとか、setTimeoutなどは、同時に複数走っているように見えるけど、別の人に仕事を振って結果を待っている。js自体はシングル。
これが非同期。

非同期処理を実行すると、jsは実行依頼を誰かに投げて自分は次の処理に移る。
アニメーションが終わってから何かを実行したいという場合にはアニメーションが終わってから実行しますよということを明示しないといけない。

promise().done(function(){}

でそれが実行できる。jQueryの場合。

正規表現

[]で囲むと文字クラス
文字クラスの中の^これは、否定の意味になる。行頭という意味ではない。

[^0-9] これで数値以外
[^-0-9] これでマイナスと数値以外

マイナス記号は、文字クラスの中では範囲を意味するけど、冒頭に書いておけばマイナス記号として機能する。

Posted in php

php mail

headerやbodyなどの構文を理解しておかないとなかなかちゃんと送れない。

文字化け問題

Outlookで受信メールの件名が文字化けする。

Outlookは件名のUTF-8に対応していない。本文はUTF-8でも受け取る。
このため、本文はUTF-8にして件名はISO-2022-JPで送信する。

ヘッダーにはアスキーしか使えない。日本語が使えない。
送信者や件名はヘッダーに書くのでここだけが文字化けするという事態が起こる。

Posted in php

git (ロリポップにgit環境を作る)

gitの設定(ユーザー名、メールアドレス)
設定には、System,Global,Localの3種類がある。
左から、全体→個別の設定で、個別の設定がある場合は個別の設定が優先される。
Localの設定は、.gitのフォルダの直下にある。

それぞれの設定の確認は下のコード
$ git config –local
$ git config –global
$ git config –system

localの設定確認はリポジトリフォルダの中で実行した場合だけ、そのリポジトリの設定が表示される。

それぞれの設定を変更する場合は下のコード
$ git config # ローカルの設定を変更
$ git config –global
$ git config –system

ベアリポジトリ とノンベアリポジトリ というものがある。
すべてのファイルを持っているものと、作業の履歴だけを保存しているもの。

リポジトリを作るときにこれを設定する。

git init
これで、.gitファイルが作成される。=gitリポジトリが作成されたということ

確認する時は、[$ ls -a]で、先頭にカンマのあるファイルも表示される

Posted in git

Google広告に関して

・支払いは、1万円になった時点か前回の支払いから1カ月が経過した時点に自動的に請求が発生する。
・費用の書き方がわかりにくいんだけど、請求額が「+」で支払い額が「-」で表記されている。キャンペーンなどは「-」
・一日200円以下の設定はできない。おそらく月に6000円は固定で請求がくると思った方が良い。

・キャンペーンでキャッシュがストックされているにも関わらず請求はキャンペーンキャッシュを無視してくる。これは謎。だから、キャンペーンでキャッシュを得たからと言って安心してはいけない。現金はきっちり取られる。
・他の記事によると、「-」のキャッシュは返金される場合もあるらしい。もしかすると返金されるかもしれない。

・2カ月の実績として「インプレッション(表示回数)が335」「クリックが12」請求は8800円でコンバージョンは0。
・この調子で行くと、1%のコンバージョン率だとすると広告費に8万円ほどかかる。

・レポートを見たところ、クリック単価が340円から2400円まで幅がある。2400円ってすごいな。

・ターゲットキーワードを設定して、Googleはユーザーの検索や閲覧などの履歴からマッチする広告を表示する

jsのajaxでjsonを取得して配列にする

$.ajax({
url:”entry_code.php”,
type:”POST”,
dataType:”json”,
timespan:1000

}).done(function(data1,textStatus,jqXHR) {

en = JSON.stringify( data1 );
en = JSON.parse(en);

}).fail(function(jqXHR, textStatus, errorThrown ) {

}).always(function(){

});


en = JSON.stringify( data1 );
en = JSON.parse(en);

これがポイント。
上の奴だけだと文字列になってしまう。上のやつでjson化してparseで配列化する。

jsonを直接取りに行ける

$.ajax({
type: “POST”,
url: “chat_data.json”,
dataType: “json”
}).done(function(data, textStatus, jqXHR) {

console.log(data);

}).fail(function(jqXHR, textStatus, errorThrown) {
alert(“エラー” + errorThrown)

})

jsonファイル
[
{
“id”: 1,
“view_delay”: 1,
“html”: “

test


},
{
“id”: 2,
“view_delay”: 0,
“html”: “

こんなはずでは


}
]

帰ってきた値は、console.log(data[0]);これで取れる。

jsonをもう一度配列変数に作り直したい。

$.ajax({
type: “POST”,
url: “chat_data.json”,
dataType: “json”
}).done(function(data, textStatus, jqXHR) {

for (var k in data) {
console.log(“項目: ” + k);
console.log(“内容: ” + data[k].html);
}

}).fail(function(jqXHR, textStatus, errorThrown) {
alert(“エラー” + errorThrown)

})

LP ランディングページ制作

・購買意欲の高い人の刈り取り
LPに来るという時点で、どこかからは買うことを決めている
「今」「ここで」買う誘導。ここに目的が絞られる。

【必ず提示するもの】
・結果
・体験
・なぜ必要か
・商品のストーリー

【意識すること】
モニターの前に座ってLPを読んでいる人。
どういう人が、何に悩み、何を求めて読んでいるか。

誘起→結果→証拠→共鳴→信頼→ストーリー→クロージング→追伸

誘起:入るか、帰るかを決めかねている客を引き込む
結果:それを買うとどうなるか。どんな明るい未来が待っているか。
証拠:数値、客観的データ、科学的・医学的データ、動画
信頼:信用して良い理由、根拠
ストーリー:感情に訴える。代表者のメッセージ。客はみんな損をしたくない。
クロージング:感情で物を買い、理論で正当化する。買うことの言い訳を用意する。

キャッチコピー

WP トラブル対応

トップページ以外が404になる場合

・パーマリンク設定を保存しなおす。
・パーマリンクを「基本」に変更する。

・ローカルの場合、Apacheのhttpd.confのAllowOverrideをAllにする。
(リダイレクトを許可するかどうかという設定かな)

tweetする

<a href=”https://twitter.com/share?text=神曲10%0A<?=__($tweet); ?>%0A&url=https%3A%2F%2Fclutch10.com&hashtags=%E3%82%AF%E3%83%A9%E3%83%83%E3%83%81%E3%83%86%E3%83%B3 ” class=”twitter-share-button” data-show-count=”false”>Tweet</a><script async src=”https://platform.twitter.com/widgets.js” charset=”utf-8″></script>

アンカーリンク 高さ調整

アンカーリンクさせる時に、ヘッダーがfixedで高さを持っている場合に高さをずらす必要がある。

$(window).on(‘load resize’, function () {
var w = $(window).width();
var x = 768;
var headerHightSP = 10; //ヘッダの高さ
var headerHightPC = 180; //ヘッダの高さ
var hash = $(location).attr(‘hash’);

// スムーズスクロールの処理
var position2;
if (hash) {
if (w < x) {
//画面サイズが768px未満のときの処理
position2 = $(hash).offset().top – headerHightSP;
} else {
/*ページ外#リンク*/
position2 = $(hash).offset().top – headerHightPC;
}
}
$(“html, body”).animate({ scrollTop: position2 }, 50, “swing”);
});

ポイントは、リンククリックをトリガーにする処理ではなく、遷移先がロードされた時の処理という点。
考えてみればそうなんだけど、遷移してしまったらリンククリックをトリガーにしたアクションは実行されない。

ふたつめのポイントは、attr(‘hash’)でURLに含まれるアンカーリンクを取得できるというところ。実にシンプルに取得することができる。(#aaaの部分)
attr(‘hash’)で取得した文字列はセレクターにもなるというところも素晴らしい。

MAMP 設定

apacheのドキュメントルートの設定は、こちらです。
C:\MAMP\conf\apache\httpd.conf

phpMyAdminのアドレスはこちらよ。
http://localhost/MAMP/index.php?page=phpmyadmin&language=English

e-tax

利用者識別番号

セコムパスポートの中間証明書
セコムパスポートの中間証明書
これを、キーチェーンアクセスに登録する。
作業をするパソコンが限定されるな。

GA 広告からの流入

チラシからの流入を計測する
・パラメーターは規定のものを設定する

GoogleアナリティクスでQRコードからのアクセス・成果件数を計測する方法

パラメーターの作成には、Builderの利用が便利
https://ga-dev-tools.appspot.com/campaign-url-builder/

クラッチテンのフライヤーに掲載するQRコードのURL
https://clutch10.com/?utm_source=flyer&utm_medium=off_qrcode&utm_campaign=202002

psd Photoshop フォトショップ

文字にグラデーション をかける
 レイヤーウインドウのしたの「fx」ボタンを押したらなんとかなる。

パスを描画する。

パスを描画する時には、ブラシや鉛筆ツールなど何を使って描画するかを選ばないといけないけど、現在のブラシや鉛筆ツールの設定が適用される。 だからブラシや鉛筆ツールが描画できる状態に設定されていないとパスの描画ができない。

レスポンシブテーブル

tbodyをdisplay:flex:にして、trをそれぞれflexのアイテムにしてしまう。
それからtrの中身をdisplay:block;にする。

テーブルのタグを使っているのだけど、実際はフレックスボックスとして表示される。

メディアクエリでflexをはずしてやると、元のテーブルとしての表示になる。

サイズの違う下線を引く

main h2 {
    font-size: 16px;
    text-align: center;
    padding: 10px;
    margin-bottom: 35px;
    font-weight: bold;}
main h2::after {
    content:””;
    border-bottom: 1px solid #000;
    width: 20px;
    padding-top: 10px;
    display: block;}

afterの前に::
contentとdisplay:block;を忘れないように。

Bitbucketについて

リポジトリとプロジェクトがある。

現在、リポジトリのクローンができない。
SSHの公開鍵を登録したけれど、git cloneで「Invalid username or password」が出る。

git clone時に求められるパスワードはbitbucket登録時に設定したログインパスワードでした。

Posted in git

Azure Cognitive Services

サブスクリプション
支払いの設定

リソース

Anomaly Detector
異常検出
時系列データをAPIで送り続けることで異常の発生をアラートしてくれる。


git概念

ワークツリー(作業ツリー)

gitの管理下にあるフォルダのこと。
おそらく、=ローカルリポジトリではない。
ローカルリポジトリというのは、ワークツリーからインデックスを経てcommitされたものがローカルリポジトリにたどり着くというイメージ。


インデックス(ステージングエリア)

リポジトリにコミットする準備のための場所。
ファイルをコミットするために、インデックスというフォルダにファイルを登録する。

Cakeの開発環境作り

GitでCloneする。そこからだ。


MAMPのphpMyAdmin のURLはこちらです。
http://localhost:8888/phpMyAdmin/?lang=en


cakePHPのconfigフォルダの中にあるapp.phpを編集する。
Databasesouceの箇所をローカルのデータベースに繋がるように編集しなければいけない。

その前に、まずデータベースを作らないといけない。
app.phpにデータベースの名前が書かれているので、その名前でphpMyAdminを使ってデータベースを作りましょう。
sqlをインポートする時にはデータベースを指定する必要があります。


cakePHPの3以降は、venderというフォルダーに実行ファイルが入っている。
ローカルに環境を作る際は、環境のフォルダでcomposerを実行してインストールしないといけない。
composer installで自動的に必要なものを入れてくれるみたいです。

composerはインストールする対象を、実行したフォルダにあるcomposer.jsonを見に行って判断しているのだと思う。


リモート環境をローカルに再現する手順は、「データベースをエクスポートしてインポートする」「Gitでファイルを取得してhtdocsの下に置く」「composerでcakePHP3をインストールする」「app.phpを編集する」という4つのステップになるようです。

Laravel 管理画面

管理画面を作る
migrationのファイルを、usersのテーブルを作るやつをコピーした。

config/auth.php
これを触るみたいだ。
ーーー
もう一回。仕切り直し。

管理用のユーザーテーブルを作らないといけない。
1.modelを作ります。 php artisan make:model Adminuser -m
これで、モデルとmigrationのファイルができる。テーブルはできない。
2.usersのmigrationファイルをコピーして、Adminuserに貼り付ける。
そしてmigrateを実行する
3.「/config/auth.php」を編集する。GuardとProviderを編集追加する
4. RegisterAdminController.phpを作る。(RegisterControllerをコピってぺ)

5.bladeファイルをコピってぺ。(login.bladeとregister.bladeをコピって、adminlogin.bladeとadminregister.bladeを作ります)

jquery ajax完了してから

jsで要素の高さを取得などするときに、その要素がajaxで読み込まれたものだと、document.readyで取得しようとしても、そのタイミングではまだajaxが完了していない。

$(document).ajaxComplete(function() {
obj_top = $(‘#table_head_time’).offset().top;//ページの読み込み完了してから位置を取得
});

ajaxCompleteは、ajaxの完了のタイミングで動く。
複数のajaxが動いた場合は、その度にここが実行されるのだと思う。

WP titleを変える

//ページタイトルを設定する
add_theme_support( ‘title-tag’ );
function change_title_tag($title){

$title = ‘ok’;
return $title;
}
add_filter( ‘pre_get_document_title’, ‘change_title_tag’, 10000 );

add_theme_supportを関数の外で実行しないと、add_filterが動かないみたい。

WP 順番など

仕組みに関すること。

フックというものがある。
何かの処理のタイミングに、カスタムな処理を引っ掛けることができる。
そのタイミングで実行させることができる。

フィルターフックとアクションフックがある。
add_filterとadd_actionを使って、処理(関数)をフック(連動させる)することができる。

—引用。https://liginc.co.jp/web/wp/customize/92030

add_filter( $tag, $function_to_add, $priority, $accepted_args );

$tag→フックの名前を指定します。
$function_to_add→フックしたタイミングで実行したい関数を指定します。
$priority→優先順位を整数で指定します。同じフック処理がある場合に数値が小さい方から実行されます。
$accepted_args→関数で使用する引数の数を指定します。指定できる引数の数はフックによって異なりますが、複数指定の場合でも1つ目の引数が本来の値で、2つ目以降の引数はフックされた時に利用する為の追加の要素にすぎません。

WPの移行

PHP5から7の開発環境に移行する場合の手順

プラグインを使用しないときは。
・FTPで全データをダウンロード。開発環境にアップロードする。
・データベースをすべてエクスポート。(Duplicatorを使った)。
・保存したSQLの、ドメインを全置換する。
・PHP5用のワードプレスを7に持っていくとエラーが発生するのでその対応
・wp-login.phpのwp-logon(”,****)この関数が、一つ目に引数に配列を指定しないとエラーになる。

Twitter Developer

https://developer.twitter.com/

appを登録する。(デベロッパー登録?)
登録するとメールで、審査結果が送られてくるけれど、記載内容がイマイチな場合はメールで追加質問が送られてきて、7日以内に返信をしないと以降の一切のアプリ登録などができなくなる。

アプリ(App)の登録に必要な項目
・サービスのURL
・利用規約のページ
・プライバシーポリシーのページ
・コールバックのURL

組織名と組織のURL(運営会社の情報)

WP クエリの仕組み

$wp_query
グローバル変数。リクエストの情報を与えることで、データベースから情報を取得する。
リクエストというのは、大体はURLということだと思う。

WordPressのループの仕組みを深く知る query_posts() と get_posts() の違い


ーーー
query_posts と get_posts の違い

get_posts() は、データを取得するだけ。query_posts() は、グローバル変数 $wp_query を変更する。
使ったあとに、これで元に戻してあげる必要がある。
wp_reset_query();

ーーー

have_posts()
現在の WordPress クエリにループできる結果があるかどうかをチェックする。

new WP_Query()
これで、たぶん

$the_query = get_posts(
array( ‘category__and’ => $category_array_notempty, ‘numberposts’ => 20, ‘s’ => $search_str, ‘paged’ => $paged )
);

get_post にパラメータを私て、$the_queryを作る。
pagedはURLに含まれているので、何もしなくても取れる。

$the_query = new WP_Query( $args );

WP_Queryは、記事を取得するためのクラス。
get_postsはWP_Queryクラスを利用して記事を取得する。テンプレートタグ。
どちらもメインループには影響を与えない。

WP_Queryの場合
$args = array( ‘post_type’ => ‘post’ );
$the_query = new WP_Query( $args );
while ( $the_query->have_posts() ) : $the_query->the_post();
the_title();
endwhile;
wp_reset_postdata();

have_posts():投稿があることを確認する
the_post():$postの中身を書き換える。

$postを書き換えることで、the_title()などを使って投稿の情報を取り出すことができる。
$postはグローバル変数なので、書き換えた後でresetを忘れないように。
$postを書き換えるのは、投稿の情報を取得するための関数を共通化する(使い回す)ためなんだと思う。

WP 検索機能

getで[‘s’]をつけて送ると、結果はsearch.phpをテンプレートにして表示される。

検索フォームはsearchform.phpというファイルに記載する。
searchform.phpがない場合は、デフォルトの検索フォームが表示される。

カテゴリの絞込み機能を追加する場合は、フォームに下記の一文を追加する。

Laravel 認証・バリデート

use Illuminate\Foundation\Auth\AuthenticatesUsers;
これは、 /vendor/laravel/framework/src/Illuminate/Foundation/Auth ここにあります。

ーーー

$validate_rule = [
‘name_e’ => ‘required’,
‘password_e’ => ‘numeric|between:0,9999’
];
$this->validate( $request, $validate_rule );

リクエストで受け取った値を、validate関数で検証する。ここでバリデーションに失敗した場合、validate以降の処理に進まずに、フォームに戻る。その際に$errorsを持って返る。

ーーー
オリジナル・バリデータ

ーーー
【認証のガードとは】
Guard:Config/auth.php
上のファイルにguardsの設定がある。Guardにはsessionとtokenがある。

slick スライダーのjQuery

wpに入れるときは、jsを読み込ませまして、下の方に

これを書いておく。
ーーー
モバイルで右側にはみ出すものがありますが、それは矢印です。
.slick-slider .slick-next {
right: 15px;
}
ーーー

Laravel データベースの使い方

Eloquentは、モデルを作らないと動かないぽい。
Eloquentは作成日時と更新日時を自動的に更新してくれる機能があるぽい。

class Registration extends Model
{
protected $fillable = [‘date’, ‘orderNo’, ‘memberNo’, ‘customerNo’, ‘roomNo’];
}

モデルで、fillableに変更するカラムを設定して、
$res = Registration::create($param);

これで、insertする。insertを使うよりも、Laravelの機能を使うので安全面などで諸々と優れているらしい。

$res = Registration::find(1);
プライマリーキーを指定して1件取得する。

ーーー

firstOrCreate() : データがあれば取得。なければ作成する。
updateOrCreate() : データがあれば更新。なければ作成する。

配列を作るなど

js

var foo = new Array();

配列を作成する。newなので、Arrayクラスをインスタンス化している。だからfooはオブジェクトということになる。

var foo = new Array(‘リンゴ’, ‘バナナ’, ‘イチゴ’);
var foo = [‘リンゴ’, ‘バナナ’, ‘イチゴ’];
コンストラクタになる。ちゃんと理解しろ。このへっぽこ野郎。

foo.length; //これで配列の数が返ってくる。
foo.fill(0); //配列の中身を全部0にする。

var result = foo.indexOf(‘リンゴ’);
配列を検索してインデックス番号を返す。

foo.push(‘トマト’); //配列を追加する

連想配列の扱い

var foo = {ringo: ‘りんご’, banana: ‘バナナ’, strawberry: ‘いちご’};

foo.ringo = “りんご”;
foo.banana = “バナナ”;
foo.strawberry = “いちご”;

foo[‘ringo’] = “りんご”;
foo[‘banana’] = “バナナ”;
foo[‘strawberry’] = “いちご”;

上の3つ。結果は同じ。

delete foo[‘りんご’]; //配列の削除

$(‘.rsvFlag’).each(function(index) {
$sendText[index] = { date : $(this).data(‘date’) , order : $(this).data(‘order’) };
});

ajaxで追加した要素にイベント

ajaxで追加した要素は、js読み込みの時点では存在していないので、後から追加する要素にイベント(クリックなど)を設定することができない。
#table_areaの中身をajaxで追加するとして、そのテーブルの中のtdにイベントを設定したい場合。

これでは動かない。tdがないから。
$(“td”).on(‘click’, function() {

こうする
$(“#table_area”).on(‘click’,’td’, function() {

#table_areaは最初から存在するものとする。
onの関数の二つ目の引数に、トリガーとなる要素を設定するのです。

複数のトリガーがある場合はこんな感じ。
$(“#table_area”).on({
‘mouseenter’: function() {
if(!$(‘#toggleCancelBtn’).prop(‘checked’)){
if ($(this).text() === “” && !$(this).hasClass(‘rsvFlag’)) {
$(this).addClass(‘hoverFlag’);
}
}else{
if ($(this).hasClass(‘myReserve’)) {
$(this).addClass(‘hoverFlag’);
}
}
},
‘mouseleave’: function() {
if(!$(‘#toggleCancelBtn’).prop(‘checked’)){
if ($(this).text() === “” && !$(this).hasClass(‘rsvFlag’)) {
$(this).removeClass(‘hoverFlag’);
}
}else{
if ($(this).hasClass(‘myReserve’)) {
$(this).removeClass(‘hoverFlag’);
}
}
},
},”td”);

array_filter

//array_filterは、フィルタリングする条件を関数で記載する。
//評価式に変数を使えないので、useで渡す。
$filtered_array = array_filter($items, function($row) use ($s_date){
return($row[‘date’] == $s_date);
});

Posted in php

Laravel モデルの使い方

モデルの存在を忘れていた。

artisanでモデルのファイルを作成する。
/usr/local/php7.1/bin/php artisan make:model Reserve
ファイル名はテーブル名称と同じにする。(単数形にする。テーブル名称がReservesの場合は、モデルの名前はReserve)

モデルがあるだけで、コントローラーでは、モデル名称でデータベースを触ることができる。

use App\Reserve;
これを書いて。
$items = Reserve::all();
これで取れる。

$exist = Reserve::where(‘date’, $ite[0])->value($ite[1]);
こんな感じでコントローラーに書く。
モデルに書くほうがいいのかな。わからない。

laravel レイアウト

sectionとyeildは対になっている。
テンプレート側で、yieldを入れておくと、実体側のsectionを読み込む。

テンプレートの読み込みはextendで行う。
@extends(‘layouts.common’)
viewsフォルダの下のlayoutsフォルダの中のcommon.blade.phpを継承する。

ーー
実体=viewsの中のBladeファイル
テンプレート=Layoutsフォルダを作って配置

置く場所が違う(別の場所に置いている)だけで、テンプレートと実体のファイルは同じ「Blade」ファイルです。
1.routesでviewsのファイルを指定するとそれを表示させるようにする。
2.viewファイルに、extendが記載されていたらそのファイルを取りに行く。
3.テンプレートファイルに、yieldが設定されている場合、yieldに設定されているcontentをviewファイルから探す。パーツがテンプレートを取りに行くイメージ。取得したテンプレートに自分のパーツをはめ込む。

ーー
Bladeのコメントは、{{– コメントの内容 –}}と記述しよう。

ーー
@include(‘layouts.header’)
インクルードする場合の、相対パスはどこから見たアドレスになるのだろう?
おそらく、routesで見にいったファイルから見たアドレスになるのではないかと思う。

 

ーー

cssやjsなど、ページごとにlinkするファイルを指定したい場合。
@stack(‘sakajs’)と@push(‘sakajs’)・・・@endpushを使う。

@stackをheaderなど共通部分が書いてある、common.bladeなどに記載する。
@pushをそれぞれのページのbladeに記載する。

@push・・・@endpushに記載されている内容が、@stackに記載されているものとして解釈される。

おそらく@pushと@stackは一対多になっているのだと思う。

 

ーー

レイアウトで、URLによる判定を行いたい場合。

@if(!Request::is(‘admin’))
 @include(‘layouts.header’)
@endif

Request::is(‘admin’) これで判定が返る。

@if(Request::is(‘/’)) トップページの判定はこれ。
@if(!Request::is(‘*login’)) isはLike検索を行なっているようなのでワイルドカードが使える。

Laravel 認証

ユーザー名とパスワードでログイン
LoginController.phpを編集する

public function username()
{
return ‘name’;
}

この関数を追加して、フォームのnameをname(データベースのカラム名)にする

Seederでダミーデータを入れる

LaravelのSeederを使う。

make:seederでシーターのファイルを作成して、データベースにinsertする記述を行う。
composer で dump-autoloadをして、DataBaseSeeder.phpに登録を行って、実行をするのだけどうまく動かない。

クラスがdose not exit.です。

composerを使う

ロリポップでコンポーザーを使う。
PHPにパスを通すことができないので、PHPの場所を指定して使う。

$ /usr/local/php7.1/bin/php composer.phar dump-autoload

composerではなく、composer.pharなのがなぜか?

Laravelで新しいクラスを作った時に、dump-autoloadしないといけないのだけど、だいぶ苦戦する。面倒。
dump-autoloadは、パスを通すようなことをしているのだと思う。

composer.jsonに、新しく作ったクラスファイルを置いているファイルのパスを追記する。
{
“require”: {
“google/apiclient”: “^2.0”
},
“autoload”: {
“classmap”: [“kobeu/kcs/app/Libs”]
}
}
requireは最初から書いてあった。autoloadを追記した。
classmapというのは、名前空間?みたいなもの。他の書き方もあって、それぞれメリットがあるようです。この辺りはおそらく深い。
config/app.phpにも、追記が必要。エイリアスaliasの設定も必要。

‘Common’ => App\Libs::class

これを追記した。
追加したクラスは、インスタンス化してから使う。下みたいに。

$common = new Common();
$string = $common->h($string);

Laravel データベーステーブルの作成

migrationという機能を使ってテーブルを作ります。
databese/migrations

このフォルダにマイグレーションのファイルを入れる。
プロジェクトのフォルダに移動して以下のコマンドを実行するとテーブルが作成される。

ファイルは、ぜひ、artisanを使いましょう。
$ /usr/local/php7.1/bin/php artisan make:migration create_registrations_table

$ /usr/local/php7.1/bin/php artisan migrate

migrationは、up()でテーブルを作成down()で元に戻す処理をする。元に戻す(?)

すでにテーブルがある場合はmigrateでエラーが出るので、現在あるテーブルを破棄して再度実行する場合はmigrate:freshを実行する。

ロリポップではphp7.1にパスが通っていないので、
/usr/local/php7.1/bin/php
これでphpを実行すると良い。そうでないとエラーになります。

ロリポップでmigrationするとSyntax Errorが発生する。
MySQLのバージョンがよくないということで、下の内容でconfig/database.phpを編集する。
(MySQL5.6ではエラーが出るということ)
‘charset’ => ‘utf8’,
‘collation’ => ‘utf8_unicode_ci’,


NULLを許可する
$table->string(‘init_password’)->nullable();

https://readouble.com/laravel/5.5/ja/migrations.html

ロリポップにLaravelを導入

ロリポップをSSHに対応する。
ターミナルでSSHにログインする
ssh お客様のSSHアカウント名@お客様のホスト名 -p 2222

入れなかった。以前にログインした時と、RSAというものが変わってしまったから?
SSHのFingerの何かは、ローカルに保存されている。それとサーバーに保存されているものが異なるため弾かれているらしい。

ローカルに保存されているものを消してもう一度保存し直す。

保存場所は
~/.ssh/knows_host
ここのロリポップのFinger何やらの行を削除して試してみたところ、パスフレーズを求められた。
ロリポップのユーザー情報に掲載されていたパスフレーズを4回入れたらログインできた。
4回入れるって何?

ロリポップにターミナルで入ることができたので、次にcomposerをインストールします。
/usr/local/php7.1/bin/php -r “eval(‘?>’.file_get_contents(‘https://getcomposer.org/installer’));”

これでcomposerをインストールできました。

次に、phpへのパスを通す。
export PATH=”$PATH:/usr/local/php7.1/bin”
(この設定はうまくいってるのかどうかわからない)

/usr/local/php7.1/bin/php composer.phar create-project –prefer-dist laravel/laravel フォルダ名 “5.5.*”
composer.pharが置いてあるフォルダに移動して、実行しないといけません。
すでに存在するフォルダにインストールしようとすると失敗するみたい。インストールフォルダを指定するとフォルダを作ってくれる。


create-projectが何をやっているか。
git clone してファイルを取得してからcomposer installをしているそうです。
prefer-dist というオプションは、git cloneするときにzipして落としてくるという指定をしているらしい。速くなる。


composerでインストールしてもしばらくファイルが表示されない。
SSHでアクセスしてからFTPでアクセスするとファイルが見えた。

インストールしたフォルダにアクセスしても500で表示されなかった。
サブドメインを設定して、php7.1を設定。Laravelはphp7.1でないと動かないようです。
サブドメインにアクセスしたらLaravelが表示されました。


403エラーが表示される場合
サブドメインの指定が間違ってる。Laravelをインストールしたフォルダではなく、publicフォルダをドメインの指定先にしないといけない。


次はデータベースを作成する。
ロリポップの管理画面でデータベースを作成。
.envファイルを編集。

直下のフォルダにある.envファイルにデータベースの接続設定があるのでこれを編集する。

データベースはできたので、次はmigrateします。
デフォルトで必要なテーブルがあるらしいのです。
/usr/local/php7.1/bin/php artisan migrate
コマンドを実行すると下のメッセージが表示される。
Could not open input file: artisan

これはartisanを動かすために、Laravelのフォルダに移動しないといけない。
laravelを入れたフォルダでartisanを実行したらmigrateできました。
これでとりあえず、Laravelをロリポップに導入することができた。
意外とスムーズに行きましたね。

仮想環境をローカルで動かすと負担が大きいから、ロリポップでもいいから外に置いた方が良い。と思う。


Laravelのインストールがうまくいかない場合がある。
killed でinstallが止まってしまう場合。

サーバーのメモリが足りずに途中で終わってしまっている。これはどうしたものか。

Laravel 起動

ターミナルで、「~/homestead」に移動して、「vagrant up」する。
これで起動する。
仮想環境が起動するということ。

hostに登録しているので、homestead.testにアクセスするとLaravelのサイトを見ることができる。
「vagrant halt」すると、仮想環境が終了する。

Laravelをローカル環境に入れる

VirtualBoxをインストールする。

すでに入っているような気がしますので、すでに入っているか入ってないかを調べます。どうやって?
ーーー
わからなかったので、HomebrewでVirtualBoxをインストールします。
すでに入っていたらどこかで怒られるのではないかな。わからんけど。

HomebrewのCaskと言う、何かでインストールしているみたいです。このあたりは本当の本当にブラックボックスで嫌になる。なんでこんなにややこしいのだろう。
ーーー
VirtualBoxをダウンロードしています。でかいっぽい。
(ファイルを見るとubuntuというOSが入っていてこれが4.5GBほどあった)
VirtualBoxのインストールができたので、次はVagrantと言うものをインストールする。
ーーー
Vagrantをダウンロードしてインストールしました。普通にインストールできた。
次は、Vagrantを使って、仮想環境のBoxと言うものを作る。ターミナルでVagrantに、Boxを作ってLaravelのHomesteadを入れてね、と言う命令を入れるとたぶんこれは今、やってくれてるな。

どうやら2時間ほどかかるみたいだ。これはすごいな。
ーーー
SSL_ERROR_SYSCALL, errno 54
このエラーが出て止まっていた。ダウンロードに失敗したみたいなのでもう一度やり直す。
ダウンロードの途中でパソコンがスタンバイに入ってしまったのがまずかったのかな。

2回目で成功した。
ーーー
Homesteadの設定ファイルをダウンロードする。
Github.com/laravel/homestead.gitからクローンする。

Homesteadフォルダに移動してbash init.shを実行する。
これで初期化が実行されたみたいです。
bashはLinuxコマンドで、init.shは、よくわからないけど初期化に関わる何かだと思う。この辺りもブラックボックスでよくない。
ーーー
homestead.yamlの編集をします。
仮想環境の設定みたいなので、自分の環境に合わせて設定をすればいいと思う。
foldersはソースコードを置いておく場所を設定。sitesは、ブラウザで仮想環境にアクセスするときのアドレスとその参照先を設定する。
ーーー
etc/hostsにホストを追加する。
192.168.10.10 homestead.test
ネームサーバと同じ動きになる。
ーーー
vagrantを起動してみたらまたhomesteadのダウンロードが始まった。
おそらく、gitでダウンロードした設定ファイルのhomesteadのバージョンが最初にダウンロードしたhomesteadのバージョンよりも古かったのではないでしょうか。
ーーー
homesteadの古いやつがたぶんダウンロード完了したので、vagrantにログインして、新しいlaravelを作ってみた。
作ってみたところwarningが出ました。なぜ?
homesteadフォルダにあるhomestead.yamlの設定を確認してみよう。

えらい。homestead.yamlのsitesの設定を間違っていた。修正したら「Laravel」って画面に表示されたすごい!できた。
ーーー
できたと思ったらまだだった。
ここから、Laradockというものを入れるためにDockerというものを入れないといけないみたいだ。こんなにたくさん入れないといけないものなのか?
HomesteadはLaravelの環境だと思ってた。Virtualboxを仮想環境を動かすための何かプラットフォームみたいなもの。vagrantはHomesteadを操作するためのもの。
すでに3つ入れているのに、まださらにDockerというものとLaradockというものを入れないといけない。こんな5つも入れないと動かないものなのか。もうちょっとどうにかならんのか。

と思ったら違った。Homesteadでやる場合と、Laradockでやる場合と2種類の方法があるよということだった。すまん。

Androidパッケージ手順

準備
例)
git で masterブランチに入って、pull
develop を master に marge して push.

パッケージ

BuildVariantsが表示されていない場合は、AndroidStudioの左端 BuildVariants をクリック。
BuildVariantsから、BuildするVariantsを選択する。
例)release(本番用など)

メニューのBuildから、Generate Signed Bundle/APK を選択
APKを選択(app storeにアップする場合はAndroid App Bundleを選択する)

keystore ファイルのパスを選択
例)androidフォルダの中に入ってる
keystorepasswordを入力

keyaliasを選択
keyaliasのパスワードを入力

BuildVariantsを選択(ここで選ぶから準備は最初に選択しておく必要はないのでは?)
Signnature Versionを選択(古いバージョンのAndroidで動かすときはV1なのかな)

Finish!

mysqlコマンド

mysqlの実行ファイルがある場所で実行する。
cakePHPの場合は、Library/binの中にあるので、そこで実行するかパスを通す。

~/.bash_profileに追記
export PATH=$PATH:/Applications/MAMP/Library/bin

設定したあとに
source ~/.bash_profile

公開鍵と秘密鍵

http://d.hatena.ne.jp/crosshope/20110509/ssh_keygen

SSHサーバーの公開鍵の指紋(finger print)

公開鍵の作り方
https://qiita.com/yshrksg/items/c2d1ef097340e31f8bbc

1.cd ~/.ssh
公開鍵を保存するフォルダに移動する。決まっている訳ではないみたいだけど、一般的にここに作っている。

ここにはすでに鍵が保存されている。
known_hostsには、一度接続されたサーバーの証明書が保存されている。

2.ssh-keygen -t rsa -b 4096
公開鍵を作成する。このコマンドを実行すると、鍵の名前とパスワードを聞かれる。
鍵の名前はファイル名になる。パスワードはおそらく、この公開鍵を使う際の認証で使用するものと思われる。

実行すると.sshフォルダに指定した鍵名称でファイルが作成される。
「filename」 と 「filename.pub」という二つのファイルができる。これが秘密鍵と公開鍵ということだと思う。

公開鍵をsshでやり取りするサーバーに登録する。

これでオッケーだと思う。

gitコマンド

リモートリポジトリのURL
git clone ssh://user@server:60022/home/user/test.git

cloneを作成する。cloneというのはファイルだけではなく、これまでの変更履歴なども全てサーバーの複製を取得するという意味。


git init
空のフォルダに.gitフォルダを作って、gitを使う準備をする。


・ローカルのリポジトリには、masterとorigin/masterの二つのブランチがある。fetchはorigin/masterのブランチを更新する
・origin/masterとは、origin(リモートリポジトリ)のmasterを追跡する追跡ブランチ
・追跡ブランチとは、リモートリポジトリの最新の状態を取得するための影武者

整理
リモートリポジトリの内容をローカルに反映させるための本来の手順は、リモートの内容をいったん追跡ブランチに反映させ、追跡ブランチとローカルの状態を比較して問題がなければ追跡ブランチの内容をローカルに反映させる。
コピーしてそのまま適用させるのはこわいので、手元にリモートの内容のコピーを取得するということを行なっている。

fetchコマンドは、ローカルの追跡ブランチを更新する。これによってローカルの追跡ブランチはリモートのブランチと同一の内容になる。

リモートリポジトリからローカルへのマージ方法
・GitHub Desktopでは、changed filesのchanges内容をdiscardすると、ファイル単位でmergeされる
・Branchメニューから、


commit

(おそらく)ローカル環境で開発を行ったものを、ローカル環境内で決定稿として保存する動作だと思う。commitしただけではリモートリポジトリは更新されない。commitしたものをpushするというもう一つ動作が必要。

git commit -m “コメント”

commitコメントをコマンドで編集しようとするとテキストエディターみたいなやつが現れて大混乱するので、-mで一緒にコメントを登録してしまう方が良い。


push

commitしたらpushする。pushするときにパスワードを聞かれるので入力してあげること。


pull

fetchとmergeを一気にやるコマンド。追跡ブランチにfetchして、追跡ブランチからローカルのブランチに合体させる。


Your branch and ‘origin/develop’ have diverged」

pullしようとした時に、上のメッセージが表示されてmergeできない場合がある。分岐点の異なるcommitをmergeしようとしていることが原因と思われる。こちらのcommitがリモートでmergeされていない場合、それぞれが独自の道を進んでしまってmergeできない。


git add

addコマンドで、指定したファイルがcommit候補に追加される。これはまだcommit候補です。これを指定した状態でcommitすると指定したファイルがcommitされる。


git remote -v

現在繋がってるリモートのアドレスを確認できる。
うっかり思っているリモートと違うところにつながってる場合がある。


git reset –hard HEAD^

これで直前のcommitを消去することができる。
commitの消去というのは、ローカルの変更の消去ということになる。例えばファイルを編集したとか。ファイルを追加したとか。ローカルで操作した内容を取り消したい時は、それがcommitされていれば、そのcommitを取り消すという考え方になる。
commitを取り消すとローカルのファイルも更新される(元に戻る)。ファイルを増やしたというcommitを消去するとファイルも消える(増やす前に戻る)


git checkout

 

ページ送り

endwhile;

the_posts_pagination( array(
‘mid_size’ => 2,
‘prev_text’ => __( ‘Back’, ‘textdomain’ ),
‘next_text’ => __( ‘Onward’, ‘textdomain’ ),
) );

$paged = get_query_var(‘paged’) ?: 1;
$loop = new WP_Query(
array(
‘posts_per_page’ => ‘3’,
‘paged’ => $paged,

WPテーマを作る

style.cssとindex.phpが必須。
functions.phpはなくても動く。

固定ページにテンプレートを当てる時は、page-***.php
ファイルに「* Template Name: ***」を書いておくと、投稿ページにテンプレートのセレクトが表示されるようになる。

wp_head()とwp_footer()は必須なので必ず書くように。
wp_head()は</head>の直前に、wp_footer()は </body>の直前に書く。
これがないとプラグインが動かなかったりする。

// アイキャッチ画像を有効にする。
アイキャッチ画像を使う時は、functions.phpに記載が必要。
add_theme_support(‘post-thumbnails’);

// 追加関数
function add_files() {

wp_deregister_script(‘jquery’);
wp_enqueue_script( ‘jquery’, ‘//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js’, “”, “20160608”, false );
wp_enqueue_script( ‘smart-script’, get_template_directory_uri() . ‘/js/common.js’, array( ‘jquery’ ), ‘20160608’, true );
wp_enqueue_style( ‘main’, get_template_directory_uri() . ‘/css/main.css’, “”, ‘20160608’ );
}
add_action( ‘wp_enqueue_scripts’, ‘add_files’ );

//アーカイブページのスラッグを設定する
これを設定した際は、パーマリンク設定の画面を「保存」しないと適用されない。

function post_has_archive( $args, $post_type ) {

if ( ‘post’ == $post_type ) {
$args[‘rewrite’] = true;
$args[‘has_archive’] = ‘news’; //任意のスラッグ名
}
return $args;

}
add_filter( ‘register_post_type_args’, ‘post_has_archive’, 10, 2 );

テーマのフォルダを追加する

<img src=”<?php echo get_template_directory_uri(); ?>/images/s_1.svg” alt=””>

uploadのフォルダパスを取得する

<?php $upload_dir = wp_upload_dir(); echo $upload_dir[‘baseurl’]; ?>

index.phpはとりあえずこれにしとこ

<?php get_header();?>

<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post(); ?>
<!–コンテンツここから–>

<?php the_content();?>

<?php
endwhile;
endif;
?>

<!–コンテンツここまで–>
<?php get_footer();?>

ショートコードでURLを呼び出す

//親テーマ
add_shortcode(‘oya’, ‘shortcode_gtdu’);
function shortcode_gtdu() {
return get_template_directory_uri();
}

//子テーマ
add_shortcode(‘ko’, ‘shortcod_gsdu’);
function shortcod_gsdu() {
return get_stylesheet_directory_uri();
}
//TOPページ
add_shortcode(‘top’, ‘shortcode_hurl’);
function shortcode_hurl() {
return home_url( ‘/’ );
}

//月別アーカイブ
add_shortcode(‘arcive’, ‘shortcode_arcive’);
function shortcod_arcive() {
return wp_get_archives( $args );
}

//カテゴリーアーカイブ
add_shortcode(‘cat_$id’, ‘shortcode_cat_$id’);
function shortcod_cat_$id() {
return get_category_link($id);
}

//投稿タイプのアーカイブ
add_shortcode(‘post_$post_type’, ‘shortcode_post_$post_type’);
function shortcod_post_$post_type() {
return get_post_type_archive_link( $post_type );
}

サイトのURLを取得する

<a href=”<?php echo esc_url( home_url( ‘/’ ) ); ?>about”>製品案内<span>PRODUCT</span></a>

yoast SEOの設定

左のメニューから「検索での見えかた」を選択。
「タイトルを強制的に書き換える」でtitleを設定する。テンプレートにtitleタグがあるとそちらが優先されてしまうのでテンプレート「header.php」からtitleタグは消しておいたほうがいい。「%%sitedesc%% 」は、一般設定のキャッチフレーズが表示される。

固定ページに自動的に<br>や<p>が入るのを防ぐ

add_filter(‘the_content’, ‘wpautop_filter’, 9);
function wpautop_filter($content) {
global $post;
$remove_filter = false;

$arr_types = array(‘page’); //自動整形を無効にする投稿タイプを記述 =固定ページ
$post_type = get_post_type( $post->ID );
if (in_array($post_type, $arr_types)){
$remove_filter = true;
}

if ( $remove_filter ) {
remove_filter(‘the_content’, ‘wpautop’);
remove_filter(‘the_excerpt’, ‘wpautop’);
}

return $content;
}

カスタムフィールドを取得

get_post_meta($post->ID , ‘カスタムフィールドの名前’ ,true);
表示中のカスタムフィールドは「$post->ID」で取得。指定したい時はここに投稿のIDをいれる。
最後のtrueをfalseにすると配列で返ってくる。複数の値がある場合はfalseにするんだろう。

固定ページのカスタムフィールドを取得

<!–?php echo get_post_meta(62, ‘about_subsidy_subtitle1’, true);?–>
固定ページのID。カスタムフィールドのスラッグ

GETで値を受け渡し

そのままではGETやPOSTの受け渡しはできない。
functions.phpに以下の関数を追記する必要がある。
query_varsの配列にGETなどで受け渡すkeyを登録する。

function set_org_query_vars( $query_vars ) {
$query_vars[] = ‘prm1’; // 独自のパラメータ prm1を配列最後尾に追加する。
$query_vars[] = ‘prm2’; // 独自のパラメータ prm2を配列最後尾に追加する。
return $query_vars;
}
add_filter(‘query_vars’, ‘set_org_query_vars’);

動画再生 フルスクリーン

<video playsinline muted controls autoplay src="" class="video1" id="myvideo">

動画を再生するにはvideoタグをサポートしたブラウザが必要です。

動画を再生することはhtml5でできる。
できないことは、音声付きの自動再生とスマホで自動的にフルスクリーンにすること。

自動再生するならフルスクリーンは必須だと思う。

フックに紐づいてる関数を調べる

/* フックされている関数のチェック */
function show_hook_func($attr){
global $wp_filter;
if($wp_filter[$attr[0]]){
$hookFunc.=’

‘.$attr[0].’にフックされている関数

‘;
foreach($wp_filter[$attr[0]]->callbacks as $cbKey=>$cb){
$hookFunc.=’

priority:’.$cbKey.’

    ‘;
    foreach($cb as $funcKey=>$func){
    $hookFunc.=’

  1. [‘.$funcKey.’]
  2. ‘;
    }
    $hookFunc.=’

‘;
}
$hookFunc.=’

詳細

’;
}else{
$hookFunc.=’現在フックに追加されている関数はありません。’;
}
return $hookFunc;
}
add_shortcode(‘hook_func’,’show_hook_func’);

Composer

インストール
・SSHを契約して、ターミナルから接続して、Composerをインストール。まではできました。

【ローカルDB】 Loacal Strage,Indexed DB,store.js

ブラウザにデータを保存する。
クッキーは数キロバイトしか保存できないのに対して、Local Storageは数メガバイト保存することができる。

そのままでは、keyとvalueしか保存できないので、オブジェクトを保存できるようにしたプラグインがstore.js。
これはjsonでデータを渡すと、中で何か上手いことやってくれてオブジェクトで取り出せるようになるという優れもの。

IndexedDBは、それをさらにSQLっぽく使える。インデックスを貼ってくれるとか。検索ができるようになるとか。

MW WP Form再送信する方法

ChromeのアドオンのWeb Developer のCookieメニューの「view-cookie-information」をクリック
mw-wp-form_sessionという名前のクッキーをDeleteする。

お名前
[mwform_text name=”your_name” size=”60″]
メール
[mwform_text name=”your_mail” size=”60″ placeholder=”sample@mailadress.com”]
電話番号
[mwform_text name=”your_tel” size=”60″ placeholder=”09099999999″]
お問い合わせ内容
[mwform_radio name=”category” children=”ご相談,見積もり依頼,その他”]
お問い合せ詳細
[mwform_textarea name=”text_area” cols=”50″ rows=”5″]

[mwform_submit name=”send_btn2″ value=”送信する”]

お名前:{your_name}
メール:{your_mail}
電話:{your_tel}
内容:{category}

詳細
{text_area}

node.js

Node.jsとは、サーバーサイドのJavaScript実行環境です。

Gulp:sassの実行

VPSなど、独立したOSが必要なのだと思う。レンタルサーバーでは使えない。
普通の人はどうやって使ってるのだろうか?ローカル環境でやってるの?

understrap

understrap-master.zip
understrap-child-master.zip

この二つでやりまっせ。
この親テーマと子テーマを解凍して、子テーマを編集する。
子テーマのstyle.cssを編集します。

Template:understrap-master

Templateのとことに、親テーマのフォルダ名を記載してください。

https://www.virment.com/make-wordpress-theme-from-understrap/

子テーマのCSSファイルを参照する。
<?php echo get_stylesheet_directory_uri(); ?>

masonry

jQuery(function($){

$(window).on(‘load’, function() {

$(‘.grid’).masonry({
// options
itemSelector: ‘.grid-item’,
columnWidth: ‘.grid-item’,
stagger: 30
});
});

});

画像の読み込みが終わってから動かさないと、外側の縦幅の計算がうまくいかない。
親要素のクラスに「grid」、子要素のクラスに「grid-item」(上のサンプルだとそうなる)と設定すること。

http://cly7796.net/wp/javascript/started-with-masonry/

GAの目標にContactForm7をトラッキング

//無料体験レッスンの送信をGoogleアナリティクスへ
document.addEventListener( ‘wpcf7mailsent’, function( event ) {
ga( ‘send’, ‘event’, ‘Contact Form’, ‘submit’ );
}, false );

GAには、3番目をカテゴリ、4番目をアクションとして登録すれば良い。
カテゴリ:Contact Form
アクション:submit

MW WP Form エラー発生箇所にスクロールする

エラー発生箇所にスクロールする。

//問い合わせのエラー発生時にエラー箇所へスクロールさせる
$(document).ready(function(){
if ( $(‘.mw_wp_form .error’)[0] ) {
var errorEl = $(‘.mw_wp_form .error’).eq(0);
var position = errorEl.parent().offset().top;
$(‘body,html’).delay(200).animate({scrollTop:position}, 600, ‘swing’);
}
});

FlexBox

親要素に、display:flex;
子要素に、flex:(数字);

(数字)は、幅のpxなどを指定するのではなく、比率を指定する。
子要素が3つある場合、flex:1;flex:2;flex:1; と指定すると、真ん中の要素は両脇の要素の2倍の幅になる。

IE10,11で子要素から中身がはみ出す時 「-ms-flex: 0 1 auto;」