본문 바로가기

전체 글

DAY2. 스프링부트로 웹소켓 구현 - 오류수정 1. Whitelabel Error Page 오류 controller에서 페이지를 찾지 못함 @Controller @Log public class ChatController { @GetMapping("/chat") public String chatGet(){ log.info("@ChatController,chatGet()"); return "chat.html"; } } bulid.gradle 에 타임리프 문법을 추가하지 않아서 파일을 읽어오지 못함. dependencies { implementation 'org.springframework.boot:spring-boot-starter-web' implementation 'org.springframework.boot:spring-boot-starter-we.. 더보기
[정보처리기사필기 정리] 1과목 - 소프트웨어 설계 01 자주 등장하는 개념 정리 및 기출문제 풀이 정리 목차1) 애자일 기법2) 소프트웨어 개발 절차3) UI 설계 원칙4) 객체지향 4가지 특성 (캡슐화, 상속, 다형성, 추상화)5) 설계방식0.  소프트웨어 설계계획 -> 분석 -> 설계 -> 구현 -> 테스트 -> 유지보수1.  애자일 기법애자일 기법은 소프트웨어 생명주기 모형 중 하나이다.여기서,소프트웨어 생명주기 모형폭포수 모형 : 고전적, 전통적 모델 , 순차적개발이 특징, 이전 단계로 돌아갈 수 없음.프로토타입 모형 : 견본/ 시제품을 통해 최종 결과 예측, 인터페이스 중심, 요구사항 변경 용이나선형 모형 : 위험 분석 및 위험 최소화가 목적 [계획 > 위험분석 > 개발 및 검증 > 고객 평가 과정]애자일 모형1) 애자일(Agile) 모형고객의 요구.. 더보기
DAY2. 스프링부트로 웹소켓 구현 - 02 웹소켓(WebSocket)이란? 웹소켓을 구현하기전 웹소켓이 어떤것인지 알아보려한다. 웹소켓(WebSocket)이란? WebSocket은 클라이언트와 서버(브라우저와 서버)를 연결하고 실시간으로 통신이 가능하도록 하는 첨단 기술. '두 프로그램 간의 메세지 교환을 위한 통신 방법 중 하나' 라고 할 수 있다. HTTP와는 다른 통신 프로토콜로 웹 서버와 웹 브라우저가 서로 실시간 메세지를 교환하는데에 사용된다. 웹소켓의 탄생 기존에 존재하던 HTTP 방식은 요청(request)이 오면 응답( response)하는 단방향 방식이었고, 그보다 업그레이드 된 버전인 Ajax 또한 HTTP를 이용하기 때문에 요청을 보내야 응답하는 방식이었다. 그렇기 때문에 연결에 지속성도 없다. 또한 변경된 데이터를 가져오기 위해 계속해서 요청을 반복적으로 .. 더보기
자바스크립트 INPUT 사용 후 비우기 채팅을 구현하면서 메세지와 닉네임을 입력 후 전송하면 입력했던 내용이 초기화 되도록 자바스크립트를 수정했다. function send(){ let msg = document.getElementById("msg"); let userID = document.getElementById("userID"); console.log(userID.value + ":" + msg.value); let chat = document.getElementById("chatArea"); chat.innerHTML += `${userID.value}: ${msg.value}`; userID.value = null; msg.value = null; } 생각보다 간단했던 방법... INPUT 값에 NULL 만 넣으면 완성 더보기
제이쿼리 not defined 오류 웹소켓을 사용한 채팅 구현 중 제이쿼리 오류발생... 코드를 확인해보니 로드될때 함수호출이 정의되지 않았다고 한다.. 1) 문제의 원인 1. jQuery 라이브러리가 로드되지 않았을 때 2. jQuery 충돌 두가지의 원인이 있을 수 있는데, 아마도 나는 자바스크립트 구문에 제이쿼리를 로드하지 않아서 생기는 오류로 판단된다... 2) 해결 코드 수정된 아래의 코드 너무나도 기본적인 실수....인것같다....이리저리 짜집기하면서 코드를 짜다보니 생기는 실수인듯하다 채팅방 전송 더보기
제이쿼리를 이용해서 Click하면 함수 호출 // 버튼 클릭 시 send 함수 호출 $("#button-send").on("click", function () { send(); ID를 "button-send"를 가진 요소 클릭 시 send()함수 호출되게 만들기 더보기
DAY2. 스프링 부트로 웹소켓 구현하기 - 프로젝트 생성 인텔리제이를 사용하여 스프링부트로 웹소케 구현하기! 프로젝트 생성 시작부터 문제 발현...인텔리제이에서 바로 스프링부트 프로젝트를 만들려고 했으나..자바 버전이 맞지않아서 실패.. 해결방안은 2가지 1. 인텔리제이 설정에서 전부 버전을 바꾼다 2. 스프링부트 프로젝트를 버전에 맞춰 만들어서 인텔리제이로 파일 열기 1번 방법을 시도해서 자바 11로 맞춰서 변경해보았으나....여전히 실패였다... 1번방법은 검색하면 더 친절하신분들이 많으니..패쓰하고 2번 방법으로 시도하여 프로젝트를 만들었다. 2. Spring initializr 사이트를 이용하여 생성하기 1) start.spring.io 사이트로 이동 2) 인텔리제이가 21, 17이 있었기때문에 17버전으로 맞춰서 프로젝트를 생성해주었다. 우측의 'AD.. 더보기