동캄의 코딩도장

@KEYFRAME CSS 제공하는 문법으로, 애니메이션 효과를 나타낼 수 있다. @KEYFRAME 내의 구간들이 하나의 애니메이션 효과를 나타낸다. 사용법 @KEYFRAME내에 선택자를 묶어주고, 스테이지 별로 작동하도록 구성한다. FROM TO 를 이용해서 작성할 수 있다. @keyframes slide { from { left: -100px; opacity: 0; } to { left: 300px; opacity: 1; } } 0%, 100%로 스테이지를 부여해서 작성할 수 있다. @keyframes slide { 0% { left: -100px; opacity: 0; } 100% { left: 300px; opacity: 1; } } https://www.youtube.com/watch?v=ru5F..

BOOTSTRAP Semantic UI와 함께 레이아웃 제작에 도움이 되는 CSS FRAMEWORK이다. 사용법 먼저 BOOTSTRAP 사이트에 들어가 소스 파일을 다운받고, 사용하고자 하는 디렉토리에 다운로드 받은 파일의 압축을 푼다. 링크 다음으로, 디렉토리의 위치를 잘 파악하고, 해당 다운로드 받은 파일 내의 bootstrap.css 와 bootstrap.js 파일에 접근할 수 있도록 주소를 연결해준다. Semantic UI의 홈페이지에 들어가서 해당 요소의 사용법과 예시를 찾아보고, 해당 코드를 가져와서 사용한다. Example label Another label Semantic UI 사용법과 마찬가지로 동적으로 작동하는 요소를 동작시키고 싶다면, 자바스크립트 코드를 추가하여 사용한다.

Semantic UI BOOTSTRAP과 함께 레이아웃 제작에 매우 도움이 되는 CSS FRAMEWORK이다. 사용법 먼저 Semantic UI 사이트에 들어가 GET STARTED 버튼을 눌러 파일을 다운받고, 사용하고자 하는 디렉토리에 다운로드 받은 파일의 압축을 푼다. 링크 다음으로, 디렉토리의 위치를 잘 파악하고, 해당 다운로드 받은 파일 내의 semantic.css 와 semantic.js 파일에 접근할 수 있도록 주소를 연결해준다. Semantic UI의 홈페이지에 들어가서 해당 요소의 사용법과 예시를 찾아보고, 해당 코드를 가져와서 사용한다. Follow 만약, 버튼과 같이 요소를 동적으로 작동시키고 싶다면, 자바스크립트 코드를 작성하여 동작시켜야한다. (이것도 UI 사용법을 살펴보면 알 수..

JSON JSON은 JavaScript Object Notation의 약자 JSON은 좀 더 쉽게 데이터를 교환하고 저장하기 위하여 만들어진 텍스트 기반의 데이터 교환 표준 JSON 특징 JSON은 자바스크립트를 확장하여 만들어짐 JSON은 자바스크립트 객체 표기법을 따름 JSON은 사람과 기계가 모두 읽기 편하도록 고안 JSON은 프로그래밍 언어와 운영체제에 독립적 JSON 문법 JSON은 리터럴(literal) 또는 프로퍼티(property)만 사용 표현 가능한 타입은 number, string, boolean, object, array, NULL 주석 사용 x JSON 구조 JSON 데이터는 이름과 값의 쌍으로 이루어짐 JSON 데이터는 쉼표(,)로 나열 객체(object)는 중괄호({})로 둘러쌓..

XML XML은 데이터를 저장하고 전달할 목적으로 만들어졌으며, 저장되는 데이터의 구조를 기술하기 위한 언어 XML은 eXtensible Markup Language의 약자로, 수많은 응용 분야에서 데이터를 저장하고 전달하는 중요한 역할을 함 XML 목적 서로 호환되지 않는 데이터 타입을 사용하는 시스템 간의 데이터 교환에는 많은 시간과 노력 발생 또한, 이렇게 데이터를 변환하는 과정에서 데이터의 손실이 발생하는 경우도 종종 있음. 하지만 XML은 데이터를 텍스트 형식으로 저장하므로, 소프트웨어나 하드웨어에 독립적으로 데이터를 저장하고 전달 가능. 따라서 XML을 사용하면 새로운 운영체제나 프로그램, 브라우저 등에 상관없이 데이터를 안전하고 손쉽게 전달 가능. XML 문법 가장 맨 윗줄에 xml 선언을 ..

Ajax Asynchronous JavaScript and XML Ajax는 빠르게 동작하는 동적인 웹 페이지를 만들기 위한 개발 기법 중 하나 Ajax 장점 웹 페이지 전체를 다시 로딩하지 않고도, 웹 페이지의 일부분만을 갱신 가능 웹 페이지가 로드된 후에 서버로 데이터 요청을 보내기 가능 웹 페이지가 로드된 후에 서버로부터 데이터를 받기 가능 백그라운드 영역에서 서버로 데이터를 보내기 가능 Ajax 단점 Ajax는 클라이언트가 서버에 데이터를 요청하는 클라이언트 풀링 방식을 사용하므로, 서버 푸시 방식의 실시간 서비스는 불가 Ajax로는 바이너리 데이터를 보내거나 받기 불가 Ajax 스크립트가 포함된 서버가 아닌 다른 서버로 Ajax 요청을 보내기 불가 클라이언트의 PC로 Ajax 요청을 보낼 수는 ..