본문 바로가기

분류 전체보기154

css 가시성 제어(overflow/visibility/display) visibility 요소를 화면에서 show/hide 시킬 수 있으며 화면에서 가려지나 그 자리는 지키고 있다. visibility:hidden; 속성값 - visible : 요소가 보임. - hidden : 요소가 보이지 않지만 공간을 잡고 있기때문에 레이아웃에 영향을 미친다. - inherit : 부모 요소의 값을 상속 display 요소를 표시하는 방법을 지정한다. display:none; 요소가 완전히 사라진다. 공간도 차지하지 않는다. overflow 자식 요소가 부모 요소의 범위를 초과할 때 어떻게 처리할지 결정해준다. overflow : hidden; 부모 요소의 범위를 넘어가는 자식요소의 부분은 보이지 않도록 처리한다. 2021. 11. 6.
OAuth 개념 및 동작방식 이해하기 1 OAuth 란? 다른 서비스의 회원 정보를 안전하게 사용하기 위한 방법 고객이 자신의 네이버 아이디/비밀번호를 우리 서비스에 알려주지 않아도, 네이버에 있는 고객의 정보를 우리의 서비스에서 안전하게 사용하기 위한 방법. 2 OAuth 참여자 💻 Resouce server(Facebook, Google, Twitter 등) Client가 제어하고자 하는 자원을 보유하고 있는 서버. 👤 Resource owner(자원의 소유자) Client가 제공하는 서비스를 통해 로그인하는 실제 유저. 📱 Client(웹 어플리케이션) Resource Server에 접속해서 정보를 가져오고자 하는 클라이언트. 3 OAuth Flow 등록(Resgister) Client가 Resource Server를 이용하기 위해서는.. 2021. 10. 30.
[Javascript] Ajax/fetch 0 fetch란? fetch 함수는 XMLHttpRequest 객체와 마찬가지로 HTTP 요청 전송 기능을 제공하는 클라이언트 사이트 Web API이다. 1 fetch 사용법 fetch('css') 첫번째 인자로 전달된 데이터를 서버에게 요청한다. then() 최종적으로 응답이 끝나면 실행된다. alert(text) text라는 변수 안에 서버가 응답한 데이터가 들어가있고 이 부분이 호출되게 된다. 2 fetch 특징 function callbackme(){ console.log('response end'); } fetch('html').then(callbackme); console.log(1); console.log(2); - XMLHttpRequest 객체보다 사용법이 간단하다. - Asynchron.. 2021. 10. 27.
[Javascript] 함수 1 함수란? 프로그래밍 언어의 함수는 일련의 과정을 문(statement)으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것이다. 프로그래밍 언어의 함수도 입력을 받아서 출력을 내보낸다. 매개 변수(parameter) : 함수 내부로 입력을 전달받는 변수 인수(argument) : 입력 반환값(return value) : 출력 함수 정의 함수는 함수 정의를 통해 생성. // 함수 정의 function add(x,y){ return x + y; } 함수 호출 그리고 인수를 매개변수를 통해 함수에 전달하면서 함수의 실행을 지시해야한다. 함수를 호출하면 코드 블록에 담긴 문들이 일괄적으로 실행되고 실행 결과, 반환값을 반환한다. //함수 호출 var result = add(2, 5); // 함수.. 2021. 10. 24.
[Javascript] Ajax/JSON/XMLHttpRequest 1 Ajax란? Ajax(Asynchronous Javascript and XML) 자바스크립트를 사용하여 브라우저가 서버에게 비동기 방식으로 데이터를 요청하고, 서버가 응답한 데이터를 수신하여 웹페이지를 동적으로 갱신하는 프로그래밍 방식. 브라우저에서 제공하는 Web API인 XMLHttpRequest 객체를 기반으로 동작한다. XMLHttpRequest는 HTTP 비동기 통신을 위한 메서드와 프로퍼티를 제공한다. Ajax의 장점 필요한 데이터만 서버로부터 전송받기 때문에 불필요한 데이터 통신이 발생하지 않는다. 변경할 필요가 없는 부분은 다시 렌더링하지 않기 때문에 화면이 순간적으로 깜빡이는 현상이 발생하지 않는다. 클라이언트와 서버와의 통신이 비동기 방식으로 동작하기 때문에 서버에게 요청을 보낸 이.. 2021. 10. 16.
[Javascript] Object 1 객체란? 자바스크립트는 객체 기반의 프로그래밍 언어이며, 자바스크립트를 구성하는 거의 '모든 것'이 객체다. 원시 타입의 값, 즉 원시 값은 변경 불가능한 값이지만 객체 타입의 값, 즉 객체는 변경 가능한 값이다. 객체는 0개 이상의 프로퍼티로 구성된 집합이며 프로퍼티는 키(key)와 값(value)로 구성된다. 자바스크립트에서 사용할 수 있는 모든 값은 프로퍼티 값이 될 수 있고 함수도 프로퍼티값이 될 수 있다. 프로퍼티 값이 함수일 경우, 일반 함수와 구분하기 위해 메서드라고 부른다. 이처럼 객체는 프로퍼티와 메서드로 구성된 집합체. 프로퍼티 : 객체의 상태를 나타내는 값(data) 메서드 : 프로퍼티를 참조하고 조작할 수 있는 동작(behavior) 2 객체 리터럴에 의한 객체 생성 자바스크립트.. 2021. 10. 12.
반응형

티스토리툴바