본문 바로가기

개발/출근log

[STOMP] STOMP 테스트를 위한 apic 및 연결 오류 해결 apic란?POSTMAN처럼 API를 빌드하고 테스트할 수 있는 프로그램.직접 설치해서 사용할 수도 있고, 크롬 확장 프로그램으로도 사용할 수 있다. APIC 링크 다운로드 페이지https://apic.app/ apic — The complete API solutionThe complete API solution APIC provides an end to end solution for APIs, staring from design to documentation to testing. With a simplistic UI for Designing APIs and a feature rich platform for testing them, APIC provides a common platform for your.. 더보기
[IntelliJ] 인텔리제이 svn 연동 및 프로젝트 열기 check Out 누르기해당 방법은  svn이 이미 설치되어있다는 전제하에 진행! 더보기
자바스크립트 _ serializeObject() 함수 jQuery 라이브러리에서 사용되는 사용자 정의 함수. jQuery를 사용하여 HTML form 요소의 데이터를 직렬화(serialize)하여 JavaScript 객체로 변환하는 데 사용된다. data: $("#loginForm").serializeObject(), ajax에서 데이터를 보낼때, HTML 폼 #loginForm의 데이터를 JavaScript 객체로 변환한 것. 여기서, 데이터 직렬화란? 데이터를 일련의 바이트로 변환하는 과정을 말합니다. 이렇게 변환된 데이터는 저장하거나 네트워크를 통해 전송할 수 있다. HTML 폼의 데이터를 직렬화하는 경우, 이는 폼에 입력된 데이터를 일련의 바이트로 변환하여 서버에 전송하기 쉽게 만드는 과정. 사용자가 입력한 데이터를 서버로 전송할 때 이 과정이 사용.. 더보기
Week3_02. API 사용(데이터 그리드에 담기) 1. api로 호출한 데이터를 그리드에 담는 과정에서 오류 api로 호출한 데이터를 넘겼으나 async function getCycleStaionData() { const url = `http://openapi.seoul.go.kr:8088/${APIKey}/json/tbCycleStationInfo/1/5/` const response = await fetch(url); const data = await response.json(); console.log("data", data); createGrid(data); } createGrid()함수에서 data를 확인해보면 [object object]로 나오면서 type오류가 발생한다. 원인) "[objet Object]"는 JavaScript에서 일반적으로.. 더보기
Week3_02. API 사용(토스트 그리드 사용.!) * reduce 함수 사용 : 2개의 데이터를 불러 온 뒤 일치하는 데이터를 찾아서 데이터 내용 합치고 불러오기 -> 아직 실제로 사용해 보지는 못함... 구현 계획 ) 목표 ) 따릉이 대여소 정보와 실시간 대여정보를 가져와서 원하는 대여소의 실시간 정보를 보여줌. 1. 마스터 데이터로 사용할 따릉이 대여소 정보를 로컬레지스토리에 저장. 2. 로컬레지스토리에 있는 데이터를 기반으로 1차 정보를 그리드에 보여줌. 3. "최신정보 업데이트"를 눌렀을때 api를 새로 받아서 정보 업데이트 되게끔 데이터 관리. 4. 검색하면 -> 로컬레지스토리 데이터를 기반으로 키워드 검색. 5. 특정 주소 클릭 -> 데이터를 비교해서 실시간 따릉이 정보 보여주기. 1) TOAST UI Grid란? 간단한 HTML과 CSS를 .. 더보기
Week3_01. API 사용하기(서울 따릉이) 따릉이 대여소 위치와 따릉이 실시간 대여정보를 가져와서 사용해보기! * 이번에 API를 사용해보고 느낀점! 사실 이전 공공데이터에서 날씨 정보를 받아오는 API를 사용하려고했으나, 인증키를 받은 후 어떻게 데이터를 불러오는지, 불러와서 어떻게 사용하는지 이해가 되지않아서 그저 따라하기만 바빴는데 이번에 API를 사용해봄으로써 API를 어떻게 불러오고 사용해야할지에 대한 이해가 높아졌다. 아직 데이터를 한번에 불러오기 위한 더 효율적인 코드와, 단순히 데이터를 뿌려주는게 아닌 좀 더 서비스적으로 예쁘게 꾸밀 수 있는 방법을 고안하여 퀄리티 높게 사용할 수 있도록 해야겠다. 그래서!! 조만간 카카오 지도를 사용해서 현위치와 함께 근처 가게를 조회할 수 있는 서비스를 만들어보려고한다. (공부해가면서 반려인들을.. 더보기
Week2. 인텔리제이 2x버전, 자바1.8JDK 다운그레이드, MYSQL 설치 MySQL 설치 참고 블로그 https://giveme-happyending.tistory.com/203 [MySQL] 0. MySQL 설치 방법과 설치 확인하기 MySQL 설치 방법은 혼공 사이트에서 참고한 내용입니다. 개인공부 및 기록용으로 블로그에 따로 작성하였습니다. 출처: https://hongong.hanbit.co.kr/mysql-%EB%8B%A4%EC%9A%B4%EB%A1%9C%EB%93%9C-%EB%B0%8F-%EC%84%A4%EC%B9%9 giveme-happyending.tistory.com 최신 버전으로 했지만 그대로 따라하면 쉽게 설치가능하다. 설치 후 인텔리제이에서 연결. 인텔리제이에서 파일을 생성 후 오른쪽 데이터베이스 클릭 "+" 표시 클릭 하면 이름과 port 번호 확인, .. 더보기
Day02. 스프링부트로 웹소켓 만들기 - 오류(닉네임 받아오기) 닉네임을 입력한 페이지에서 자바스크립트로 파라미터로 입력한 닉네임을 넘겨주고 그 닉네임을 받아주는 과정에서 오류가 발생했다. 아래코드는 닉네임을 보내주는 코드 function openChat() { var nicName = $("#nicName").val(); console.log(nicName); location.href = "/chat?nicName=" + nicName; } 문제코드) input hidden으로 값을 받아서 사용하려고했지만 아래 이미지와 같이 undefind로 받아오지 못함.. 채팅방 전송 1) 문제원인 문제 ): 쿼리스트링으로 보낸 데이터를 받아오지 못함 원인) 컨트롤러에서 해당 변수를 받아주는 코드가 없음. @GetMapping ("/chat") public String chat.. 더보기