채팅 앱을 만들었습니다.

소개



웹 앱 연습으로 채팅 앱을 만들어 보았습니다.

기본 기능


  • 로그인제 앱
  • 비밀번호가 해시되어 DB로 관리

  • 세션을 사용한 로그인 관리 기능
  • 계정 생성 기능
  • 메시지 게시 기능
  • 게시물 내용을 DB에 저장
  • XSS 대책 이스케이프 처리

  • 이미지 투고 기능
  • 이미지를 바이트 배열로 변환하고 저장하고 경량화

  • 입력 체크 기능
  • 로그인 시
  • 계정을 만들 때
  • 메시지 게시시

  • 메시지 삭제 및 편집 기능 (사용자 관점에서 DB에 저장된 개인 메시지를 개별적으로 삭제하고 편집 할 수 있음)
  • Bootstrap 프레임 워크를 사용한 앱 디자인
  • 스마트 폰에 대응하는 반응형 디자인

  • 개발 환경


  • 사용 언어
  • Java
  • javascript
  • html
  • css

  • 데이터베이스
  • MySQL

  • 기타
  • bootstrap


  • 화면



    로그인 화면


  • PC용

  • 스마트 폰용

  • 채팅 화면


  • PC용
  • 스마트폰용

  • 만든 소감


  • 보통의 채팅 앱에서도 막상 만들어 보면 귀찮은 것이 많다.
  • 개행을 판정하기위한 처리와 XSS 대책의 양립

  • 이미지를 게시할 때 byte 열로 변환하는 것이 좋다는 것을 배웠다. 표시할 때는 base64로 인코딩해 표시하는 방법을 선택했지만, 이 방법은 페이지를 표시할 때에 부하가 걸리기 때문에, 향후의 반성점으로 하고 싶다.
  • 디자인에는 자신이 없기 때문에, bootstrap 덕분에 상당히 맛이 되었다.

  • 마지막으로



    채팅 앱이라고 해도, 그 처리나 구조는 거의 거의 게시판이나, 다른 입력 폼을 수반하는 앱과 같거나 유사하기 때문에, 다른 앱에서도 유용이 효과가 있는 것을 알 수 있었다.

    좋은 웹페이지 즐겨찾기