DB가 연동된 사이트를 만들어보자
하기전에 지난번 포스트를 보고 미리 세팅해주자!
https://onejin-log.tistory.com/31
Fedora에서 mariaDB 설치하고 사용해보기
Fedora에서 mariaDB를 사용해보자 만약 설정을 다 마친후에는 localhost/phpmyadmin 에서 명령어 조작을 할 수 있게 된다. 페도라에서 mariaDB를 사용하기 위해서는 우선 PHP와 mariaDB 모두 설치가 되어있어야
onejin-log.tistory.com
우선 로그인 페이지를 만들어주자
http://localhost/Login.html
파일 위치를 이동하자
cd /var/www/html
vi는 에디터인데 i를 눌러서 작성할 수 있고, 저장하고 나갈때는 esc키를 누른후, :wq 입력후 엔터를 쳐주면 저장된다.
vi login.html
<html>
<head>
<link rel="stylesheet" href="example.css"/>
</head>
<body>
<form action="LoginBackEnd.php" method="post">
<div class="imgcontainer">
<img src="img_avatar2.png" alt="Avatar" class="avatar">
</div>
<div class="container">
<label for="uname"><b>Username</b></label>
<input type="text" placeholder="Enter Username" name="uname" required>
<label for="psw"><b>Password</b></label>
<input type="password" placeholder="Enter Password" name="psw" required>
<button type="submit">Login</button>
<label>
<input type="checkbox" checked="checked" name="remember"> Remember me
</label>
</div>
<div class="container" style="background-color:#f1f1f1">
<button type="button" class="cancelbtn">Cancel</button>
<span class="psw">Forgot <a href="#">password?</a></span>
</div>
</form>
</body>
</html>form 은 백엔드로 넘겨주는애
name="ex" 속성에 해당되는 이름(ex)으로 php에서 사용
ㄴ 로그인할때 아이디비번은 DB테이블에 만든 아이디비번이다.
vi example.css
/* Bordered form */
form {
border: 3px solid #f1f1f1;
}
/* Full-width inputs */
input[type=text], input[type=password] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
/* Set a style for all buttons */
button {
background-color: #04AA6D;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}
/* Add a hover effect for buttons */
button:hover {
opacity: 0.8;
}
/* Extra style for the cancel button (red) */
.cancelbtn {
width: auto;
padding: 10px 18px;
background-color: #f44336;
}
/* Center the avatar image inside this container */
.imgcontainer {
text-align: center;
margin: 24px 0 12px 0;
}
/* Avatar image */
img.avatar {
width: 40%;
border-radius: 50%;
}
/* Add padding to containers */
.container {
padding: 16px;
}
/* The "Forgot password" text */
span.psw {
float: right;
padding-top: 16px;
}
/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) {
span.psw {
display: block;
float: none;
}
.cancelbtn {
width: 100%;
}
}
index.php에서 로그인 버튼(submit)을 눌러서 로그인 시도시 아이디와 비번이 <Form> 태그를 통해
(POST 형식으로) 넘어와 DATABASE의 유저 정보와 대조해 존재하는 아이디와 비번일 시 (if문에서 성공)
리디렉션이 되어 board.php로 넘어가게 된다.
vi LoginBackEnd.php
<?php
include "dbconn.php";
$uname = $_POST['uname']; //index.php의 <form> 태그를 통해 넘어옴, name 속성을 참조함
$psw = $_POST['psw'];
//result SQL 쿼리 결과를 저장
$result = mysqli_query($conn, "select * from tbLogin where userId = '$uname' and password = '$psw'");
if($result -> num_rows > 0) //num_rows 반환된 행의 갯수 속성
//echo "Login OK";
header("Location: http://localhost/board.php"); //redirection
else
echo "Login Fail";
?>
vi board.php
<h1>Hello world</h1>
<table border=1>
<tr>
<th>ID</th>
<th>UserID</th>
<th>Title</th>
<th>Content</th>
<th>Writer</th>
<th>Create Date</th>
<th>Reply ID</th>
</tr>
<?php
include "dbconn.php";
$result = mysqli_query($conn, "select * from tbBlog");
$data = $result -> fetch_all(MYSQLI_ASSOC);
foreach($data as $row):
?>
<tr>
<td><?= $row['id'] ?></td>
<td><?= $row['tbUserID'] ?></td>
<td><?= $row['title'] ?></td>
<td><?= $row['content'] ?></td>
<td><?= $row['writer'] ?></td>
<td><?= $row['create_date'] ?></td>
<td><?= $row['replyID'] ?></td>
</tr>
<?php endforeach ?>
</table>
여기서 $result는 MySQL 쿼리 실행의 결과를 담고 있는 객체입니다. $result->fetch_all(MYSQLI_ASSOC)는 이 결과를 가져와서 PHP 배열로 저장하는 부분입니다.
•fetch_all(MYSQLI_ASSOC) 함수는 MySQL 결과 집합에서 모든 행을 연관 배열로 가져오는 역할을 합니다.
•MYSQLI_ASSOC는 연관 배열을 요청하는 옵션으로, 각 행의 데이터를 컬럼 이름을 키로 하는 연관 배열로 반환합니다.
결과로서 $data 변수에는 tbBlog 테이블에서 가져온 데이터가 포함된 배열이 저장됩니다. 이 배열에는 각 행의 데이터가 연관 배열 형태로 저장되어 있으므로, 각 행의 정보를 쉽게 접근할 수 있습니다. 이후의 코드에서 foreach 루프를 사용하여 이 배열을 반복하면서 테이블에 출력하는 작업을 수행합니다.
당연하겠지만 데이터베이스 tbBlog에 아무 값도 없다면 뜨는 것도 없겠쥬?
INSERT INTO tbBlog (tbUserID, title, content, writer, replyID)
VALUES ('사용자ID', '글 제목', '글 내용', '글쓴이', '리플라이ID');이 형식으로 값을 미리 넣어주자~
기타
sudo systemctl start httpd
sudo systemctl enable httpd
'Fedora + DB' 카테고리의 다른 글
| Fedora DB 게시글 보기 (0) | 2023.12.18 |
|---|---|
| Fedora DB에 글작성하기 (1) | 2023.11.07 |
| Fedora에서 mariaDB 설치하고 사용해보기 (0) | 2023.10.16 |
| 페도라 아파치 (0) | 2023.08.29 |