tellusboutyourself
[웹프 Week 3] 동적 웹사이트 (PHP) 본문
2024.09.19.목
중앙대학교 웹프로그래밍_이재범 교수님
최신의 뉴스를 계속해서 업데이트 해 보여줘야 하듯이,
그 때 그 때의 데이터를 가져와서 웹페이지에 채워 넣어야 한다.
그게 바로, 동적웹페이지.
주차 목표 : compiler와 interpreter의 차이를 알자.
로마에 가면 로마의 법칙을 따르듯이,
프로그래밍 언어에 따라 그에 맞는 표준을 지킬 것.
CGI는 웹 서버가 외부 프로그램(주로 서버에서 실행되는 프로그램)과 상호작용할 수 있게 해주는 표준 프로토콜입니다.
CGI 작동 원리
- 웹 브라우저에서 서버로 HTTP 요청을 보내면, 서버는 CGI 프로그램과 상호작용하고, 프로그램은 데이터베이스에 질의를 보냅니다.
- 데이터베이스로부터 결과를 받은 CGI 프로그램은 이를 다시 서버로 전달하고, 서버는 웹 브라우저에 HTTP 응답을 반환합니다.
- 성능이 조금 느려도 compiler 대신 interpreter 방식을 사용하기 시작함. php도 interpreter 사용.
< : 태그처럼 보이기 위해
? : 사실은 태그가 아니라는 것을 알려주기 위해
php : 옛날에는 붙이지 않았지만 지금은 붙이는 게 표준이다. 이게 php 코드라는 것을 알려주기 위함.
http://localhost/phpinfo.php
위 링크로 들어가보면 아래와 같은 화면이 나오는 것을 확인할 수 있다.
(ampps를 깔아두고, 실행된 상태여야 함.)
<?php
echo phpinfo();
?>- 이 코드는 PHP의 내장 함수인 phpinfo()를 호출하여 현재 PHP 설정에 대한 정보를 출력하는 역할을 합니다. 이 함수는 PHP의 버전, 설치된 확장 모듈, 환경 변수 등 다양한 서버 관련 정보를 보여줍니다.
- echo는 뒤의 값을 알려준다. 즉 위의 코드에서는 phpinfo()라는 함수의 결과값을 도출해준다.
- 결론적으로 phpinfo() 이 함수의 값이 바로 저 웹페이지라는 것.
javascript의 interpreter는 웹서버에 있다.
함수 호출이다.
'Asia/Seoul'이라는 인자를 준 것.
echo : 바로 뒤의 함수 결과값을 도출하라는 의미.
규모가 큰 파일의 경우 여러개로 쪼갠다.
명령문 : cpu가 어떤 액션을 취하도록 하는 것. 단순히 명령을 하는 문장이라고 생각하면 안 됨.
선언문 : 그 자체로는 바뀌는게 없지만 명령문을 위한 부가적인 일을 해주는 것.
변수 선언, 객체 선언, 타입 선언, 함수 선언 등이 해당된다.
조건문 : if
반복문 : for, while
함수호출문 : name() 요런 형식
+ 복합문
수식 : 명칭과 연산자가 혼합되어있는 것
명칭 : 문자열. 알파벳, 특수기호가 섞여있음
연산자 : + - 등등
a + b
위는 명칭과 연산자의 조합이므로 수식에 해당한다.
수식은 복합문, 수식문, 조건문, 반복문에 모두 들어갈 수 있다.
이러한 명령문을 모아놓은게 프로그래밍이다.
프로그래밍을 한다는건,
문법에 맞춰서 문장을 만들어야 한다.
코드를 짜려는 의도가 sementic에 맞는지 확인해야 한다.
빨간색 글씨 : 언어에서 특별한 용도로 쓰고있는 단어. 용도에 맞게 써야 한다.
[객체선언문]
public 멤버변수
function 멤버함수
[함수호출문]
수식문에 해당한다.(명령문)
즉 위의 코드를 크게 4가지 구간으로 나누면,
3가지의 선언문과 1가지의 명령문으로 이루어져있다는 것을 알 수 있다.
[변수]
variable. 여기에는 number의 개념이 전혀 없음
숫자로 받아들이면 안 됨. just 명칭. 그리고 값.
주소를 가진다 = 컴퓨터 프로그램 아이콘을 누르면 디스크에 있는 프로그램을 가져와서 실행시키는 것. cpu가 접근하는 모든 것은 메모리에 있어야 한다. 디스크에 직접 접근할 수 없다. 어떤 데이터를 조작하려고 하면 그 데이터는 메모리에 있어야 한다.
즉, 변수란 메모리에 있는 공간을 의미. 이 공간은 주소를 가지고 있다.
주소에 가보면, 이진수가 들어있다.
이 값이 무엇인지 모름. 이걸 알려주는게, Type.
타입은 이걸 어떻게 해석해야할지에 대한 갈피를 제시해준다.
스코프
변수를 사용할 수 있는 바운더리.
변수를 코드의 어느 부분에서 사용할 수 있는지를 정해주는 것.
달러로 시작하면 변수라는 것 기억하기!
[실습해보기]
ampps 폴더에 파일 넣어두고 localhost/test.php 들어가보기
test.php에 위의 코드를 입력하고
링크에 들어가보면
위와 같은 페이지를 확인할 수 있다.
(echo는 웹페이지에 던져서 띄우는 것.)
위 코드 밑에 html 코드가 나오고, 그 안에 <?이 다시 시작된다면
다시 php 코드가 시작된다는 것을 의미한다.
변수를 던져주고 그걸 h1 등을 통해 디자인 적용하는 것.
이제 db 접근까지 하기 위해 다음 시간부터는 sql 쿼리문도 들어가게 될 것이다.
조건문, 반복문을 하나의 단위로 묶어주기 위한 것이 복합문.
반복문 내의 수식에서, 좌변의 변수는 '공간'이 되고, 우변의 변수는 '값'의 역할을 한다.
return까지는 그냥 선언문.
이걸 사용하기 위해서는 return 밑의 코드처럼 호출문이 필요하다.
Q. echo $v 의 값은?
A. 정답은 5. 함수의 값으로 v가 도출되지 않고, 함수의 과정에서만 값이 변경되는 것이므로 기존의 숫자인 5가 도출되는 것이다. 이것이 바로 call-by-value
왼쪽 회색 박스에서, mytest 함수 안에 있는 함수도 v1=5 이다.
복합문 밖에 있기 때문에 Global. 즉, 어디서든 사용될 수 있다.
오른쪽 회색박스에서는 v2 변수가 복합문 안에 있기 때문에
Local 변수이다. 그 복합문 안에서만 효력이 있다.
그래서 복합문 밖의 echo $v2 값은 공백이 된다.
* 객체선언 -> 클래스선언으로 수정
클래스 : 변수와 함수가 다 들어있다.
멤버변수 : name, color
멤버함수 : set_name(), get_name()
$this -> 자기자신을 의미한다. 실체화한 것. object에 있는 name
타입은 값을 해석하기 위한 것.
일반적인 언어에서는 변수를 선언할 때 반드시 타입을 명시해야 한다.
php는 명시하지 않아도 된다.
(언어가 값을 보고 직접 판단한다.)
[실습하기]
<html>
<head>
<meta charset="utf-8">
<title>My Page</title>
<style>
.time-display {
position: absolute;
top: 10px;
right: 10px;
font-size: 16px;
color: black;
}
/* 현재 시각 부분을 포함하여 스타일 적용 */
#time, #date, #label {
font-size: 24px;
font-weight: bold;
}
</style>
<script>
function updateTime() {
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds();
// 시간 형식을 HH:MM:SS로 맞추기
minutes = minutes < 10 ? '0' + minutes : minutes;
seconds = seconds < 10 ? '0' + seconds : seconds;
var currentTime = hours + ':' + minutes + ':' + seconds;
document.getElementById('time').textContent = currentTime;
}
// 1초마다 시간을 업데이트
setInterval(updateTime, 1000);
</script>
</head>
<body style="font-size:20px;">
<h1 style="color:green;">
Welcome to my page !
</h1>
<div class="time-display">
<span id="label">현재 시각:</span>
<span id="date">
<?php echo date('Y년 m월 d일'); ?>
</span>
<span id="time">
<?php echo date('H:i:s'); ?>
</span>
</div>
<div style="background-color:beige; display:flex; flex-direction:row;">
<p>Hi, my name is 새콤핑.</p>
<img src="https://i.namu.wiki/i/1eKqldjUw7lrwXziUM9SJa97K8kpW07rNEt2149lXVwZRwqdQkT2hhQOYnHoa1buNJ18Als1Z6EwBFQl0PW_6A.webp" style="width: 200px;">
<p>제가 좋아하는 음악은 <a href="https://www.youtube.com/watch?v=HKBPmZbrsm0" > 미워(Ego)-Crush</a>입니다.</p>
</div>
</body>
</html>
저번주차에서는 index.html 형식이었으나
이번에는 php를 사용할 것이기 때문에 index_w3.php 형식으로 지정해줘야 한다.
기존 코드에서, 현재 날짜 및 시각을 나타내는 php 코드를 추가하고
해당 파일을 ampps 폴더에 넣은 후 아래 링크로 들어가보았다.
http://localhost/index_w3.php
링크로 이동하면 아래와 같은 화면이 나온다.
오른쪽 상단에 현재 시각이 초단위로 업데이트 되어 띄워지는 것을 확인할 수 있다.
끝