PHP

PHP + MAMP사이트 만들기 기초- 01 회원가입, 로그인

grovy 2023. 4. 19. 23:52
728x90

PHP + MAMP사이트 만들기 기초 - 01 회원가입, 로그아웃

PHP란 ?

PHP는 서버 측에서 동작하는 오픈 소스 프로그래밍 언어로, 웹 개발에 많이 사용됩니다.

PHP는 동적 웹 페이지를 생성하고 데이터베이스와의 상호작용을 가능하게 합니다.

PHP는 매우 널리 사용되며, 대부분의 운영 체제와 웹 서버에서 지원됩니다.

MAMP란 ?

MAMP를 사용하면 컴퓨터에서 PHP 웹 애플리케이션을 개발하고 테스트할 수 있습니다. MAMP는 Apache, MySQL 및 PHP를 쉽게 설치하고 구성하며, PHP 애플리케이션을 로컬에서 실행하고 디버깅하는 데 도움이 됩니다.

MAMP는 개발자들이 로컬 컴퓨터에서 PHP 웹 애플리케이션을 개발하고 테스트하는 데 매우 유용합니다. MAMP를 설치하면 Apache 웹 서버와 MySQL 데이터베이스가 자동으로 설정되므로 개발자는 이들을 수동으로 설치하고 구성할 필요가 없습니다.

또한, MAMP는 PHP 버전 관리를 지원하므로 다양한 PHP 버전을 사용하여 웹 애플리케이션을 테스트할 수 있습니다. 개발자들은 MAMP를 사용하여 PHP 웹 애플리케이션을 로컬에서 빠르게 테스트하고 디버깅할 수 있습니다.

 

즉 PHP와 MAMP로 사이트를 만든다는것은 ? 

  1. PHP웹페이지를 만들어서 
  2. 웹서버에 올림
  3. 데이터베이스 ( MY-SQL)에 데이터를넣고
  4. 웹서버로 처리결과를 받아
  5. PHP로 받아옴

위 처럼 사이트를 만드는거에요 ! 

 

준비를 해볼까요  ?

https://www.mamp.info/en/windows/

 

MAMP & MAMP PRO - your local web development solution for PHP and WordPress development

MAMP GmbH is the manufacturer of the award-winning MAMP software.

www.mamp.info

1.사이트에 접속하여 MAMP를 받는다 

2. 설치후

우측에 초록불 2개가 들어오면 준비 완료 !
http://localhost/phpMyAdmin/ 에 접속하여 이용할 database& table을생성해 준다

더보기
create table members(
    memberID int(10) unsigned auto_increment,
    youEmail varchar(40) NOT NULL,
    youName varchar(10) NOT NULL,
    youPass varchar(20) NOT NULL,
    youBirth int(10) NOT NULL,
    youAge int(5) NOT NULL,
    regTime int(30) NOT NULL,
    PRIMARY KEY(memberID)
) charset=utf8;

 

3. 테이블을 생성하였으면 준비 끝 ! 

 

준비는 끝났구 PHP를 만들어봐요 ! 

 

1. PHP에서 MY-SQL 접속확인하기

$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를 적은뒤 mysqli() 를 이용하여 MYSQL과 접속여부를 확인해요

성공시 TRUE 실패시 FALSE

 

2. 기본 MAIN 화면 만들기 ! 

요 MAIN 화면을 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">
            <div class="intro__inner container 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>

HTML과 거의 동일한데 i

<?php include "../include/header.php" ?> 요렇게 php를 써서 인클루드 한것만 다르네요 

회원가입하러 가볼까요 ?

3. 회원가입하기

요렇게 디자인을 했어용

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 bmStyle center">
                <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">
                <h2>회원가입</h2>
                <div class="join__form">
                    <form action="joinEnd.php" name="#" 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="비밀번호 적어주세요" required >
                            </div>
                        </fieldset>
                        <button type="submit" class="btnStyle">회원가입 완료</button>
                    </form>
                </div>
            </div> 
            <!-- join__inner -->
    </main>
    <!-- main -->
</body>
</html>

회원가입부분은 html과 거의~~동일합니다. 

확실하게 다른부븐은 

 <form action="joinEnd.php" name="#" method="post"> 이부분이에요

post방식으로 joinEnd.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 bmStyle center">
                <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>
                <p class="intro__text">
                    <?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("이메일이 잘못됨 올바른 이메일 작성해주세요");
                            
                            exit;
                        }
                        //이름 유효성검사
                        $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]{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("에러발생1111");
                        }
                        $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("에러발생2222");
                            exit;
                        }
                        // 입력
                        
                        if($isEmailCheck ==true && $isPhoneCheck ==true){
                            $sql = "INSERT INTO members(youEmail, youName, youPass, youPhone, regTime) VALUES('$youEmail', '$youName', '$youPass', '$youPhone', '$regTime')";
                            $result = $connect -> query($sql);
                            if($result){
                                msg("회원가입을 축하합니다 ! 로그인 해주세요 ! <br><div class='intro__btn'><a href='../login/login.php'>로그인</a></div> ");
                                
                            }else{
                                msg("에러발생333333");
                                exit;
                            }
                        }else { 
                            msg("이미 회원가입 되어 있습니다. 로그인해주세요");
                            exit;
                        }
                 
                    ?> 
                </p>
            </div>
            <!-- intro__inner -->
    </main>
    <!-- main -->

</body>
</html>

위와같이 join.php에서 받아온값을 유효성검사를 해서 이상이 없을경우에 

db에 insert 작업을 해줍니다. ! 

4.로그인 하기

로그인 form 을 만들었어요 ! 

<!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>
                    </fieldset>
                    <button type="submit" class="btnStyle2 mt20">로그인 </button>
                </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>

회원가입과 마찬가지로 form을 loginSave로 보내어 

<form action="loginSave.php" name="loginSave" method="post">

<!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 bmStyle center">
                <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 $youPass, $youEmail;
                    
                    // 데이터 출력
                    function msg($alert){
                        echo "<p class='intro__text'>$alert</p>";
                    }
                    // 유효성검사
                    $sql = "SELECT memberId, youEmail, youPass, youName from members where youEmail = '$youEmail' and youPass = '$youPass'";
                    $result = $connect ->query($sql);

                    if($result){
                        $count  = $result -> num_rows;
                        if($count ==0){
                            msg("이메일 또는 비밀번호가 틀렸습니다. 다시 한번 확인해주세요! <br><br><div class='intro__btn'><a href='../login/login.php'>로그인</a></div>" );
                        }else{
                            //로그인 성공
                            $memberInfo = $result -> fetch_array(MYSQLI_ASSOC);

							// 세션 생성
                            $_SESSION['memberId'] = $memberInfo['memberId'];
                            $_SESSION['youEmail'] = $memberInfo['youEmail'];
                            $_SESSION['youName'] = $memberInfo['youName'];
                            header("Location: ../main/main.php");
                        }
                    }
                ?>
                
            </div>
            <!-- intro__inner -->
            
    </main>
    <!-- main -->

 
</body>
</html>

유효성 검사에 이상이 없을경우 db에서 받아온 값을 세션에 넣어 로그인 처리 해준뒤

header("Location: ../main/main.php"); 구문을 통해 main.php로 이동해요 ! 

세션에 넣은값으로 우측상단에 이름을 뿌려줘요 ! 

'PHP'의 다른글

  • 현재글PHP + MAMP사이트 만들기 기초- 01 회원가입, 로그인

관련글

댓글

티스토리툴바