본문 바로가기

전체 글

자바스크립트 _ 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에서 일반적으로.. 더보기
[정보처리기사필기 정리] 1과목 - 소프트웨어 설계 02 요구사항 검토DFDUML 미들웨어객채지향 분석 방법론(럼바우)현행 시스템 분석유스케이스 다이어그램소프트웨어 공학의 3R코드의 종류D.D (데이터 자료 사전)  6.  요구사항 검토 방법동료 검토 (Peer Review) : 요구사항 명세서 작성자가 명세서 내용을 직접 설명 -> 동료들이 결함 발견워크 스루 (Walk Through) : 검토 회의 전에 요구명세서 미리 배포 -> 사전검토 후 짧은 회의로 결함 발견인스펙션 (Inspevtion) : 요구사항 명세서 작성자를 제외한 검토 전문가들이 요구사항 명세서 확인 -> 결함발견관련 기출 문제)01. 검토회의 전에 요구사항 명세서를 미리 배포하여 사전 검토한 후 짧은 검토회의를 통해 오류를 조기에 검출하는데 목적을 두는 요구 사항 검토 방법은?(1) 빌그.. 더보기
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를 어떻게 불러오고 사용해야할지에 대한 이해가 높아졌다. 아직 데이터를 한번에 불러오기 위한 더 효율적인 코드와, 단순히 데이터를 뿌려주는게 아닌 좀 더 서비스적으로 예쁘게 꾸밀 수 있는 방법을 고안하여 퀄리티 높게 사용할 수 있도록 해야겠다. 그래서!! 조만간 카카오 지도를 사용해서 현위치와 함께 근처 가게를 조회할 수 있는 서비스를 만들어보려고한다. (공부해가면서 반려인들을.. 더보기
[정보처리기사 필기 - 정렬] 버블정렬, 선택정렬, 삽입정렬 1. 버블 정렬  (Bubble Sort)방법)앞에서 부터 순서대로 진행숫자가 이미 정렬이 되어있다면 변경 X , 왼쪽의 숫자가 더 크면 자리 변경* 서로 인접한 두 개를 비교해간다는 것이 특징. 2.  선택 정렬 (Select  Sort)방법)전체 숫자를 보고 가장 작은 숫자를 골라서 맨 앞자리 배치.그 다음으로 작은 숫자를 찾아서 두번째자리 배치위 과정을 반복하면서 정렬.의문) 맨 앞자리가 제일 작은 숫자일 경우는?2 8 4 7 6 같은 경우에는 변경되는 순서첫 번째 회차:주어진 배열: 2 8 4 7 6최솟값은 2입니다. 따라서 2를 첫 번째 위치로 이동합니다.정렬된 배열: 2 8 4 7 6두 번째 회차:주어진 배열: 8 4 7 6최솟값은 4입니다.. 더보기
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.. 더보기