JIN_CODER

네이버 지도 API 사용하기 네이버에서 제공하는 네이버 지도 오픈 API 플랫폼에서 로그인 후 어플리케이션에서 map으로 들어가거나 아래 링크 로 들어가기 // 네이버 클라우드 플랫폼 https://www.ncloud.com/ // 네이버 지도 API링크 https://www.ncloud.com/product/applicationService/maps 이용 시작하기 => 어플리케이션 등록 설정 입력하기 - 어플리케이션 이름 - Maps : Web Dynamic Map와 Geocoding 체크 - Web 서비스 URL : http://localhost:5000 입력 후 '+ 추가' 버튼 클릭(추가한 사이트에서만 API사용 가능) - 입력 완료 후 '등록' 클릭 코드 작업전 설정 완료! ※ 네이버 지도 관련..

RESTful API 자원(Resource)을 URI로 표현하고, 자원에 대한 행위를 HTTP Method(GET, POST, PUT, DELETE)로 표현한다. 나만의 방식대로 이해해서 정리한거는 자원과 메소드로 무슨 api인지 알수 있게 이쁘고 잘 만든 api가 restful 하다라고 생각이 드는데 맞는건가? 보통 CRUD에서 조회는 GET, 등록은 POST, 수정은 PUT, PATCH, 삭제는 DELETE를 이용 GET과 DELETE는 행위가 명확 하지만 수정의 PUT과 PATCH에 대해 알아볼까 한다. PUT 요청 페이로드를 사용해 새로운 리소스를 생성하거나, 대상 리소스를 나타내는 데이터를 대체한다. PATCH 리소스의 부분적인 수정을 할 때에 사용한다. 결론부터 보면 PUT은 자원의 모든 상태..

반복문의 한 종류인 for in과 for of의 차이를 알아보겠다. 결론부터 말하면 for in은 객체의 반복에서 사용 for of는 배열의 반복에서 사용 for in 객체를 순환 할 때 사용 let obj = { a: 1, b: 2, c: 3 }; for (let item in obj) { console.log(item) // a, b, c } 객체 안에서 순환 할때 사용하지만 객체의 키 값을 순환 함 객체가 아닌 배열에서 사용한다면? let arr = [1, 2, 3]; for (let item in arr) { console.log(item) // 0, 1, 2 } 배열도 객체의 일부분이기 때문에 순환을 하지만, value 값을 나타내는게 아닌 index 값을 나타낸다. for of 배열를 순환 할..

slice() 함수 slice()는 배열로 부터 특정 범위를 복사한 값을들 감고 있는 새로운 배열을 만드는데 사용 첫번째 인자로 시작 인덱스 두번째 인자로 종료 인데스(종료인덱스 전까지 잘라냄) nums = Array(20).fill().map((_, i) => i) < [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19] nums.slice(5, 10) // [5, 6, 7, 8, 9] nums.slice(10) // [10, 11, 12, 13, 14, 15, 16, 17, 18, 19] nums // [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19] ..

slice(s,e) s는 시작인덱스, e는 끝 인덱스(e는 포함 안댐 e-1까지 자름) 첫번째 인자로 넘어온 시작 인덱스가 가리키는 값은 포함 두번째 인자로 넘어온 종료 인덱스가 가리키는 값은 포함하지 않는다. 두번째 인자를 넘기지 않으면, 시작 인덱스가 가리키는 값부터 배열의 마지막 값까지 모두 복사 let a = [0,1,2,3,4,5,6,7,8,9] console.log(a.slice(0, 5)) // [0,1,2,3,4] console.log(a.slice(7)) // [7,8,9] 자바스크립트 배열의 slice()와 splice() 함수 Engineering Blog by Dale Seo www.daleseo.com 정규식 replace() 사용시 원하는 값을 찾아서 바꿔주지만, 문자열이나 배열..

API와 JWT API(Application Programing Interface) 사전적 의미 - API : 응용 프로그램에서 사용할 수 있도록, 운영 체제나 프로그래밍 언어가 제공하는 기능을 제어할 수 있게 만든 인터페이스를 뜻한다. - 인터페이스 : 컴퓨터 시스템끼리 정보를 교한하는 공유 경계를 의미, 어떤 기계간의 장치끼리 정보를 교환하기 위한 수단이나, 방법을 의미 풀어서 보면 API는 어떠한 응용프로그램에서 데이터를 주고 받기 위한 방법을 의미 어떤 특정 사이트에서 특정 데이터를 공유할 경우 어떠한 방식으로 정보를 요청해야 하는지, 그리고 어떠한 데이터를 제공 받을 수 있을지에 대한 규격들을 API라고 하는것 API는 점원과 같은 역할 API는 손님(프로그램)이 주문할 수 있게 메뉴(명령 목록..

filter 특정 조건을 만족하는 새로운 배열을 만들때 사용 const numbers = [1, 2, 3, 4, 5]; const result = numbers.filter(number => number > 3); console.log(numbers); // [1, 2, 3, 4, 5]; console.log(result); // [4, 5] // for문을 이용 for (i = 0; i 3) { result.push(numbers[i]); } } console.log(result); // [4, 5] filter(요소 값, index, 순회하는 대상 객체) Boolean 값인 true 또는 false 값을 반환하는 함수를 등록 ..

오늘은 알고리즘 주차에 들어와서 문제를 푸는데 다른사람들의 풀이를 보면서 map()함수를 많이 보았다 for문 처럼 배열 안에서 i가 돌면서 배열을 지나가듯이 map()는 for문을 사요하지 않고도 배열의 요소들을 하나씩 돌면서 실행 되는 함수이다 map() 함수는 모든 배열의 값에 Function을 실행하는 Method https://mjn5027.tistory.com/80 [ JavaScript ] 자바스크립트 map( ) 함수 값을 여러개 가지고 있는 배열에서 모든 값을 꺼내고자 할 때, 꺼내는 방법은 정말 다양하게 알려져 있다. 이번 포스팅에선 이러한 배열에서 값 꺼내는 방법 중 map( ) 을 다뤄보도록 하자. 아래와 mjn5027.tistory.com 요소의 인덱스를 사용하면 for문이 좋으나..

2022.05.06 회원가입 페이지 제작시 정보 유효성 검사 function check(){ let checkid = /^[a-zA-Z0-9]{4,12}$/; let checkpw = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{4,20}$/; let checkname = /^[가-힝a-zA-Z]{2,}$/; let checkemail = /[0-9a-zA-Z-_.]/; if (idval.val() == "") { // alert("아이디 입력바람"); idval.focus(); $(".idError").text(" 아이디 입력바람") return false; } else { $(".idError").text("") } if (!checkid.test(idval.val())) { // ..

2022.05.03 사진 파일 업로드 하는 방법 / 미리보기(사진 띄우기) 로 사진, 오디오, 비디오 등을 올릴 수 있다 accept="img/*" 로 이미지 파일만 선택 가능(오디오 비디오도 마찬가지) multiple 은 여러 파일 선택 가능하게 해줌 보통 input 태그에 css 적용이 힘들어서 과 함께 사용한다 input은 display:'none'을 입히고 버튼 클릭시 input이 클릭 되게 연동해서 UI를 이쁘게 사용 많이 함 사진업로드 그럼 버튼을 누르면 숨겨진 input이 클릭 되어 파일 선택창이 열리게 되고 그림 파일을 선택하면 input이 체인지 되어 upload 함수가 실행됨 input에 담긴 파일의 정보는 배열과 딕셔러니 형식으로 담기게 됨. .files[0] 로 파일의 정보를 가져온..