본문 바로가기
320x100
728x90

jquery3

javascript] 이벤트 작성 시 유의점. 자바스크립트에는 클릭했을 때, 이벤트, 마우스를 눌렀을 때, 마우스가 해당 영역을 떠났을 때 등, 다양한 이벤트 요소로 다이내믹한 웹을 구현하여 사용자와 상호작용을 한다. 사용자의 경험이 증가함에 따라, 매 이벤트마다 페이지를 새로고침 하지 않고, 한 페이지 내에서 사용자와 상호 작용하는 비동기식 이벤트 처리가 유행이 되어갔다. (서버도 문서 전체를 다시 응답을 줄 필요가 없어서 상대적으로 리소스가 절약) 때문에 SPA와 관련된 FE 프레임워크인 vue나 react 같은 플랫폼들이 인기가 많아진 것이다. 여하튼 본론으로 들어가면, 회사 업무를 진행하던 도중, Vanila JS로 동적으로 Element들이 추가/삭제가 되는 웹 페이지를 작성할 필요가 있었다. 이 과정을 진행하면서 클릭 이벤트를 걸어 놓으면.. 2021. 2. 18.
java,spring]회원가입시 메일 인증하기 - 2 [인증번호 일치여부 확인] @RequestMapping("/CheckMail") @ResponseBody public String SendMail(String mail, HttpSession session) { Random random = new Random(); String key = ""; SimpleMailMessage message = new SimpleMailMessage(); message.setTo(mail); // 스크립트에서 보낸 메일을 받을 사용자 이메일 주소 // 입력 키를 위한 코드 for (int i = 0; i < 3; i++) { int index = random.nextInt(25) + 65; // A~Z까지 랜덤 알파벳 생성 key += (char) index; } int numIndex = rand.. 2020. 10. 7.
로컬스토리지를 이용해서 웹사이트 다크모드 구현하기 오늘은 국비지원 교육과정 중 2차 프로젝트에 포함된 내용이며 실제 제가 구현한 내용을 바탕으로 로컬 스토리지와 세션 스토리지, 쿠키에 대해 알아보겠습니다. 일단 제가 다크모드를 구현하기 위해 했던 설계입니다. 위 그림의 이해가 어려울 수 있어, 추가 설명을 하자면 1. 클라이언트가 서버에게 최초 문서를 요청할 때는, 값이 null임. 이를 이용해 null이거나 false면 데이터 타입이 boolean인 flag의 값을 사용. 2. 사용자의 클릭 이벤트에 따라서 flag값이 true , false를 반환함. 이를 클릭 시마다 localStorage.setItem('flag', 'true') , localStorage.setItem('flag', 'false')를 flag라는 키워드에 Value를 저장 3... 2020. 7. 2.
300x250
320x100