지난 포스팅에서 ChatGPT가 짜준 PHP 코딩 이야기를 했습니다. 그런데 내가 딱 원하는 대로 안되었죠.
ChatGPT가 짜준 PHP 코딩 예 1
chatGPT가 프로그램도 짜준다고 해서 한번 해봤습니다. 결론적으로 챗봇이 만든 결과물에 놀랐습니다. 하지만 챗봇에게 프로그램을 짜라고 명령을 할때 그들이 하는 대화체 변경해서 요청하면 더
late40s.tistory.com
문제점 발견
코딩 예 1에서 발견된 문제는, 문제라기보다는 내가 생각했던 것과 다른 부분으로 수정이 필요한 사항은...
배너 노출기간이 지난 것들은 배너가 안보이게 되는데 가로 4개 이미지 개수가 줄어들면 이미지 크기도 점점 커지는 현상이 있어 챗봇에게 이 부분을 수정해 달라고 했습니다.
나의 수정사항 명령어
챗봇과 대화가 잘 통해야 하는데 한 10번의 대화 끝에 내가 원하는 결과물을 얻긴 했습니다.
마지막으로 내 말이 먹힌 명령어는 다음과 같습니다.
[명령어 1]
이미지 개수가 줄어들어도 박스 수를 그대로 유지하도록 수정해 주세요.
[명령어 2]
다음 코드를 pc화면에서는 이미지가 가로로 4개, 모바일 화면에서는 이미지가 가로로 1개 배열되게 수정해 주세요.
=> 이미지를 가로로 4개 배열하는 대신, 모바일 화면에서는 가로로 1개 배열하도록 수정하려면 CSS 미디어 쿼리를 사용하여 스타일을 수정해야 합니다.
최종 결과물 코드
<!DOCTYPE html>
<html>
<head>
<title>Responsive Table</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
table {
border-collapse: collapse;
width: 100%;
max-width: 1200px;
margin: 0 auto;
text-align: center;
table-layout: fixed;
}
th, td {
border: 1px solid black;
padding: 10px;
text-align: center;
width: 100%; /* 변경 */
vertical-align: top;
word-wrap: break-word;
overflow-wrap: break-word;
}
img {
max-width: 100%;
height: auto;
display: block;
margin: 0 auto;
}
/* 모바일 화면에서는 이미지를 가로로 1개 배열 */
@media (max-width: 767px) {
td {
display: block;
width: 100%;
}
}
</style>
</head>
<body>
<table>
<tr>
<?php
// Define links with expiration dates
$links = array(
array("https://weddingnews.co.kr/wp-content/uploads/2023/03/jwedding.jpg", "Description 1", "http://link1.com", strtotime("2021-03-20 00:00:00")),
array("https://weddingnews.co.kr/wp-content/uploads/2023/03/howto.jpg", "Description 2", "http://link2.com", strtotime("2024-04-15 00:00:00")),
array("https://weddingnews.co.kr/wp-content/uploads/2023/03/dongtan_wedding.jpg", "Description 3", "http://link3.com", strtotime("2020-06-01 00:00:00")),
array("https://weddingnews.co.kr/wp-content/uploads/2023/03/suwon_wedding2.jpg", "Description 4", "http://link4.com", strtotime("2023-09-30 00:00:00"))
);
$num_links = count($links);
$num_cols = 4;
$num_rows = ceil($num_links / $num_cols);
$num_empty_cells = $num_cols - ($num_links % $num_cols);
if ($num_empty_cells != $num_cols) {
for ($i = 0; $i < $num_empty_cells; $i++) {
array_push($links, array("", "", "", 0));
}
$num_links += $num_empty_cells;
$num_rows += 1;
}
for ($i = 0; $i < $num_rows; $i++) {
echo "<tr>";
for ($j = 0; $j < $num_cols; $j++) {
$idx = $i * $num_cols + $j;
$link = $links[$idx];
// Check if link is valid
if (time() < $link[3]) {
echo "<td>";
if ($link[0] != "") {
echo "<img src='" . $link[0] . "' alt='" . $link[1] . "'><br>";
}
echo "<p>" . $link[1] . "</p>";
if ($link[2] != "") {
echo "<a href='" . $link[2] . "' target='_blank'>Link</a>";
}
echo "</td>";
} else {
echo "<td></td>";
}
}
echo "</tr>";
}
?>
</tr>
</table>
</body>
</html>
결과 미리 보기
1번과 3번 링크 유효기간을 만료시킨 모습입니다.
https://url.kr/page/web/sample/chatgpt_code_02.php
Responsive Table
url.kr
마무리
머릿속에서 상상하던 것을 만들지 못해 안타까움이 많았는데 이제 ChatGPT에게 시간이 걸리고 말이 통하게 하면 내가 원하는 결과물을 얻을 수 있다는 것에 놀랍네요. 여러분도 한번 도전해 보세요.
그런데 중간중간 네트워크 오류? 아니면 멈춰 버리네요. 월 $20 유료버전으로 넘어가야 하나? 심히 고민되네요.
이글의 단축URL https://late40s.tistory.com/326
'살아가는 이야기 > 배움' 카테고리의 다른 글
| ChatGPT가 짜준 PHP 코딩 예 3 (0) | 2023.03.18 |
|---|---|
| ChatGPT가 짜준 PHP 코딩 예 1 (0) | 2023.03.17 |
| [오늘의 영어] 비즈니스 새해 인사 영어로 - 코로나 상황 (0) | 2022.01.01 |
◀ 댓글 ▶