php - Mini Project 2 - (1)

[ Mini Project ]

이번에 진행해 볼 project는 "To Do List 구현하기"이다.

 

Js나 react native 등 프로그래밍 언어를 배웠을 때 흔하게 만들어보는 게 바로 To Do List인데

오늘은 php 버전의 To Do List를 만들어보도록 하자!

 

전체적인 기능을 먼저 정리하면 

(1) 할 일을 추가 & 삭제할 수 있다.

(2) 이미 완료된 목록이라면 체크박스를 통해 표시할 수 있다.

(3) 등록된 할 일 목록은 index.php에서 한눈에 볼 수 있다!

 

---

 

[ 결과 화면 ]

To Do List의 결과를 먼저 보면 위의 사진처럼

목록을 입력할 form과 입력된 목록을 출력하는 부분으로 구성되는 걸 알 수 있다.

 

 

할 일을 입력하고 ADD 버튼을 누르면 

 

 

Ther is No To Do List 문구가 사라지고 방금 입력한 내용이 추가된 걸 볼 수 있다.

추가되는 list는 목록 내용, 작성 날짜, 체크박스, 삭제 버튼으로 구성된다.

 

 

해당 목록을 삭제하고 싶다면 DELETE 버튼을 누르면 된다!

 

 

list를 추가한 후에 끝난 목록은 check box를 눌러서 

 

 

완료되었음을 표시할 수 있다.

한 번 클릭하면 위의 사진처럼 바뀌고 체크되어있는 박스를 다시 한번 클릭하면 

 

 

원래 상태로 되돌아온다. 

 

---

 

To Do List가 구현된 결과를 살펴보았다.

Project 1과는 달리 사용할 페이지는 딱 하나, index.php이다.

 

따라서 index.php에서만 html tag가 사용되고

어떤 동작을 요구하냐에 따라 add.php, remove.php, check.php를 실행시킬 것이다.

 

그럼 다음 포스트에서 index.php 코드를 살펴보도록 하자!

 

[ Next ]

(1) index.php