ターミナルからはログインできるのに！

ターミナルからmysql起動してログイン。

起動
$ mysql.server start

ログイン
$ mysql -u root -p

phpMyAdminからログインしよう！
http://localhost/phpmyadmin/

ユーザ名：root
パスワード：（mysql -u root -pの後に入力するパスワード）

するとエラーが出てきました。

mysqli_real_connect(): The server requested authentication method unknown to the client [caching_sha2_password]

これともうひとつ出てきましたが、これを調べて対処したら解決したので、残っていません。

どうやらMySQLにアクセスして修正する必要があるらしいです。

ターミナルに戻ってmysqlにアクセス

$ mysql -u root -p

パスワードを入力して入ると

mysql>

という表示がされるので、この状態で次を入力すると解決しました

解決法

mysql> ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY '(mysql -u root -pで入力するパスワード）';

とりあえずこれで解決しました。

原因はなんだったのか？

不明です。分かる方教えてください！

やっとこれでphpのローカル環境ができました。
ここまでくるのに2日もかかりました。

途中nginxに寄り道してしまい、結局うまくいかずApacheでやることにしてもなお道に迷った生まれて数秒並の子羊が書きました。

これから立派な羊になれるように勉強していきます。

参考にしたサイト

https://toaruhetare.net/9105
https://teratail.com/questions/29659

yarnをインストールするぞ！！！

その前にyarnって何？

Yarnは、Node.jsのパッケージマネージャーのこと。
結論から言うと、サーバーサイドのJavaScript実行環境のことらしい。

Node.jsって何？

node.jsとはサーバーサイドJavascriptのこと。
サーバーサイドでも動いたら便利になるみたい。

ほいで、パッケージマネージャーって何？

新しいソフトウェアのインストール、新しいバージョンへのソフトウェアの更新とかを簡単にさせてくる便利なヤツ。

本題に行こう

早速コマンドを生贄にyarnを特殊召喚してやる

$ brew install yarn
Updating Homebrew...

わっしょいわっしょい

?  /usr/local/Cellar/node/14.5.0: 4,659 files, 61.0MB
==> Installing yarn
xcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library/Developer/CommandLineTools/usr/bin/xcrun
Error: An exception occurred within a child process:
  CompilerSelectionError: yarn cannot be built with any available compilers.
Install GNU's GCC:　←←←←←← ん？？？
  brew install gcc　　

どうやらyarnを召喚するにはgccとなるものを生贄にしないといけないようだぜ。

ということで、gccを召喚する。

qiita.rb

$ brew install gcc
Updating Homebrew...
==> Downloading https://homebrew.bintray.com/bottles/gmp-

   わっしょいわっしょい  

cannot be installed as binary package and must be built from source.  
Install the Command Line Tools:　←←←← あん？？？
  xcode-select --install

どうやらgccを召喚するにはxcode-selectとなるものを生贄にしないといけないようだぜ。

ということで、xcode-selectを召喚する。

qiita.rb

 $ xcode-select --install
xcode-select: note: install requested for command line developer tools

もういっちょ、gccを召喚する。

qiita.rb

$ brew install gcc      

わっしょいわっしょい

==> Downloading https://homebrew.bintray.com/bottles/gmp-
==> Pouring gcc-10.1.0.catalina.bottle.tar.gz
?  /usr/local/Cellar/gcc/10.1.0: 1,463 files, 338.5MB

待ちに待ったyarnを召喚して、滅びのバーストストリームを放つ

qiita.rb

$ brew install yarn     
==> Downloading https://yarnpkg.com/downloads/1.22.4/yarn-v1.22.4.tar.gz

わっしょいわっしょい

?  /usr/local/Cellar/yarn/1.22.4: 14 files, 5MB, built in 2 seconds

大勝利

qiita.rb

 $ yarn -v
1.22.4

1.Scrapyを導入

画面のnewボタンを押下（uploadボタンの横）

以下のように表示されますのでPython３をクリック

こんな画面が表示される

表示されたら以下文章を入力
!pip install scrapy

