[생활코딩] 웹어플리케이션 만들기 9일차

이 글은 오픈튜토리얼스의 생활코딩의 '웹어플리케이션 만들기'를 듣고 개인적으로 정리한 내용입니다. 

굵은 글씨로 된 제목을 누르시면 해당 강좌로 이동할 수 있습니다.

MySQL 실습

 

  여기서 PHP는 웹서버와 DB인 MySQL 을 중계자 역할을 한다. 이런 역할을 하기위해서는 mysqli이라는 PHP에 내장 되어있는 api를 사용한다.

  MySQL monitor와 mysqli은 DB서버에 요청을 한다는 점에서 같은 역할을 하지만 전자는 프로그램, 후자는 api인 차이점을 갖고 있다.

 

 

  어떤 값에 이름을 주는 것이 '연관배열'이라 한다.

 

 

 

  mysqli_connect 함수를 이용하여 서버에 접속을 한다. MySQL monitor처럼 주소, 사용자 아이디(root), bitnami 설치했을 때 설정한 비밀번호(검은 색 네모박스로 가려져 있는 것) 순으로 element를 입력한다. $conn 변수를 통해서 접속된 서버를 제어할 수 있다.

 

  다음에 DB 선택으로 mysqli_select_db 함수를 이용하여 사용하려는 DB를 선택한다. 입력되는 element는 $conn과 DB 이름을 입력하면 된다.

 

  이후에는 mysqli_fetch_assoc 함수를 이용하여 조회한 내용($result)의 첫번째 행의 데이터를 담아서 반환시킨다. 그리고 그 형식이 연관배열 (assoc)라는 것을 함수의 이름을 통해 알 수 있다.

 

  <br /> 태그는 줄바꿈을 해준다.

 

  var_dump는 입력 값으로 들어온 어떤 데이터가 무엇인지를 알려주는 함수이다. $row를 입력하면 NULL이 나와 값이 없다는 의미이다.

 

 

  ' "\n" ' 은 줄바꿈을 의미한다. 사이트의 좌측 리스트를 PHP를 이용해서 나타내려면 위와 같이 <a href="http://localhost/php/index.php?id='.$row['id'].'">'.$row['title'].'</a>를 작성한다. 이 의미는 $row['id']와 $row['title']를 이용하여 MySQL로 저장된 id 값으로  부터 번호를 불러와 링크를 연결시켜주고, title을 불러와 오른쪽처럼 항목의 이름을 나타내게 끔 한다.

 

 

  이번에는 본문 내용도 MySQL에서 불러오는 것을 해본다. 하나의 행만 표현하면 되므로 반복문은 사용하지 않는다. 그래서 $row['title']과 $row['description']를 이용하여 소제목과 내용을 불러온다.

 

 

  레이아웃을 수정한 CSS는 위와 같다.

 

Form 제작

 

 

 

 

 

   글쓰기 양식을 만들어본다. 위의 <form> 태그의 의미는 submit 버튼을 누르면 지정된 action 속성으로 지정된 어플리케이션으로 보낸다는 의미이다. Action의 method를 GET으로 하고 GET 방식의 파일을 받기위해 $_GET으로 연관배열을 사용하면 내용이 길어질 때 오류가 발생한다. 그래서 이를 방지 하기 위해 method를 POST로 바꾸고, $_GET이 아닌 $_POST로 연관배열을 사용하면 문제없이 출력되는 것을 볼 수 있다.

 

 

 

 

  index.php파일을 duplicate를 하여 write.php를 만든다. 여기서 article 부분만 수정해서 만든다.

 

 

  글쓰기 내용 전송은 위와 같은 process.php를 작성하여 MySQL에 보내 진다. INSERT INTO를 이용해서 데이터가 저장될 DB 이름과 저장할 내용의 개체들을 적어 삽입할 수 있도록 한다. 실제로 저장할 내용은 VALUES의 괄호 안에 적어준다. 즉 title에 $_POST['title']의 값이 저장되는 식으로 MySQL에 저장이 된다. Process.php에서 다시 index로 돌아갈 수 있도록 header 함수를 이용해 리다이렉션을 설정한다.

 

 

 

  쓰기버튼을 눌러 작성자와 본문을 입력하면 웹페이지는 위와 같이 왼쪽에 항목이 생긴 것과 본문이 나온 것을 알 수 있으며

 

 

  MySQL 상에서는 위와 같이 데이터가 저장된 것을 볼 수 있다.

 

 

 

  쓰기 버튼까지 추가된 index.php이고

 

 

  이후의 CSS이다.