[Database] 2. WEB page

yangjaehong·2022년 1월 25일
0

Database_project

목록 보기
2/2
post-thumbnail

앞에서 구축 했던 Database를 기반으로 웹을 구현하였다.

  • 구현한 코드는 github에서 확인 할 수 있다.
  • Front-end는 아직 익숙하지 않아 아름답게 꾸미지는 못하였다.



1. Login page

  • 관리자로 로그인하게 되면 관리자가 확인 할 수 있는 페이지로 이동한다.
  • User로 로그인하게 되면 User가 확인 할 수 있는 페이지로 이동한다.


2. Select page

1) Admin_select

  • Admin select page로 오게되면 공항, 항공기, 구간 정보가 나오게 된다.

2) Seat_reservation

  • User로 로그인하게 되면 예약 정보를 확인하는 페이지로 이동하게 된다.


3. Insert page

1) Insert_Airport

  • insert/Airport로 이동하면 다음과 같이 공항 정보를 입력 할 수 있다.

2) Insert_Airplane

  • insert/Airplane으로 이동하면 다음과 같이 항공기 정보를 입력 할 수 있다.

3) Insert_Leg_instance

  • insert/Leg_instance로 이동하면 다음과 같이 구간 정보를 입력 할 수 있다.

4) Insert_Seat_reservation

  • insert/Seat_reservation으로 이동하면 다음과 같이 좌석을 예약 할 수 있다.


4. Update page

1) Update_Airport

  • update/Airport로 이동하면 다음과 같이 공항 정보를 수정 할 수 있다.

2) Update_Airplane

  • update/Airplane로 이동하면 다음과 같이 Total_number_of_seats를 수정 할 수 있다.

3) Update_Leg_instance

  • update/Leg_instance로 이동하면 다음과 같이 Number_of_available_seat를 수정 할 수 있다.


4. Delete page

1) Delete_Airport

  • delete/Airport로 이동하면 다음과 같이 공항 정보를 삭제 할 수 있다.

2) Delete_Airplane

  • delete/Airplane으로 이동하면 다음과 같이 항공기 정보를 삭제 할 수 있다.

3) Delete_Leg_instance

  • delete/Leg_instance로 이동하면 다음과 같이 구간 정보를 삭제 할 수 있다.

4) Delete_seat_reservation

  • delete/Seat_reservation으로 이동하면 다음과 같이 예약을 취소 할 수 있다.



3학년 2학기 데이터베이스 설계 과목에서 진행했던 기말 프로젝트였다. node.js와 html, js 등등 웹 개발에 필요한 모든 것을 처음 배웠다. 그래서 기말 프로젝트를 하는데 어려움이 많았고 시간이 많이 필요했다. 학교에선 데이터베이스를 중심으로 강의와 실습을 진행했기에 웹 구현은 거의 혼자서 공부를 하여 만들게 되었다.

최종적으로 ERD를 설계하고 간단한 웹을 구현하는 것에 성공하였다. 하지만 처음 해보는 웹 개발이었기 때문에 js를 깊게 알지 못하여 부족한 부분이 많았고, 혼자 node.js와 express를 더 공부하여 조금 더 완성도 높은 웹을 만들어 볼 것이다. 시간이 나면 이번 프로젝트에서 했던 javascript 코드를 리뷰를 해보도록 하겠다.

이번 수업과 프로젝트를 통해 데이터베이스에 대한 개념은 완벽히 다질 수 있었던 것 같다. 방학 동안 얕게 배운 node.js를 차근차근 알아갈 예정이다.

profile
인하대학교 정보통신공학과 4학년 양재홍입니다.

0개의 댓글