以下のように pip でインストールするのみです。
インストールが完了すると scrapy コマンドが使えるようになります

上記入力後、▶︎I　Runボタンを押下
scrapy version
Scrapy 1.5.1

終わりに

これでクローリングをするための導入手順は終わりです。
クローリングはクラウドワークスなどの副業サイトなどでもたくさんの募集があったりなど
これからの日本の働き方に適したスキルだと思うので是非、学習してみてはいかがでしょうか。

【ゴール】

flex-box忘れていたので、振り返り

【コード】

何はともあれ、「display: flex;」を親要素に指定

flex-wrap: wrap;

＊折り返し
＊HTMLにboxとcontentクラスを用意

css.hoge.css

.box{
  background-color: lightgreen;
  min-height: 200px;
  widows: 100%;
  display: flex;
  flex-wrap: wrap;
}

.content{
  margin: 10px;
  height: 100px;
  width: 30%;
  background-color: green;

justify-content: space-between;

hoge.css

.box{
  background-color: lightgreen;
  height: 200px;
  widows: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.content{
  background-color: green;
  height: 100px;
  width: 100px;
}

justify-content: center;

＊横軸の位置

css.hoge.css

.box{
  background-color: lightgreen;
  height: 200px;
  widows: 100%;
  display: flex;
  justify-content: center;
}

align-items: center;

＊縦軸の位置

css.hoge.css

.box{
  background-color: lightgreen;
  height: 200px;
  widows: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

抜けていたので、復習含めて書きました。
bootstrapを使えばあまり使わずすみますが、覚えていて損はないかと

【合わせて読みたい】

■ 【Rails new】Ruby on rails アプリケーション作成
https://qiita.com/tanaka-yu3/items/3fe1ed2852c6513d3583

■ 【devise】 rails g devise:install ができない、、時こそ！！
https://qiita.com/tanaka-yu3/items/8a2002921cda080907f8

■ 【メソッド集】　rails メソッド　まとめ　基礎　随時追加
https://qiita.com/tanaka-yu3/items/89abad875187494bec53

実現したかったこと

当方、超ド級のMac初心者かつphp初心者。非エンジニアです。勉強中です。ApacheやHomebrewなどの仕組みがいまいちわかっていないせいか、サイトに書いてあることを参考にやっても全然表示されずに途方にくれました。丸2日もかかったしまったことを書いておきます。

MacBookでphpMyAdminをブラウザで表示できるようにしたいのですが、いろんなサイトを真似してやってもうまくいきません。

発生している問題・エラーメッセージ

アドレスバーにlocalhostを入力するとIt works!は表示されます。

phpMyAdminをHomebrewでインストールしました。

chromeのアドレスバーにphpMyAdmin.local:8080やlocalhost/phpMyAdminを入力してもログイン画面が出てこず、下記のように表示されます。

Not Found
The requested URL was not found on this server.

Apacheのエラーログを見ると
/private/var/log/apache2/error_log

[Fri Jul 10 14:49:48.931992 2020] [core:notice] [pid 39120] AH00094: Command line: '/usr/sbin/httpd -D FOREGROUND'

MySQLの設定

以下を参考に設定しました。
https://tofusystem.work/programming-lesson/howto-mysql-phpmyadmin-setting-for-mac/

$ mysql --version
mysql  Ver 8.0.19 for osx10.15 on x86_64 (Homebrew)

インストールはできているかと。

$ mysql.server start
Starting MySQL
 SUCCESS! 

2020-07-10T07:02:12.6NZ mysqld_safe A mysqld process already exists

MySQLを起動するとSUCCESS！が表示されますが、続いて最後の一行も出てきます。この時点であかん気はしていますが、とりあえず起動できているものとして次のMySQLの設定に進みました。

MySQLはrootパスワード無しでインストールされます。
下記コマンドでrootパスワードなどの初期設定をしましょう。
途中でyesまたはnoで答える部分があるので、それについても記載しています。
基本的にはyesまたはYで答えればOKです。

これに従い設定しました。

MySQLにログインも成功しているようです。

$ mysql -uroot -p
Enter password: 
Welcome to the MySQL monitor.  Commands end with ; or \g.
Your MySQL connection id is 10
Server version: 8.0.19 Homebrew

Copyright (c) 2000, 2020, Oracle and/or its affiliates. All rights reserved.

Oracle is a registered trademark of Oracle Corporation and/or its
affiliates. Other names may be trademarks of their respective
owners.

Type 'help;' or '\h' for help. Type '\c' to clear the current input statement.

mysql> 

続いてhomebrewでphpmyadminをインストール。インストール時に次のようなメーセージが出てくるのでそれに従い瀬一定するとのことだったので、やってみました。httpd.confが見当たらなかったので、https://qiita.com/yukibe/items/8896a91007cc5a1dfc45を参考にしました。

引用テキストadd this at the end of
your /etc/apache2/httpd.conf for instance) :

ということで、上のディレクトリにhttpd.confが見つかったので、最後の行に以下のAlias〜をコピーして貼り付けしました。

==> Caveats
To enable phpMyAdmin in Apache, add the following to httpd.conf and
restart Apache:
    Alias /phpmyadmin /usr/local/share/phpmyadmin
    <Directory /usr/local/share/phpmyadmin/>
        Options Indexes FollowSymLinks MultiViews
        AllowOverride All
        <IfModule mod_authz_core.c>
            Require all granted
        </IfModule>
        <IfModule !mod_authz_core.c>
            Order allow,deny
            Allow from all
        </IfModule>
    </Directory>
Then open http://localhost/phpmyadmin
The configuration file is /usr/local/etc/phpmyadmin.config.inc.php

上記の表示によルトこれでApacheを再起動すればphpMyAdminがブラウザから表示されるはず？！

$ sudo apachectl restart

なのに表示されない・・・

と思ったら表示されました。
書きながら手順通りにもう一度やっていたらできてしまいました。

何が原因だったのかもわからないけど、とりあえずできたのでOKですかね。

初心者にはよくある現象ですかね。同じようにやっているつもりでもどこかでミスをしていたのでしょう。こういうことが私自身はよくあるのでとりあえず記録として残して置くことが重要ですね。

他にも同じように困っている人の参考になればと思います。

はじめに

今まで職場ではWindowsばかり使ってきましたが、
この度自宅でMacを本格的に使い始めることになりました。
これまでに何度も繰り返し検索したショートカットキーをまとめます。

これなに？

メニューを開いたときなど、こんな感じでショートカットを教えてくれているであろう表記に出会うことがあります。
しかしWindowsユーザーにはこの図形の意味が分からないのです。
ということでまずはそれぞれが表すものについて。

図形	キーボード
⌘	command
⇧	shift
⌥	option
⌃	control
⏏	メディア取り出しキー
⇪	caps lock
⎋	escape/esc
⌫	delete

⌥と⌃の意味が特に分からなくてキーボードの隅から隅まで探してしまいした…

よく使用するショートカットキー

全般

画面をロック

control + command + q

Google Chrome系

デベロッパーツールを表示/非表示

option + command + i

今閉じたタブを再表示

command + shift + t

ツール系

画面全体をスクリーンショット

command + shift + 3

範囲選択でスクリーンショット

command + shift + 4

キャプチャ画像はデスクトップフォルダに保存されます。

非同期の動作をさせたくて、スレッド作成の方法を勉強しましたが、
引数の渡し方についてあまり情報がなかったので書き留めます。

javascriptにおいてスレッドという呼び方が正しいのかはまだわからないですが
（基本的にシングルスレッドで動作するものなので、どういう仕組みかは厳密にはまだ不明なためです）
動作させてみたところ非同期に動作しているように見えました。

環境

macOS : 10.15.5 Catalina
node.js : v14.3.0

スレッド呼び出しの種類について

非同期スレッドの作り方は二種類あり、①クラスタ②子プロセス呼び出し
です。簡単に以下にそれぞれの使い方を書きます。
①は呼び出し元のjsファイルが複数個同時に動作するイメージです
②は呼び出し元とは異なるjsファイルが同時に動作するイメージです。

クラスタ呼び出し

cluster.js

var cluster = require('cluster');
if (cluster.isMaster)   { console.log('parent'); cluster.fork();    }
else                    { console.log('child');                     }

上記コードの実行結果は以下です

parent
child

この場合、それぞれの（子）スレッドに引数を渡すことは(試した限り）出来ませんでした。
用途的には全く同じイベントハンドラを複数持つとパフォーマンスが上がる場合がよいとおもいますが、
それについてまだ知識はありません。

子プロセス呼び出し

以下のような手順です。
引数を渡すには、fork()の第二引数にarrayを指示します。
child_process.fork( 呼び出すjsファイル名 , 引数配列 );

parent.js

var child_process = require('child_process');
var c = child_process.fork(__dirname+'/child' , ['foo' , 'bar' ] );

呼ばれる子プロセスは、
process.argv配列に、親から指示された引数が格納されています。
以下の例は全部の引数要素をダンプします。

child.js

process.argv.forEach( function(item) {console.log("arg:" + item);} );   //dump args

実行の仕方と結果は以下です。

$ node parent
arg:/Users/***/.nodebrew/node/v14.3.0/bin/node
arg:/Users/***/***/child
arg:foo
arg:bar

process.argv[0] : node 実行ファイルのパス
process.argv[1] : 実行している js ファイルのパス
process.argv[2] : 引数配列 要素 [0] : 今回は親プロセスが「foo」を指示しています。
process.argv[3] : 引数配列 要素 [1] : 今回は親プロセスが「bar」を指示しています。

実際に引数を参照するには process.argv[2]〜先を読み込みするようにします。
この呼び出し方ならば、スレッド毎に親で仕事内容を指示することができます。

親-子間の通信

子プロセスの場合には親子間でメッセージやりとりができます。
両者ともにon()が受信ハンドラ、（引数がメッセージ内容）、send()が送信処理。

parent.js

var child_process = require('child_process');
var c = child_process.fork(__dirname+'/child' , ['foo' , 'bar' ] );

c.on('message', function (msg) { console.log('[Parent]received msg = [' + msg + ']'); }); //msg handler
c.send('Hello');

child.js

process.on('message', function(msg) {
        console.log('[Child]received msg = [' + msg + ']' );
        if(msg == 'Hello') process.send('Hello by ' + process.argv[2]);
})

実行結果は以下。

$ node parent
[Child]received msg = [Hello]
[Parent]received msg = [Hello by foo]

ためしにたくさん子プロセスを呼び出してみた。

これは参考ですが、たくさん呼び出すとどうなるものかを試してみました。

parent.js

var child_process = require('child_process');
const n_child = 16;
var _childlen =[];
for( var i = 0 ; i < n_child ; ++i) {
        _childlen[i] = child_process.fork(__dirname+'/child' , [ i ] );
        _childlen[i].on('message', function (msg) { console.log('[Parent]received msg = ['+ msg + ']' ); });
}
_childlen.forEach( function(a) { a.send('Hello'); });

child.js

process.on('message', function(msg) {
        console.log('[Child]received msg = [' + msg + ']' );
        if(msg == 'Hello') process.send('Hello by ' + process.argv[2]);
})

実行結果は以下。
parentのsend()の一連の処理と、chilldの返信処理が非同期（同時）に実行されていることがわかります。

childからのメッセージを受信したときのダンプ（[Parent] received）が順不同なのが興味深いです。
イベントハンドラをどの順番に処理するかの内部的な処理によるものですが、
(あくまでも想像です)
親プロセスのイベント処理待ちキューに、順不同に入っていると思われて、
childの送信処理（１６個分）が非同期に行われていることが言えるのではと思います。
単純に考えて、それぞれの子プロセスが個別のスレッドとして動作しているのならかなり効率は良いと思いました。
パフォーマンスに困ったら、これを利用して並列処理なども手段として検討できるでしょう

$node parent
Child]received msg = [Hello]
[Parent]received msg = [Hello by 0]
[Child]received msg = [Hello]
[Child]received msg = [Hello]
[Child]received msg = [Hello]
[Child]received msg = [Hello]
[Parent]received msg = [Hello by 3]
[Parent]received msg = [Hello by 5]
[Parent]received msg = [Hello by 6]
[Parent]received msg = [Hello by 1]
[Child]received msg = [Hello]
[Parent]received msg = [Hello by 4]
[Child]received msg = [Hello]
[Parent]received msg = [Hello by 2]
[Child]received msg = [Hello]
[Parent]received msg = [Hello by 7]
[Child]received msg = [Hello]
[Parent]received msg = [Hello by 11]
[Child]received msg = [Hello]
[Parent]received msg = [Hello by 8]
[Child]received msg = [Hello]
[Child]received msg = [Hello]
[Parent]received msg = [Hello by 10]
[Parent]received msg = [Hello by 12]
[Child]received msg = [Hello]
[Parent]received msg = [Hello by 9]
[Child]received msg = [Hello]
[Parent]received msg = [Hello by 14]
[Child]received msg = [Hello]
[Parent]received msg = [Hello by 13]
[Child]received msg = [Hello]
[Parent]received msg = [Hello by 15]

OSのプロセスをみてみると、やはり子ごとにプロセス(スレッド)が生成されていました。

6049 s000  S+     0:00.01 grep node
 6023 s002  S+     0:00.20 node parent
 6024 s002  S+     0:00.10 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/＊＊＊/webserver_nodejs/child 0
 6025 s002  S+     0:00.10 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 1
 6026 s002  S+     0:00.10 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 2
 6027 s002  S+     0:00.11 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 3
 6028 s002  S+     0:00.10 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 4
 6029 s002  S+     0:00.10 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 5
 6030 s002  S+     0:00.10 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 6
 6031 s002  S+     0:00.11 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 7
 6032 s002  S+     0:00.10 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 8
 6033 s002  S+     0:00.09 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 9
 6034 s002  S+     0:00.09 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 10
 6035 s002  S+     0:00.09 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 11
 6036 s002  S+     0:00.10 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 12
 6037 s002  S+     0:00.10 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 13
 6038 s002  S+     0:00.10 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 14
 6039 s002  S+     0:00.09 /Users/***/.nodebrew/node/v14.3.0/bin/node /Users/***/webserver_nodejs/child 15

もっとたくさん呼び出してみた。

上記コードの子プロセス数をたくさんにしてみました。

parent.js

   :
const n_child = 4096;
   :

結果は以下

$node parent
child : 0
child : 1
    :
    :
child :385
child :405

(libuv) kqueue(): Too many open files in system
/Users/***/.nodebrew/node/v14.3.0/bin/node[7040]: ../src/tracing/agent.cc:55:node::tracing::Agent::Agent(): Assertion `(uv_loop_init(&tracing_loop_)) == (0)' failed.
     :
     :
Error: ENFILE: file table overflow, uv_pipe_open
      :
SystemErr

子プロセスの数が400個を超えたところで、エラーが表示されました。
OSのスレッド数の限界がくるのかなと思ったのですが、これはnode.jsシステムのlibuv(IO関連処理を行う部分)が扱うパイプの個数の限界のようです。
親子通信で使用しているものと思われます。
実行中、この記事を書いているブラウザも、読み込みエラーになってしまったので、OSに対しても負荷がかかったと思われます。
プロセスが多くなりすぎた原因で（各々初期化などある程度の処理が走ると思われ）
ネットワークの処理が追いつかなくなったように感じます。がmacOS自身が飛んだりということはありませんでした。
過剰に呼び出しすぎるのはよくないですが、もしかしたら時間を開けて子プロセスの起動を行えば、問題がなくなるかもしれません。
（すべて想像です）

$ find . -name "*.HEIC" | xargs -I{} sips --setProperty format jpeg {} --out {}.jpg