본문 바로가기

분류 전체보기218

02/10 JavaScript, Babel 왜 배열로 할까요?? 동적 처리가 가능 하기 때문에 동적처리가 가능하면 몸값이 올라간다^^ 어제했던 인기 25 리스트에 동영상 연결하기 JSP jsp에서 제공하는 include를 사용하기 네이버같은 컨셉으로 실습을 해보자/ 네이버에서 연합뉴스 날씨 환율 계속 바뀌는것처럼. : 스크립틀릿 JSP에서 여기는 자바땅이다. setInterval() 사용법 웹페이지의 특정 부분을 주기적으로 업데이트해줘야 하거나, 어떤 API로 부터 변경된 데이터를 주기적으로 받아와야 하는 경우가 있는데요. 이럴 때는 자바스크립트의 setInterval() 함수를 사용할 수 있습니다. setInterval() 함수는 어떤 코드를 일정한 시간 간격을 두고 반복해서 실행하고 싶을 때 사용합니다. 함수 API는 setTimeout() .. 2023. 2. 10.
02/09 자바스크립트 JSP React 자바스크립트에서 배열은 매우 중요하다. 자바보다 훨씬 더 중요 자바스크립트에서 instance of 로 타입을 체크해줘야된다. 왜냐하면 컴파일을 안한다. 내가 타입체크를 해야된다 Nullish문제 Nullish병합 연산자(??)를 이용하면 (undefined ?? 2) ->2 세번째는 있으나 마나 하다. 첫번째가 널이면 다음꺼로 치환된다. 논리비교 == === 세개짜리는 타입비교까지 한다. ===쓰는것이 더 안전하다. !== !=== 객체는 데이터를 Property라는 인덱싱을 통해 구조적으로 묶어놓은 형태이다. let car={ name: "깜찍" age:(프로퍼티 인덱싱) } 배열 추가하는 메소드 push 맨 뒤에 추가해준다. 자바스크립트에서는 객체나 함수를 생성할때 function사용 선언이 안되어.. 2023. 2. 9.
Youtube API 사용하기 https://developers.google.com/youtube/v3/getting-started?hl=ko 시작하기 | YouTube Data API | Google Developers 시작하기 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요. 소개 이 문서는 YouTube와 상호작용할 수 있는 애플리케이션을 개발하려는 개발자를 위해 작성되었 developers.google.com https://developers.google.com/youtube/v3/docs/?apix=true API Reference | YouTube Data API | Google Developers API Reference 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하.. 2023. 2. 9.
02/08 jQuery JSON.parse() JSON.parse() 메서드는 JSON 문자열의 구문을 분석하고, 그 결과에서 JavaScript 값이나 객체를 생성합니다. 선택적으로, reviver 함수를 인수로 전달할 경우, 결과를 반환하기 전에 변형할 수 있습니다. submit이슈 이 경우는 submit에 대한 이슈가 없음 이 경우도 submit에 대한 이슈가 없음 전송 submit이슈가 있음-주의할것 반드시 event.preventDefault()를 호출하여 이벤트 버블링 방어할것 문제상황 페이지 새로고침이 발생함 화면이 하얗게 변했어요 화면이 계속 렌더링되고 있어요-F5-새로고침 기본 동작 막기 브러우저의 기본 태그들은 기본 이벤트를 갖고 있는 경우가 많습니다. 예로 태그는 클릭시 해당 URL로 이동하고 은 submi.. 2023. 2. 8.
02/07 48회차 Ajax, 비동기 통신 함수 1. 선언적함수 2. 익명함수 3. 대입형함수 -일급함수: 변수에 익명함수가 대입된 형태, 고차함수 4. 즉시실행함수-호이스팅과 관련 함수는 자바스크립트에서 객체이다. 호이스팅 이슈 중간에 선언된 변수가 전역변수 화 되는것 let이나 const로 바꾸게 되었다. 익명함수가 들어가는 위치는 콜벡함수자리이다. 일급함수는 자바스크립트 뿐만아니라 다른언어에도 쓰인다. 자바에는 없다. 자바스크립트는 void 가 없다. 버튼 타입 = 버튼? Q. button에 type="button" 을 지정해주는 이유? A. 그게 디폴트가 아니니까요! button의 type에는 3가지 값을 지정해 줄 수 있는데 각각 submit, reset, button입니다. 만약 아무런 값도 지정하지 않았다면 기본값은 submit이 됩.. 2023. 2. 7.
02/07 48회차 Google API사용하기 https://console.cloud.google.com/apis/ Google 클라우드 플랫폼 로그인 Google 클라우드 플랫폼으로 이동 accounts.google.com firebase로 googleapi 키 만들어 준다. https://firebase.google.com/?hl=ko Firebase Firebase는 고품질 앱을 빠르게 개발하고 비즈니스를 성장시키는 데 도움이 되는 Google의 모바일 플랫폼입니다. firebase.google.com terminal에서 npm install firebase 파이어 베이스 설치해준다. 구글에 자동으로 firebase에서 생성된 키가 들어온다 도메인주소랑 Oauth ID 발급은 firebase console에서 -> Authentication->.. 2023. 2. 7.
02/03 47회차 수업 오늘은 웹서비스에 필요한 컨셉을 느껴보는 시간^^ DOM 이란? 문서 객체 모델(The Document Object Model, 이하 DOM) 은 HTML, XML 문서의 프로그래밍 interface 이다. DOM은 문서의 구조화된 표현(structured representation)을 제공하며 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여 그들이 문서 구조, 스타일, 내용 등을 변경할 수 있게 돕는다. DOM 은 nodes와 objects로 문서를 표현한다. 이들은 웹 페이지를 스크립트 또는 프로그래밍 언어들에서 사용될 수 있게 연결시켜주는 역할을 담당한다. html문서 전체를 가리키는 내장객체가 있다. BOM 브라우저의 내장객체 브라우저 객체 모델(Browser Object Mode.. 2023. 2. 3.
02/02 JavaScript (forEach, filter) Node.js V8은? 오픈소스 자바스크립트 엔진이다. 구글이 만들었다. 버블링과 캡쳐링 부모한테 이벤트가 발동되는것 : 버블링 자식한테 이벤트가 타고 내려오는것 : 캡쳐링 태그-순서가 없다. 비상태 Query String 쿼리스트링이란? 사용자가 입력 데이터를 전달하는 방법중의 하나로, url 주소에 미리 협의된 데이터를 파라미터를 통해 넘기는 것을 말한다. query parameters( 물음표 뒤에 = 로 연결된 key value pair 부분)을 url 뒤에 덧붙여서 추가적인 정보를 서버 측에 전달하는 것이다. 클라이언트가 어떤 특정 리소스에 접근하고 싶어하는지 정보를 담는다 물음표 뒷부분이 쿼리 스트링이다. get방식으로 가져온다. Restful API를 사용해서 가져오는것이다. Object J.. 2023. 2. 2.
02/01 naver API 이용신청하기 환경 기억해놓기 포스트맨에 가서 request 랑 npm express가 설치 되어있어야한다. 랜덤으로 네이버에서 캡차 이미지를 계속 받아온다. 로그인기능 구현시 API활용이 가능하다. 유저가 요청을 하면 네이버 서버에서 보여준다. 굳이 내가 이미지를 다운 받지않는다. const express = require("express"); const app = express(); const client_id = "RDDdbMBfUtlavWmyBD_e"; //개발자센터에서 발급받은 Client ID const client_secret = "비밀^^"; //개발자센터에서 발급받은 Client Secret const code = "0"; app.get("/captcha/nkey", function (req, res).. 2023. 2. 1.
02/01 html총정리, JavaScript 브라우저의 역할알기 클라이언트 사이드 랜더링 서버사이드 랜더링 서버의 위치 전체적인 웹 서비스의 개요도를 잘 알아야한다. 1. 인라인 요소와 블록요소를 구분할수 있어야 한다. 이러한 요소들은 css에서 바꿀 수 있다. display : block; 크기설정 색설정 등등이 가능 2.열린태그와 닫힌태그가 쌍이 아닌것이있다. 태그를 다 기억 할 필요는 없다. 요즘은 다 솔루션쓰기때문에 필요할 때 마다 mdn사이트에서 찾으면된다. 3.html, css는 클라이언트측에 다운로드가 된다. request 객체가 필요하다. 서버가 클라이언트에게 요청하는것이다. jsp수업의 첫 단추가 request와 response이다. http프로토콜 Restful API -get, put, delete get은 쿼리스트링 보안에 취.. 2023. 2. 1.

티스토리툴바