전산직의 삶

라즈베리파이4 아파치(Apache) 가상호스트(VirtualHost) 사용하기 (홈페이지 여러개 운영하기)

먼저 아파치를 설치하는 방법에 대해서는 이전에 포스팅 했던 자료를 링크해드립니다. 참고하셔서 아파치를 먼저 설치하시고 오셔야 됩니다.

reddb.tistory.com/94?category=914227

아파치가 설치됐다면 아래 단계로 진행하여 가상호스트를 만들고 홈페이지를 추가할 수 있습니다.

1. /var/www/ 폴더에 새로운 홈페이지 폴더 만들기 (폴더 이름은 원하는걸로)
2. /etc/apache2/sites-available/ 폴더에 가상호스트 conf 파일 만들기 
3. /etc/apache2/sites-enabled/ 폴더에 2번에서 만든 conf파일 심볼릭 링크 만들기
4. /etc/apache2/ports.conf 파일을 vi로 수정하여 Listen 숫자(가상호스트 포트) 추가하기
5. /var/www/새로만든홈페이지폴더/ 에 홈페이지파일 넣고 사용자권한을 www-data로 변경하기
6. 아파치 재실행하고 브라우저로 접속해서 홈페이지 정상적으로 뜨는지 확인하기

아파치(Apache)를 설치하시고 나면 /var/www/ 경로에 html이라는 폴더가 생성됩니다. 이 폴더가 브라우저로 라즈베리파이IP에 접근 시 자동으로 접속해주는 80포트로 설정된 기본 홈페이지 폴더입니다.

html 폴더 말고 추가하는 홈페이지가 사용할 폴더를 /var/www/ 경로에 mkdir로 만들어 줍니다.

저는 test라는 폴더로 만들어 보겠습니다.

$ sudo mkdir test

다음은 /etc/apache2/sites-available/ 폴더로 이동하여 새로만들 가상호스트의 conf 파일을 만듭니다.

저는 001-test.conf로 파일을 만들어 보겠습니다. 가상호스트 포트는 8080으로 만들겠습니다.

$ cd /etc/apache2/sites-available/

$ sudo vi 001-test.conf

<VirtualHost *:8080>
# (주석) 80은 기본포트라 사용하면 안되고, 저는 8080으로 만들었습니다.
        ServerName www.test.com
        # (주석) 서버이름입니다.
        ServerAdmin webmaster@localhost
        # (주석) 서버Admin입니다.
        DocumentRoot /var/www/test
		#(주석) 8080포트로 접근할 경우 사용하게될 홈페이지 폴더 위치입니다. 저는 test로 만들었습니다.

        ErrorLog ${APACHE_LOG_DIR}/error.log
        CustomLog ${APACHE_LOG_DIR}/access.log combined

</VirtualHost>

다음은 /etc/apache2/sites-enabled/ 폴더에 방금 위에서 만든 001-test.conf 가상호스트 conf 파일을 심볼릭 링크로 만들어 줍니다.

$ cd /etc/apache2/sites-enabled/

$ sudo ln -s ../sites-available/001-test.conf ./

다음은 /etc/apache2/ports.conf 파일을 수정해야 합니다. vi로 ports.conf 파일을 열어보면 기본 80 포트가 Listen되어 있습니다. 바로 밑에 가상호스트에서 만든 8080포트를 Listen 8080으로 추가합니다.

$ cd /etc/apache2/

$ sudo vi ports.conf

다음은 홈페이지 파일을 새로만든 홈페이지폴더(저는 /var/www/test/ 폴더) 에 넣어야 합니다.

저는 따로 만든 홈페이지가 없어 phpinfo 페이지를 만들어 정상 작동하는지 테스트 하겠습니다.

(php를 사용하기 위해서는 설치를 먼저해야합니다. php설치 방법은 아래 링크로 대신합니다.)

reddb.tistory.com/95?category=914227

$ cd /var/www/test/

$ sudo vi index.php

<?php phpinfo(); ?>
// php.index 파일에 vi로 넣어야 할 코드

다음은 /var/www/test/ 폴더의 권한을 www-data로 변경해야 합니다. (명령어 마지막에 . 입력해야함)

$ sudo chown -R www-data: .

마지막으로 아파치를 재기동해줍니다.

