이 사진 처럼 페이지를 이동할때마다 현재 나에게 도착한 쪽지의 개수를 출력 하는 방법을 알아 보겠습니다. 실시간 채팅, 실시간 알림 기능등에 사용되는 웹 소켓을 사용해서 구현 했습니다. 웹소켓이란 서버와 클라이언트 사이의 양 방향 통신을 지원하기 위한 프로토콜 이라고 생각 하면 됩니다. 기존의 http 프로토콜은 단방향 통신을 지원하기 위한 프로토콜 이었지만 좀더 사용자의 다양한 요구를 수용하기 위해 웹소켓이라는 것이 탄생하게 되었습니다. 웹 소켓의 연결을 설정할때는 http 프로토콜을 사용하기 때문에 기존의 http 포트번호(80)을 그대로 사용해서 웹소켓을 사용할수 있으며 http에 비해서 웹소켓은 헤더가 상대적으로 작기때문에 실시간 통신에 아주 적합합니다. 좀더 자세한 정보는 구글링 하시는게 빠릅니..
스프링으로 비밀번호 찾기 기능을 구현해 보겠습니다. 우선 해야할일이 3가지 있습니다.1.이메일이 형식에 맞춰서 잘 입력 됬는지 확인하는 일2.이메일이 실제 데이터베이스에 저장되어있는지3.실제로 저장되어있는 이메일이라면 그 이메일로 아이디와 비밀번호를 전송하는 일 1번부터 차근차근 알아 보도록 하겠습니다. 123456789101112131415161718192021222324252627282930313233 이메일 확인 가입하신 이메일로 아이디와 비밀번호를 전송해드리겠습니다. Colored by Color Scriptercs find_passView.jsp 에서 필요한 부분만 인용했습니다. 비밀번호 찾기 화면에서 적절한 값을 입력하고 확인 버튼을 누르게 되면 userDto라는 커맨드 객체의 필드의 bEma..
오늘은 이런식으로 데이터베이스에서 로그인 상태인 회원의 정보를 출력하는 방법에 대해서 알아보겠습니다. 우선 jsp파일 입니다.123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081 ${userinfo.bId}님의 프로필 정보 닉네임: ${userinfo.bNick} 학교: ${userinfo.bSchool} 학년: ${userinfo.bGrade} 전공: ${userinfo.bMajor} 이메일 주소: ${userinfo.bEmail} Colored by Color Scriptercs커맨..
로그인 세션 유지 및 비로그인 접근 제한2017년 8월 7일 월요일오후 8:55 Servlet-context.xml에 위 내용을 추가해준다. 사용자가 게시판에 글을 쓰려고 한다던지, 회원만 접근 가능한곳에 비 로그인 회원이 접근하려고하면 우리는 적절하게 로그인창으로 안내를 해야 할것이다. 그 역할을 해주는것이 바로 mvc태그의 interceptor이다. Dispatcher-servlet에서 컨트롤러로 요청이 가기전에 그 사이에 요청을 인터셉트해서 현재 로그인 세션이 존재 하는지 안하는지를 판단해서 세션이 존재하지않으면 로그인창으로 제어를 돌리고, 로그인 세션이 존재한다면 그대로 원래 요청경로를 컨트롤러로 전달해 주는 역할을 하게 된다. 실질적으로 세션이 있는지 없는지 판단하는것은 LoginCheckInt..
자바스크립트 파일에서 적절한 에러메세지를 보여주기 위해서는 위와 같이 label.properties라는 파일을 만들어 줘야한다. 만들고 나서 label.properties파일에 오른쪽버튼을 누르고 properties에 들어가 오른쪽 위 그림처럼 UTF-8로 설정해주어야지 한글이 적절하게 출력된다. 그다음은 이것을 사용하는 방법에 대해서 얘기하겠다. 우선은 스프링 설정파일에서 설정을 해주어야 한다. 그래야 스프링이 label.properties의 위치를 알 수 있고, 그에따라 적절하게 에러메세지를 출력할수 있게 된다. 아래 내용은 servlet-context.xml에 있는 내용이다. 메시지 프로퍼티 파일은 여러 개를 설정할수 있다. 또한 한글을 출력하기 위해 utf-8로 설정해야한다. classpath:/..
- Total
- Today
- Yesterday
- reactdom
- webpack
- Next.js
- mobx
- es6
- design system
- Polyfill
- type alias
- reducer
- reflow
- return type
- useRef
- javascript
- react
- state
- props
- Babel
- storybook
- async
- promise
- useEffect
- computed
- Action
- await
- hydrate
- react hooks
- server side rendering
- rendering scope
- typescript
- atomic design
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |