[Springboot_ajax] 웹 알람 서비스 구현

1.  프로젝트 구조

• 웹 브라우저에서 음악 파일 재생하기 편을 봐주세요(링크 : https://cbjh-4.tistory.com/148)
• WebConfig : static 파일 path 지정
• controller : get, post, put, delete 방식으로 알람 생성, 수정, 제거, 페이지 열기, 알람 리스트 서버에 저장 기능 구현
• dto : AlarmTime을 웹 브라우저와 Springboot가 http 형식으로 주고 받는 객체 (멤버로 String 타입의 time 변수를 사용)
• service : 사용 안함(script 쪽에서 구현함)
• static/alarm.mp3 : 알람음
• templates/alarm.html : HTML + CSS + Script + Ajax로 화면 구현
  • HTML에서 Post 방식으로 Form에 담아서 컨트롤러에 AlarmTime을 리스트 방식으로 저장.
  • 알람을 추가하면 Ajax 방식으로 JSON 타입으로 보내 AlarmTime 리스트를 불러와 화면에 비동기로 추가.
  • 수정, 삭제 버튼을 누르면 Ajax 방식으로 비동기로 수정 및 삭제

 

2. 깃허브 링크

https://github.com/cbjh-4/TestAlarm

 

 

3.  구현된 화면

• UI에 신경을 쓰자니 시간이 오래 걸려서 간단하게 만들었다.
• 오전 오후 선택 버튼을 만들었지만, 스크립트로 처리해야될 부분이라 복잡해져서 그냥 선택 버튼만 놔두고 기능은 없다.
• 알람을 추가하면 수정 및 삭제 버튼이 비동기로 추가된다.
• 시간을 수정하거나 삭제 할 수 있다.
• 페이지를 열고, 테스트 사운드 재생을 한번 이상 실행해야 다음부터 알람음이 들린다.