$ sudo systemctl restart apache2.service

이제 라즈베리파이에서 크로미움 브라우저를 열어 8080포트로 접속해 봅니다.

주소창: localhost:8080

기존에 홈페이지를 운영하고 계시다면 외부에서 라즈베리파에 설치된 홈페이지로 접근을 열어주는 방법을 알고 계실거라 생각합니다. (이 포스팅은 추가로 홈페이지를 만드는거니까요)

혹시나 모르시는 분을 위해 이전에 외부에서 라즈베리파이에 만들어진 홈페이지로 접속할 수 있게 하는 방법을 포스팅한 자료를 링크합니다. 참고하시기 바랍니다.

reddb.tistory.com/99?category=914227

라즈베리파이 전체보기

라즈베리파이4 비주얼스튜디오 코드(Visual Studio Code) 연동 개발환경 구축하기

먼저 비주얼시튜디오 코드가 이미 설치 되어있다는 전제하에 설명드리겠습니다.

설치가 안되신 분들은 아래 사이트에서 다운 받으시고 설치를 진행하시면됩니다.

(넥스트만 하면 설치가 완료됩니다)

code.visualstudio.com/

라즈베리파이 또한 SSH가 열려있다는 전제하에 설명드리겠습니다.

비주얼스튜디오 코드를 실행하시고 좌측 아이콘중 '확장' 아이콘을 클릭 후 'SSH'를 검색합니다. 

첫번째로 검색된 'Remote-SSH'를 선택하고 설치를 클릭합니다.

설치가 완료되면 좌측 하단에 녹색 버튼이 생깁니다. (원격 창 열기 버튼)

버튼을 누르면 중앙상단에 원격 접속을 위한 메뉴가 나옵니다. 여기서 'Remote-SSH: Connect to Host...'을 선택합니다.

다음은 '+ Add New SSH Host...'를 선택합니다.

다음은 '계정@주소'를 입력합니다. (저는 iptime의 ddns를 사용하여 접속하고 있습니다. 이전 포스팅 참조.)

다음은 위에서 입력했던 '계정@주소' SSH 구성파일을 저장할 폴더를 설정합니다. 저는 그냥 첫번째를 선택했습니다.

차후 해당 위치에 config파일을 여시면 주소를 수정, 추가, 삭제하기 편합니다.

이제 접속을 해봅니다.

좌측하단에 녹색버튼을 누르시고, 'Remote-SSH: Connect to Host...'을 선택합니다.

그리고 위에서 추가한 라즈베리파이 주소를 선택합니다.

이후 새로운 비주얼스튜디오 코드가 열리면서 운영체제를 묻습니다.

빠르게 linux를 선택하신 후, 비밀번호까지 입력하면 접속이 완료됩니다.

(일정시간동안 미입력시 자동으로 접속이 끊겨버립니다)

접속이 완료되면 좌측하단에 접속정보가 나타납니다.

메뉴에 있는 터미널의 새터미널을 클릭하면 라즈베리파이의 CLI 창이 뜹니다.

현재 위치를 찾는 pwd명령어와 현재폴더에 목록을 보는 ls를 입력해 보면 접속시 처음 위치가 pi계정의 home 폴더임을 알수 있습니다.

이제 메뉴의 파일 - 폴더열기로 /home/pi 폴더를 열어봅니다. (확인 클릭)

비밀번호를 한번 더 물어봅니다. 입력하시고 엔터를 누르면 됩니다.

/home/pi에 폴더와 파일 목록이 나옵니다. 파일을 선택하면 우측창에서 수정이 가능합니다.

라즈베리파이 전체보기

라즈베리파이4 node.js 최신버전 설치하기

먼저 현재 사용하고 있는 라즈베리파이의 node.js정보를 확인합니다.

(명령어: node -v)

기존 구버전 node.js를 지워 줍니다. 계속하겠냐고 물어보면 [Y/n]  Y를 입력합니다.

( 명령어: sudo apt-get remove nodejs)

이후 sudo apt-get autoremove 명령어를 입력해서 node.js를 완벽히 제거 해줍니다.

계속하겠냐고 물어보면 Y를 입력합니다.

다시 node.js의 버전을 확인해 보면 node명령어를 찾을 수 없다고 나옵니다. 정상적으로 삭제 됐습니다.

