【コツ】環境構築
・どうでも困ったら同じ環境の方にファイルをみせてもらって、ちがうところを探す
・wsl上のフォルダを扱うとき、圧縮・解凍はLinuxでやった方が早い！
・最終的にどんなコマンドを使ったかすべてメモを残しておくと後でめちゃくちゃ役立つ
・Windows側、Ubuntu側、docker側、全てのターミナルからバージョンがあっているかなど確認するとよい
・wgetコマンド活躍してた気がする
・ユーザー （Ubuntu）monaka…自分自身 （Docker）www-data（ダボダボ）…PHP使用権あり？
・Laravel、storageフォルダ…ファイルの読み書き保存などを行う。この権限に自分のユーザーを割り当てていないとエラーになる。権限は777でよさそう（次にやる前にもう一度調べたい）
【Linux】【Ubuntu】Apacheをインストール
Apache
1.インストール
「apt」と「apt-get」があるが、「apt」の方がモダンなコマンドなのでこちらを使うといい
sudo apt update sudo apt install apache2
2.ファイアウォールの調整
ufwアプリケーションプロファイルを一覧表示
sudo ufw app list
実行結果
Output Available applications: Apache Apache Full Apache Secure OpenSSH
- Apache: このプロファイルは、ポート80（通常の暗号化されていないWebトラフィック）のみを開きます。
- Apache Full: このプロファイルは、ポート80（通常の暗号化されていないWebトラフィック）とポート443（TLS/SSL暗号化トラフィック）の両方を開きます。
- Apache Secure: このプロファイルは、ポート443 （TLS/SSL暗号化トラフィック）のみを開きます。
設定したトラフィックを許可しながら、最も制限の厳しいプロファイルを有効にすることをお勧めします。現時点ではまだ、サーバーにSSLを設定していないため、ポート80のトラフィックのみを許可すればよいでしょう。
sudo ufw allow 'Apache'
変更の確認
sudo ufw status
＜つまづいたところ＞
「状態: 非アクティブ」になる場合は、ufwを有効化する
ufw enable
Webサーバーの確認
sudo systemctl status apache2
理想の結果
Output
● apache2.service - The Apache HTTP Server
Loaded: loaded (/lib/systemd/system/apache2.service; enabled; vendor preset: enabled)
Active: active (running) since Thu 2020-04-23 22:36:30 UTC; 20h ago
Docs: https://httpd.apache.org/docs/2.4/
Main PID: 29435 (apache2)
Tasks: 55 (limit: 1137)
Memory: 8.0M
CGroup: /system.slice/apache2.service
├─29435 /usr/sbin/apache2 -k start
├─29437 /usr/sbin/apache2 -k start
└─29438 /usr/sbin/apache2 -k start
＜つまづいたところ＞
- systemd が PID1 で動作していない
$ systemctl System has not been booted with systemd as init system (PID 1). Can't operate. Failed to connect to bus: Host is down
参考サイト
https://snowsystem.net/other/windows/wsl2-ubuntu-systemctl/#
- genieインストールが必要
monaka@DESKTOP-5QEHRDB:~/genie$ genie -s genie: コマンドが見つかりません
最初mac向けの記事を読んでいて、makeコマンドがない！！とあたふた笑
参考サイト
https://qiita.com/sakai00kou/items/0b401faf6dd72ad63d87
3.Webサーバーの確認
systemd initシステムでサービスが稼働中であることを確認
sudo systemctl status apache2
結果：OKな場合の例
Output
● apache2.service - The Apache HTTP Server
Loaded: loaded (/lib/systemd/system/apache2.service; enabled; vendor preset: enabled)
Active: active (running) since Thu 2020-04-23 22:36:30 UTC; 20h ago
Docs: https://httpd.apache.org/docs/2.4/
Main PID: 29435 (apache2)
Tasks: 55 (limit: 1137)
Memory: 8.0M
CGroup: /system.slice/apache2.service
├─29435 /usr/sbin/apache2 -k start
├─29437 /usr/sbin/apache2 -k start
└─29438 /usr/sbin/apache2 -k start
サーバーのIPアドレスを取得
hostname -I
インターネット上の別の場所から見たパブリックIPアドレスの確認方法
curl -4 icanhazip.com
ブラウザにアクセス
http:// さっき確認したサーバーのIPアドレスを入力
続き：
参考サイト
ついでにLaravelのインストールについて
Apacheの設定、権限変更まではしたんだけど、nanoエディタでlaravel.confの設定をいじるのはやってない
参考サイト
https://ubunlog.com/ja/laravel-framework-php-ubuntu/#Instalar_Laravel
拡張機能
- Activitus Bar
- Code Runner
- Peacock
- 色分けできる
- git lens
- Material Icon
【勉🌱】【JavaScript】コンストラクタ関数とは？
コンストラクタ関数（p80,176）
・new式を使用して新規オブジェクト（インスタンス）を作成する関数
【JavaScript】 コンストラクターとは？関数とは違うのか？
・クラスの中のコンストラクタとは違う
・JavaScript におけるコンストラクタ関数とは、プロトタイプオブジェクト
を継承してオブジェクトインスタンスを生成するための独立した関数のこと
オブジェクト指向（p78）
・クラスベース
・プロトタイプベース
クラスベース
・クラスは実体を持たない抽象概念
・例）Java
プロトタイプベース
・プロトタイプは実体のあるオブジェクト
・そもそもオブジェクトの抽象としてのクラスが存在しない
・オブジェクトは直接、他のオブジェクトを継承する
・継承元になったオブジェクトのことを『プロトタイプ』と呼ぶ
・プロトタイプへ直にメソッドを追加したり削除したりできる上に、その変更がすでに生成済みのインスタンスにも即時反映される
・例）JavaScript
参照：りあクト！【１．言語・環境編】
オブジェクトをつくる「もと」なのか？
クラスだったり関数だったりするけど、実体があるものを、JavaScriptにはクラスがないから「コンストラクタ関数」と呼ぶのかも？
class XXX { … }
function XXX( ) { … }
→ new XXX
クラスからオブジェクトがつくれるのはいいんだけど、関数からオブジェクトが生まれてくるのが気持ち悪い・・・
抽象クラス、インターフェース
JavaScriptにはない！
TypeScriptには導入されている
【JavaScript】関数型プログラミング
コールバック
・関数の引数として渡される関数のこと
例）関数の引数として関数をわたす
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log(arr.map((n) => n * 2));
高級関数✨
・関数の引数として関数を渡したり、戻り値として関数を返すことができる
例）関数の戻り値として関数を返す
const greeter = (target) => {
const sayHello = () => {
console.log(`Hi, ${target}!`);
};
return sayHello;
};
const greet = greeter('Step Jun');
greet(); // Hi, Step Jun!
※返しているもの
〇関数そのもの
×関数の実行結果 return sayHello()；にすると実行結果undefindが返る
参照：りあクト！【１．言語・環境編】
【JavaScript】…
■スプレッド構文
できること
・配列式や文字列などの反復可能オブジェクトを、0 個以上の引数 (関数呼び出しの場合) や要素 (配列リテラルの場合) を期待された場所で展開する
・オブジェクト式を、0 個以上のキーと値の組 (オブジェクトリテラルの場合) を期待された場所で展開する
使用例：他のオブジェクトにそのオブジェクトの中身を全て追加する（参照渡しではなく、コピーが作成できる！）
const person ={
name:'Max',
age:'30',
}
const copiedPerson = {
...person,
}
→キーバリューペアが１度すべて取り出されて、演算子の使われた場所に展開される！
