014 dev log

必須コンポーネント設置

初期設定の時設置したコンポーネントはパス

・Apache 2.2 またはApache 2.4 ⇒ パス

・glibc 2.5 以降

$ sudo apt install glibc-source -y
$ ldd --version

・perll

$ sudo apt install perl
$ perl -V

・wget

$ sudo apt-get install wget
$ wget --version

・unzip

$ sudo apt install unzip

・make

$ sudo apt install make -y
$ make --version

・openssl ⇒ パス

・JDK/JRE 8 (1.8) 、11、17 (ウェブ管理画面を使用する場合)

$ sudo apt-get install openjdk-8-jdk

・fontconfig (ウェブ管理画面を使用する場合)

$ sudo apt-get -y install fontconfig

siteguard 設置

rpmはエラーがあってtar.gzでやってみたら、こっちは問題なかった！

インストールファイルを取得する時のwgetの詳細は下のURLで確認

URL接続の時必要なアイパスはコントロールパネル右上のメニューで確認ができる🐘

# /usr/local/src/に移動しファイルをダウンロード
$ cd /usr/local/src/
$ sudo wget siteguard-server-edition-XXX-X.apache.XXXX.tar.gz

# 圧縮解凍
$ sudo tar -zxvf siteguard-server-edition-XXX-X.apache.XXXX.tar.gz

# インストール
$ cd siteguard-server-edition-XXX-X.apache.XXXX
$ make install

Install succeeded!
Please run the following command
in order to setup apache
# cd /opt/jp-secure/siteguardlite
# ./setup.sh

続きはsiteguardliteの設定

$ cd /opt/jp-secure/siteguardlite/
$ ./setup.sh

基本的に[]中の値があった場合はEnterかYesを入力

# サーバConfigルート
please enter Apache Config File. [/etc/apache2/apache2.conf] -->

# サーバ実行ファイルルート
please enter Apache Binary File (httpd). [/usr/sbin/apache2] -->

systemd 環境の場合、以下のメッセージが表示されます

# systemdを使うならEnter
Is the Web server registered in systemd?

please enter Apache service name. [apache2] -->

# ウェブ管理画面を使用
do you want to use the web administrative console?
* to use the console, you will need JDK or JRE is installed.
please select. [yes]|no -->

proxy_module is requiredエラーがでたらApacheモジュールを有効すればOK

JDKのPathは私の場合「/usr/lib/jvm/java-8-openjdk-amd64/」でした

無料SSLのLetsEncryptの場合ここまでできたらhttps://domain:9443に接続できたけど

有料のSSL使った場合はSSLパスを変える必要がありました😫

siteguardliteのconfigファイルを開いてSSLルートを変更します

私の場合SSL関連ファイルは/etc/ssl/privateに置いてあるので下の画像ように修正

$ vi /opt/jp-secure/siteguardlite/conf/httpd.conf.siteguardlite_admin_ssl

だがしかし…それでも接続ができなかった…しかも80ポートも急に開けなくなった……

pingを送信してみたら「要求がタイムアウトしました。」🙄ｗ

こりゃファイアウォールの問題でしかない！

さくらVPSの場合コントロールパネルでポートを操作することができるけど

何故かできなかったのでufwは削除し、firwalldで直接操作しまーす

# Uninstall ufw 
$ sudo apt remove ufw

# Install firewalld
$ sudo apt install firewalld

# firewalldを作動させる
$ sudo systemctl enable firewalld
$ sudo systemctl start firewalld

# アクティブ確認
$ sudo systemctl status firewalld

オープンするポートは7つ

# Web
$ sudo firewall-cmd --permanent --zone=public --add-port=80/tcp
$ sudo firewall-cmd --permanent --zone=public --add-port=443/tcp

# SSH
$ sudo firewall-cmd --permanent --zone=public --add-port=22/tcp

# FTP
$ sudo firewall-cmd --permanent --zone=public --add-port=20/tcp
$ sudo firewall-cmd --permanent --zone=public --add-port=21/tcp

# DB
$ sudo firewall-cmd --permanent --zone=public --add-port=3306/tcp

# WAF
$ sudo firewall-cmd --permanent --zone=public --add-port=9443/tcp

# 設定をリロード
$ sudo firewall-cmd --reload

すると

接続できました！

参考サイト

https://qiita.com/masa23/items/aeca9800f152e29f52d3

https://manual.sakura.ad.jp/vps/server/etc/siteguard.html?_gl=1*w8nt81*_gcl_aw*R0NMLjE3MDU5NzE4OTYuQ2owS0NRaUF3Yml0QmhESUFSSXNBQmZGWUlLYzhMRUJlTXlvcDhUOVJSV1dMbjFMWVZFVmZ1Nlc4QXFITWlwZkEtRXliZTNHcVFvTTlwWWFBbVo1RUFMd193Y0I.*_gcl_au*OTI2NTEyOTg4LjE3MDI4NjkwNTU.

# root 권한 있는 경우
$ sudo vi /etc/crontab

# root 권한 없는경우
$ crontab -e

크론탭 돌릴 문구 추가

* * * * * cd {project-root} && sudo php artisan schedule:run >> /dev/null 2>&1

처음보는 구문이 >> /dev/null 2>&1 인데 크론탭 오류시 /dev/null에 보낸다는 뜻이다

하지만 여기서 /dev/null로 보낸다는것 자체는 데이터를 없애는 뜻과 같으므로

오류시 출력이 화면에도 파일에도 남기지 않겠다는 뜻!