다음은 node.js 홈페이지에가서 최신버전이 몇 인지 확인합니다.

https://nodejs.org 

node.js 홈페이지에서 보면 현재 최신버전은 14.13.0입니다.

하지만 저의 라즈베리파이의 패키지 저장소에는 최신버전이 10.21입니다.

(명령어: apt list | grep nodejs)

다음은 명령어를 통해 node.js의 패키지 저장소를 최신으로 변경시켜줍니다. 명령어 내용중 주소 뒤에 숫자는 버전을 의미 합니다.

(명령어: sudo curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash - )

저장소가 최신으로 변경되면 다시한번 apt list를 해봅니다. 그러면 최신버전으로 검색되는 것을 확인 할 수 있습니다.

(명령어: apt list | grep nodejs)

이제 인스톨 명령어를 통해 node.js의 최신버전을 설치해줍니다.

(명령어: sudo apt-get install nodejs)

설치가 완료되면 node.js 버전을 확인해 봅니다.

라즈베리파이 전체보기

라즈베리파이4 WordPress 워드프레스 외부에서 접속 (워드프레스 6편)

앞선 포스팅에서 워드프레스 설치는 완료되었습니다.

이제는 외부에서 사람들이 내 홈페이지에 접속할 수 있게 하는 방법과 외부에서 내 홈페이지 관리자페이지에 접속해서 글을 작성할 수 있는 방법에 대해서 설명드리겠습니다.

한국 가정 or 소규모 회사의 일반적인 IPTIME 인터넷 공유기 구성으로 설명드리겠습니다.

1. 외부에서 인터넷 브라우저를 열고 주소창의 나의 IPTIME 공유기의 외부아이피 주소를 입력합니다.

2. 외부에서 브라우저로 내 IPTIME공유기로 들어오게되면 기본적으로 80포트로 들어오게 됩니다.

3. 외부에서 80포트로 들어온 연결을 IPTIME은 라즈베리파이IP 80포트로 연결시켜줍니다.

4. 라즈베리파이는 80포트로 받은 연결에 홈페이지를 띄워줍니다.

단순히 설명하자면 외부에서 공유기를 통해 라즈베리파이IP의 80포트로 접속하게 만들어주는 겁니다.

그러기 위해서 우리는 먼저 IPTIME 공유기의 외부 아이피를 알아야 합니다.

공유기의 설정페이지(기본 192.168.0.1)에서 확인이가능하고 더 쉬운 방법은 네이버에서 "내 아이피"로 검색해도 나옵니다.

다음은 IPTIME 외부 아이피 80포트로 들어온 연결을 라즈베리파이로 포트포워딩도 해줘야 합니다. IPTIME 설정페이지에 들어가서 고급설정 - NAT/라우터 관리 - 포트포워드 설정 페이지로 이동합니다.

빈칸 4곳을 아래와 같이 채워줍니다.

• 규칙이름 : http (원하시는 이름) 

• 내부IP주소 : 라즈베리파이에 할당된 아이피 192.168.xxx.xxx 입력

• 외부포트 : 80 

• 내부포트 : 80

적용을 클릭 합니다.

이제 외부에서 브라우저를 열고 내 IPTIME 공유기의 외부주소를 입력합니다. (위 네이버에서 검색한 주소)

외부 IP주소 뒤에 /wp-login.php를 붙이면 관리자페이지 로그인 화면으로도 접속이 가능합니다.

IPTIME의 경우 DDNS를 제공합니다. 설정을 하시면 숫자로된 IP가 아닌 DNS로 접속이 가능하고 공유기 재부팅등으로 IP가 변경되어도 DNS는 변경되지 않아 접속이 편리합니다. 사용방법은 이전에 포스팅했던 자료를 링크하겠습니다.

라즈베리파이4 공유기 DDNS 설정하고 DNS로 접속 하기

IPTIME에서 설정한 DNS 주소로 접속한 화면입니다.

라즈베리파이 전체보기

라즈베리파이4 WordPress 워드프레스 설정 (워드프레스 5편)

앞선 포스팅에서 라즈베리파이에서 워드프레스를 사용하기 위해 Apache, PHP, MariaDB(MySQL) 설치와 워드프레스 압축파일 다운로드 및 압축 해제 설치에 대해서 설명해드렸습니다.

