PHP란?
PHP(PHP: Hypertext Preprocessor)는 C언어를 기반으로 만들어진 서버 측에서 실행되는 서버 사이드 스크립트 언어입니다. 동적 웹 페이지를 쉽고 빠르게 만들 수 있도록 해줍니다.PHP로 작성된 코드를 HTML 코드 안에 추가하면, 웹 서버는 해당 PHP 코드를 해석하여 동적 웹 페이지를 생성합니다.
PHP의 장점
주요 운영체제와 대부분의 웹 서버에서 지원합니다.
다른 프로그래밍 언어보다 직관적으로 코드를 작성할 수 있어서, 작성해야 하는 코드의 양이 적습니다.
텍스트 처리에 특화되어 있어 HTML 문서 처리에 적합합니다.
웹 페이지 만들기
웹 페이지를 만들기 전에 모든 페이지와 이어줄 php파일을 만듭니다.
저는 connect 파일을 만들고 안에 MySQL 데이터베이스에 연결하는 역할을 하는 connect.php를 만들어 주었습니다.
//connect.php
<?php
$host = "localhost";
$user = "root";
$pw = "root";
$db = "phpClass";
$connect = new mysqli($host, $user, $pw, $db);
$connect -> set_charset("utf-8");
if(mysqli_connect_errno()){
echo "Database Connect false";
} else {
// echo "Database Connect True";
};
?>
$host, $user, $pw, $db 변수에는 MySQL 데이터베이스에 접속하기 위한 정보인 호스트 이름, 사용자 이름, 비밀번호, 데이터베이스 이름이 저장되어 있습니다.
new mysqli() 함수를 사용하여 $connect 변수에 MySQL 데이터베이스와의 연결 객체를 생성합니다.
$host, $user, $pw, $db 변수를 이용하여 연결 정보를 전달합니다.
set_charset() 함수를 사용하여 데이터베이스의 문자를 utf-8 인코딩을 사용하도록 설정합니다.
마지막으로, mysqli_connect_errno() 함수를 사용하여 데이터베이스에 연결되었는지 여부를 확인하고, 연결되지 않은 경우에는 "Database Connect false" 메시지를 출력하여 연결여부를 확인하고. 확인이 되었으면 "Database Connect True" 메세지를 주석처리 해줍니다..
main 페이지 만들기
회원가입과 로그인을 해줄 블로그의 메인 페이지를 만들어 줍니다.
<?php
include "../connect/connect.php";
include "../connect/session.php";
echo "<pre>";
var_dump($_SESSION);
echo "</pre>";
?>
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PHP 블로그 만들기</title>
<?php include "../include/head.php" ?>
</head>
<body class="gray">
<?php include "../include/skip.php" ?>
<!-- //skip -->
<?php include "../include/header.php" ?>
<!-- header -->
<main id="main" class="container">
<div class="intro__inner bmStyle">
<picture class="intro__images">
<source srcset="../assets/img/intro01.png, ../assets/img/intro01@2x.png 2x, ../assets/img/intro01@3x.png 3x" />
<img src="../assets/img/intro01.png" alt="소개이미지">
</picture>
<p class="intro__text">
어떤 일이라도 노력하고 즐기면 그 결과는 빛을 바란다고 생각합니다.
신입의 열정과 도전정신을 깊숙히 새기며 배움에 있어 겸손함을
유지하며 세부적인 곳까지 파고드는 개발자가 되겠습니다.
</p>
</div>
</main>
<!-- //main -->
</body>
</html>
첫 부분의 include 구문들은 다른 PHP 파일을 현재 파일에 포함시키는 역할을 합니다.
connect/connect.php 파일은 데이터베이스에 연결하고, connect/session.php 파일은 세션을 사용합니다.
현재 세션에 저장된 정보를 $_SESSION 변수로 var_dump 함수를 사용하여 출력합니다.
다음은 일반적인 HTML 을 사용해 작성해줍니다.
include 구문을 사용하여 다른 PHP 파일들을 포함시켰기 때문에, 해당 파일들에 작성된 내용도 함께 적용되어 웹페이지가 완성됩니다.
회원가입 페이지 만들기
로그인을 하려면 먼저 가입을 해야하므로 회원가입 페이지부터 만들어보겠습니다.
join.php
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PHP 회원가입 페이지</title>
<?php include "../include/head.php" ?>
</head>
<body class="gray">
<?php include "../include/skip.php" ?>
<!-- //skip -->
<?php include "../include/header.php" ?>
<!-- //header -->
<main id="main" class="container">
<div class="intro__inner center bmStyle">
<picture class="intro__images">
<source srcset="../assets/img/join01.png, ../assets/img/join01@2x.png 2x, ../assets/img/join01@3x.png 3x" />
<img src="../assets/img/join01.png" alt="회원가입 이미지">
</picture>
<p class="intro__text">
회원가입을 해주시면 다양한 정보를 자유롭게 볼 수 있습니다.
</p>
</div>
<!-- //intro__inner -->
<div class="join__inner container">
<h2>회원가입</h2>
<div class="join__form">
<form action="joinSave.php" name="join" method="post">
<fieldset>
<legend class="blind">회원가입 영역</legend>
<div>
<label for="youEmail" class="required">이메일</label>
<input type="text" id="youEmail" name="youEmail" class="inputStyle" placeholder="이메일을 적어주세요!" required>
</div>
<div>
<label for="youName" class="required">이름</label>
<input type="text" id="youName" name="youName" class="inputStyle" placeholder="이름을 적어주세요!" required>
</div>
<div>
<label for="youPass" class="required">비밀번호</label>
<input type="password" id="youPass" name="youPass" class="inputStyle" placeholder="비밀번호 적어주세요!" required>
</div>
<div>
<label for="youPassC" class="required">비밀번호 확인</label>
<input type="password" id="youPassC" name="youPassC" class="inputStyle" placeholder="다시 한번 비밀번호 적어주세요!" required>
</div>
<div>
<label for="youPhone" class="required">연락처</label>
<input type="text" id="youPhone" name="youPhone" class="inputStyle" placeholder="연락처를 적어주세요!">
</div>
<div>
<button type="submit" class="btnStyle">회원가입 완료</button>
</div>
</fieldset>
</form>
</div>
</div>
</main>
<!-- //main -->
</body>
</html>
html을 이용해 코드를 작성해주었습니다.
join__inner 밑으로 각각의 회원 가입 시 입력해야할 사항들을 기입하는 영역을 만들고 작성을 하면 action을 통해 joinSave.php로 데이터를 받을 수 있도록 설정해주었습니다.
joinSave.php
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>회원가입 완료페이지</title>
<?php include "../include/head.php" ?>
</head>
<body class="gray">
<?php include "../include/skip.php" ?>
<!-- //skip -->
<?php include "../include/header.php" ?>
<!-- header -->
<main id="main" class="container">
<div class="intro__inner center bmStyle">
<picture class="intro__images">
<source srcset="../assets/img/joinEnd01.png, ../assets/img/joinEnd01@2x.png 2x, ../assets/img/joinEnd01@3x.png 3x" />
<img src="../assets/img/joinEnd01.png" alt="회원가입 이미지">
</picture>
<!-- 회원가입을 축하드립니다. 환영합니다.<br> 로그인을 해주세요 -->
<?php
include "../connect/connect.php";
$youEmail = $_POST['youEmail'];
$youName = $_POST['youName'];
$youPass = $_POST['youPass'];
$youPassC = $_POST['youPassC'];
$youPhone = $_POST['youPhone'];
$regTime = time();
// echo $youEmail, $youName, $youPass, $youPhone;
// $sql = "INSERT INTO members(youEmail, youName, youPass, youPhone, regTime) VALUES('$youEmail', '$youName', '$youPass', '$youPhone', '$regTime')";
// $connect -> query($sql);
// 메세지 출력
function msg($alert){
echo "<p class='intro__text'>$alert</p>";
}
//이메일 유효성 검사
$check_mail = preg_match("/^[a-z0-9_+.-]+@([a-z0-9-]+\.)+[a-z0-9]{2,4}$/", $youEmail);
if($check_mail == false){
msg("이메일이 잘못되었습니다. 다시 한번 확인해주세요!!");
}
//이름 유효성 검사
$check_name = preg_match("/^[가-힣]{9,15}$/", $youName);
if($check_name == false){
msg("이름은 한글만 가능합니다. 또는 3~5글자만 가능합니다.");
exit;
}
//비밀번호 유효성 검사
if($youPass !== $youPassC){
msg("비밀번호가 일치하지 않습니다. 다시 한번 확인해주세요!");
exit;
}
// $youPass = sha1($youPass);
//휴대폰 번호 유효성 검사
$check_number = preg_match("/^(010|011|016|017|018|019)-[0-9]{3,4}-[0-9]{4}$/", $youPhone);
if($check_number == false){
msg("번호가 정확하지 않습니다. 올바른 번호(000-0000-0000) 형식으로 작성해주세요!");
exit;
}
// 이메일 중복 검사
$isEmailCheck = false;
$sql = "SELECT youEmail FROM members WHERE youEmail = '$youEmail'";
$result = $connect -> query($sql);
if($result){
$count = $result -> num_rows;
if($count == 0){
$isEmailCheck = true;
} else {
msg("이미 회원가입이 되어 있습니다. 로그인 해주세요!");
exit;
}
} else {
msg("에러발생1: 관리자에게 문의하세요!");
exit;
}
//핸드폰 중복 검사
$isPhoneCheck = false;
$sql = "SELECT youPhone FROM members WHERE youPhone = '$youPhone'";
$result = $connect -> query($sql);
if($result){
$count = $result -> num_rows;
if($count == 0){
$isPhoneCheck = true;
} else {
msg("이미 회원가입이 되어 있습니다. 로그인 해주세요!");
exit;
}
} else {
msg("에러발생2: 관리자에게 문의하세요!");
exit;
}
//회원가입
if($isEmailCheck == true && $isPhoneCheck = true){
//데이터 입력하기
$sql = "INSERT INTO members(youEmail, youName, youPass, youPhone, regTime) VALUES('$youEmail', '$youName', '$youPass', '$youPhone', '$regTime')";
$connect -> query($sql);
if($result){
msg("회원가입을 축하합니다! 로그인 해주세요! <br><div class='intro__btn'><a href='../login/login.php'>로그인</a></div>");
exit;
} else {
msg("에러발생3: 관리자에게 문의하세요!");
exit;
}
} else {
msg("이미 회원가입이 되어 있습니다. 로그인 해주세요!");
exit;
}
?>
</div>
<!-- //intro__inner -->
</main>
<!-- //main -->
</body>
</html>
첫 부분은 HTML 태그로 구성된 head와 body 영역입니다.
head 영역에서는 meta 태그로 인코딩, 호환성 등의 정보를 명시하고 있으며, 회원가입 완료 페이지에서 사용할 CSS 파일과 스크립트 파일 등을 로드하고 있습니다.
body 영역에서는 회원가입 완료 페이지에서 표시할 내용들을 구성하고 있습니다.
다음으로는 PHP 코드가 등장합니다.
PHP 코드는 <?php와 ?> 태그로 감싸져 있습니다.
PHP 코드는 서버 측에서 실행되는 코드로, 클라이언트 측에서는 해석되지 않습니다.
따라서 브라우저에서 코드를 열람할 때는 PHP 코드가 서버에서 해석된 결과물만을 확인할 수 있습니다.
해당 코드에서는 회원가입 폼에서 전달받은 데이터를 이용하여 유효성 검사를 수행합니다.
이메일, 이름, 비밀번호, 핸드폰 번호 등에 대한 유효성 검사를 수행하고, 검사를 통과한 경우에만 회원가입 처리를 수행합니다.
또한, 이미 가입된 이메일 주소와 핸드폰 번호인지도 중복 검사를 수행하고 있습니다.
이메일과 핸드폰 번호가 이미 가입된 경우, 해당 내용을 사용자에게 알리고 로그인 페이지로 이동하도록 유도합니다.
코드의 마지막 부분에서는 유효성 검사를 모두 통과한 경우, 데이터베이스에 회원 정보를 등록합니다.
login.php
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PHP 회원가입 페이지</title>
<?php include "../include/head.php" ?>
</head>
<body class="gray">
<?php include "../include/skip.php" ?>
<!-- //skip -->
<?php include "../include/header.php" ?>
<!-- //header -->
<main id="main" class="container">
<div class="login__inner">
<h2>로그인</h2>
<p>로그인을 하시면 게시글 및 댓글 작성이 가능합니다.<br>회원가입을 하시면 로그인이 가능합니다.<br>admin@admin.com/1234</p>
<div class="login__form btStyle bmStyle">
<form action="loginSave.php" name="loginSave" method="post">
<fieldset>
<legend class="blind">로그인 영역</legend>
<div>
<label for="youEmail" class="blind required">이메일</label>
<input type="email" id="youEmail" name="youEmail" class="inputStyle" placeholder="이메일을 적어주세요!" required>
</div>
<div>
<label for="youPass" class="blind required">비밀번호</label>
<input type="password" id="youPass" name="youPass" class="inputStyle" placeholder="비밀번호 적어주세요!" required>
</div>
<button type="submit" class="btnStyle2 mt20">로그인</button>
</fieldset>
</form>
</div>
<div class="login__footer">
<ul class="listStyle">
<li>회원가입을 하지 않았다면 회원가입을 먼저 해주세요! <a href="join.html">회원가입</a></li>
<li>아이디가 기억이 나지 않는다면 <a href="#">아이디 찾기</a></li>
<li>비밀번호가 기억이 나지 않는다면 <a href="#">비밀번호 찾기</a></li>
</ul>
</div>
</div>
</main>
<!-- //main -->
</body>
</html>
HTML과 PHP를 사용하여 만들어진 로그인 페이지입니다.
HTML 태그: HTML 문서의 구조와 레이아웃을 정의하는 태그로, <html>, <head>, <body>, <meta>, <title> 등이 사용되었습니다.
PHP 코드: PHP를 사용하여 서버에서 동적인 웹 페이지를 생성할 수 있습니다.
include 문을 사용하여 다른 PHP 파일을 로드하고, form을 제출할 때 사용될 loginSave.php 파일을 지정합니다.
이 로그인 페이지는 사용자가 로그인하는 데 필요한 이메일과 비밀번호 입력 폼이 포함되어 있습니다.
로그인 버튼을 클릭하면 loginSave.php 파일이 실행되어 입력한 이메일과 비밀번호가 확인되고, 로그인이 성공하면 관련 페이지로 이동합니다.
페이지 하단에는 회원가입, 아이디 찾기, 비밀번호 찾기 링크도 넣어주었습니다.
loginSave.php
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PHP 블로그 만들기</title>
<?php include "../include/head.php" ?>
</head>
<body class="gray">
<?php include "../include/skip.php" ?>
<!-- //skip -->
<?php include "../include/header.php" ?>
<!-- //header -->
<main id="main" class="container">
<div class="intro__inner center bmStyle">
<picture class="intro__images">
<source srcset="../assets/img/joinEnd01.png, ../assets/img/joinEnd01@2x.png 2x, ../assets/img/joinEnd01@3x.png 3x" />
<img src="../assets/img/joinEnd01.png" alt="회원가입 이미지">
</picture>
<?php
include "../connect/connect.php";
include "../connect/session.php";
$youEmail = $_POST['youEmail'];
$youPass = $_POST['youPass'];
// echo $youEmail, $youPass;
//데이터 출력
function msg($alert){
echo "<p class = 'intro__text'>$alert</p>";
}
// 데이터 조회
$sql = "SELECT memberID, youEmail, youName, youPass FROM members WHERE youEmail = '$youEmail' AND youPass = '$youPass'";
$result = $connect -> query($sql);
if($result){
$count = $result -> num_rows;
if($count == 0){
msg("이메일 또는 비밀번호가 틀렸습니다. 다시 한번 확인해주세요!<br><div class='intro__btn'><a href='../login/login.php'>로그인</a></div>");
} else {
//로그인 성공
$memberInfo = $result -> fetch_array(MYSQLI_ASSOC);
// echo "<pre>";
// var_dump($memberInfo);
// echo "</pre>";
// 세션 생성
$_SESSION['memberID'] = $memberInfo['memberID'];
$_SESSION['youEmail'] = $memberInfo['youEmail'];
$_SESSION['youName'] = $memberInfo['youName'];
Header("Location: ../main/main.php");
}
}
?>
</div>
<!-- //intro__inner -->
</main>
<!-- //main -->
</body>
</html>
include로 "head.php"와 "skip.php", "header.php" 파일이 포함합니다.
"main" 태그로 감싸진 "intro__inner" 클래스 안에는 이미지와 함께 로그인 기능이 구현되어 있습니다..
PHP코드에서 "connect.php"와 "session.php" 파일을 포함하고, 이전 페이지에서 POST 방식으로 전달받은 이메일과 비밀번호를 변수에 저장합니다.
데이터 출력을 위한 함수 "msg"는 로그인 실패 시 오류 메시지를 출력하는 데 사용됩니다.
그리고 데이터 조회를 위한 SQL 쿼리문을 작성하고, 해당 쿼리문을 실행하여 결과를 변수에 저장합니다.
그 다음으로는 결과를 확인하여 로그인에 성공하면 세션을 생성하고, 세션 변수에 회원 정보를 저장합니다.
마지막으로 로그인에 성공하면 "main.php" 페이지로 이동합니다.
logout.php
<?php
include "../connect/session.php";
unset($_SESSION['memberID']);
unset($_SESSION['youEmail']);
unset($_SESSION['youName']);
Header("Location: ../main/main.php")
?>
먼저 session.php 파일을 include 하여 세션을 시작합니다.
그리고 unset() 함수를 사용하여 현재 세션에서 memberID, youEmail, youName 세션 변수를 삭제합니다.
Header() 함수를 이용하여 로그아웃 후에메인 페이지로 리다이렉트 합니다.