하지만 스케줄러 오류시 확인을 해야할것 같아서 우선 아래와 같이 변경했다

* * * * * cd {project-root} && sudo php artisan schedule:run >> /var/log/schedule.log 2>&1

참고자료

https://www.youtube.com/watch?v=tEdtYl0xZMM

https://inpa.tistory.com/entry/%EB%A6%AC%EB%88%85%EC%8A%A4-devnull-%EB%A6%AC%EB%8B%A4%EC%9D%B4%EB%A0%89%EC%85%98-%EA%B8%B0%ED%98%B8-%EC%A2%85%EB%A5%98

PHP Download

https://windows.php.net/download/

Non Thread Safe 64bit 버전을 다운 후 압축해제

나는 C:\dev에 파일을 옮긴 후 php8.3로 폴더명을 변경했다

Make php.ini

php.ini-development

php.ini-production

두개 파일중 하나를 복사해서 php.ini으로 이름 변경

개발환경에 더 적합한 development를 선택했다

Set php.ini

확장 모듈 디렉토리 설정

extension_dir 주석 해제 후 path 변경

언어 설정을 위해 extension=mbstring 주석 해제

(extension 작업하면서 추가 설정할 예정)

+ composer install 실행시 오류가 나서

extenstion=fileinfo 도 추가로 주석 해제해주었다

참고자료

https://hsuzzang.tistory.com/entry/PHP-Windows-10-PHP-%EC%84%A4%EC%B9%98-%EB%B0%8F-%ED%99%98%EA%B2%BD-%EB%B3%80%EC%88%98-%EC%84%A4%EC%A0%95

https://www.javadrive.jp/php/install/index5.html

KEY 생성

@ /etc/ssl/private

$ openssl genrsa -des3 -out {key name}.key 2048
$ openssl req -new -key {key name}.key -out {csr name}.csr

// Country Name : 국가코드(ex. KO, JP)
// State or Province Name : 도시명
// Locality Name : 시, 구
// Organization Name : 회사명
// Organization Unit Name(생략가) : 부서명
// Common Name : 도메인
// Email Address(생략가)
// A challenge password(생략가)
// An optional company name(생략가)

발급된 CSR로 SSL 발급 요청 한다

발급된 인증서 저장

@ /etc/ssl/private

위치는 정해져있는건 아니지만 난 ssl/private에 저장했다

나같은 경우 메일로 証明書(.crt) / 中間証明書(.cer)가 발급되는데 해당 내용을 서버에 파일로 저장해줬다

$ vi server.crt
$ vi server.cer

// 비밀키 내용 확인
$ openssl rsa -text -noout -in {KeyFile}
// CSR 내용 확인
$ openssl req -text -noout -in {CSR}
// 증명서 내용 확인
$ openssl x509 -text -noout -in {CertFile}

/etc/apache2/sites-available/ 에 작성한 conf에 작성할때는 아래에 맞춰서 경로 작성해주면 됨

SSLCertificateChainFile - 중간 인증서(.cer)

SSLCertificateFile - 인증서(.crt)

SSLCertificateKeyFile - 인증서 서명 요청 생성 시 생성한 키(.key)

ssl 관련 모듈 설정

$ cd /etc/apache2

$ sudo a2enmod ssl
$ sudo a2enmod default-ssl
$ sudo a2enmod rewrite

$ sudo systemctl restart apache2

https://jp.globalsign.com/support/ssl/manual-install/apache2.html

https://jp.globalsign.com/support/ssl/manual-csr/apache2.html

https://www.miraiserver.ne.jp/column/about_ubuntu-apache/

권한 확인

$ ls -al {path}

아래 예시로 권한을 확인해보자

drwxr-xr-x 2 root root 4096 Nov 22 17:48 .
drwxr-xr-x 5 root root 4096 Nov 22 17:48 ..
-rw-r--r-- 1 root root 12005 Jul 20 17:41 httpd.conf
-rw-r--r-- 1 root root 13430 Jul 20 17:42 magic

가장 처음 자리는 종류를 나타낸다

그 다음은 순서대로 사용자(owner)/그룹(group)/다른사용자(other) 순서대로 rwx 권한을 확인할 수있다

예를 들어 rw-r--r-- 인 경우의 권한은 사용자: 읽기, 쓰기 / 그룹 : 읽기 / 다른사용자 :읽기 이다

참고자료

https://qiita.com/ichikwys/items/930bc4fc1bda2551636d

자주 쓰이는 html은 Component에 담아서 호출하여 편하고 깔끔한 html 작성이 가능하다

Component 생성

// function은 대문자로 시작하도록
// return 안에는 하나의 div값 안에 넣을것 
function Modal(){ 
  return (
    <div className='modal'>
      <h4>title</h4>
      <p>date</p>
      <p>content</p>
    </div>
  )
}

Component 사용

<함수명></함수명>

<Modal></Modal>

프로젝트 생성

프로젝트 파일에서 shift를 누른채로 우클릭 후 PowerShell 창 열기를 클릭

파워쉘에서 아래 명령어를 실행한다

npx create-react-app {프로젝트명}

성공!

프로젝트 구조

VS Code에서 프로젝트를 실행시켜보면 아래와 같은 구조가 있는데 역할도 잘 알아두자

node_modules : 라이브러리 코드를 보관하는 곳

public : static 파일 모아놓는 곳

src : 소스코드 모아놓는 곳

package.json : 프로젝트 정보