이번 포스팅에서는 워드프레스를 설치하고 첫 접속시 setup-config.php 페이지로 연결되는데 해당페이지에서 설정하는 방법에 대해 설명드리겠습니다.

먼저 브라우저로 "http://라즈베리파이IP"로 접속해 봅니다.

이전 포스팅에서 말씀드렸던것 처럼 브라우저 주소창에서 자기자신을 가르키는 주소는 3가지가 있습니다.

1. http://localhost

2. http://127.0.0.1

3. http://라즈베리파이IP (저는 라즈베리파이의 IP가 192.168.137.4로 세팅되어 있습니다.)

이번 포스팅에서는 3번 방식으로 IP를 입력해서 접속하도록 하겠습니다.

언어목록 하단부근에서 "한국어"를 찾아 선택후 "계속"을 클릭합니다.

다음 안내페이지를 잘 읽어보시고 "설치 시작!"을 클릭합니다.

다음으로는 이전에 MariaDB(MySQL) 설치 포스팅에서 설명드렸던 데이터베이스 생성 정보를 넣어주게 됩니다.

저는 이전 포스팅에서 DB이름은 "wordpress"로 생성하였고 권한부여(grant)를 root에 '1234'비밀번호로 설정하였습니다.

호스트도 "localhost" 접속을 허가해주었습니다. 테이블 접두어는 기본값으로 "wp_"가 됩니다.

5군대를 다 채워주셨다면 전송을 클릭합니다.

위에 DB이름, 사용자명, 암호 등을 잘 넣었다면 아래 그림과 같은 페이지로 이동합니다. 설치 실행하기를 클릭합니다.

다음은 워드프레스 홈페이지의 제목과 관리자페이지에서 사용할 ID, PW를 설정하는 화면입니다.

저는 제목: 워드프레스 만들기 연습 / ID: wptest_newid / PW: wptest_newpw 로 설정하겠습니다.

그리고 워드프레스 설치하기를 클릭합니다.

이제 설치가 완료되었습니다. 로그인 버튼을 클릭하고 로그인 페이지 주소로 이동하여 로그인을 해줍니다.

워드프레스 관리자 로그인 페이지 입니다. (http://라즈베리파이IP/wp-login.php)

위에서 설정한 wptest_newid/wptest_newpw로 로그인 하겠습니다.

관리자페이지에서(IP/wp-login.php) 로그인을 하면 대시보드 화면으로 접속이 되며 좌측에 여러가지 메뉴가 있습니다.

관리자페이지에 대한 설명은 이번 포스팅에서 설명드리기 양이 너무 많아 패스하겠습니다.

한가지만 설명드리자면 사이트 건강상태에서 php 관련 설치 프로그램이 한가지가 더 있다고 나옵니다.

모듈이 누락되었다는 글의 화살표를 누르면 "필수모듈 gd"가 설치되어 있지 않다고 나옵니다.

라즈베리 콘솔창을 열고 php-gd 모듈을 설치해줍니다. 

($ sudo apt-get install php-gd -y)

설치가 완료되면 Apache 서비스를 재시작해줍니다. ($ sudo systemctl restart apache2.service )

워드프레스 관리자 페이지를 새로고침하여 상태를 보면 좋음으로 변경된 것을 확인 할 수 있습니다.

다음 설정 메뉴에서 워드프레스 주소와 사이트 주소를 변경해주어야 합니다.

다음 포스팅에서 말씀드릴 외부IP 또는 라즈베리파이DNS 주소를 적어주시면됩니다.

(IPTIME 공유기의 경우 DDNS를 지원합니다. 다음편 포스팅에서 확인하세요.)

관리자 페이지의 다른 부분은 직접 이것저것 만져보시며 수정해보시길 권해드립니다.

마지막으로 내 워드프레스 홈페이지가 어떤 모습인지 브라우저를 열어 "http://라즈베리파이IP" 를 넣어 봅니다.

다음 포스팅에서는 워드프레스 마지막편으로 외부에서 내 워드프레스 홈페이지 접속 및 관리자페이지 로그인 방법에 대해서 포스팅하겠습니다.

라즈베리파이 전체보기