Front-End: Web/JavaScript (85) 썸네일형 리스트형 라이브러리(Library) 라이브러리 1. 라이브러리란? 라이브러리는 모듈과 비슷한 개념이다. 모듈이 프로그램을 구성하는 작은 부품으로서 로직을 의미한다면, 라이브러리는 자주 사용되는 로직을 재사용하기 편리하도록 잘 정리한 일련의 코드들의 집합이다. 두 개념은 크게 다르진 않다. 이미 누군가 만들어 놓은 좋은 라이브러리들이 많으므로, 좋은 라이브러리를 선택하고 잘 사용하는 것도 프로그래밍에서 중요하다. 예제 현재 가장 유명한 라이브러리로 jQuery가 있다. jQuery를 사용하기 위해선 두 가지를 해야 한다. ▪ 첫 번째로 jQuery 로직을 사용하기 위해서 jQuery 자바스크립트 파일을 우리의 웹페이지로 가져오는 것이다. 이는 jQuery 웹 페이지에 접속하여 'Download jQuery'를 하면 된다. ▪ 또 하나는 AP.. 모듈(Module) 모듈 프로그램은 작고 단순한 것에서부터 크고 복잡한 것으로 진화한다. 그 과정에서 코드의 재활용성을 높이고, 유지보수를 쉽게할 수 있는 다양한 기법들이 있는데, 그 중 하나가 코드를 여러 개의 파일로 분리하는 것이다. 이것을 모듈화라고 한다. 이의 효과는 다음과 같다. 자주 사용되는 코드를 별도의 파일로 만들어서 필요할 때마다 재활용할 수 있다. 코드를 개선하면 이를 사용하고 있는 모든 애플리케이션의 동작이 개선된다. 코드 수정 시에 필요한 로직을 빠르게 찾을 수 있다. 필요한 로직만을 로드해서 메모리의 낭비를 줄일 수 있다. 한번 다운로드된 모듈은 웹브라우저에 의해서 저장되기 때문에 동일한 로직을 로드 할 때 시간과 네트워크 트래픽을 절약할 수 있다. (브라우저에서만 해당) 한 번 다운 받은 것은 브라.. 객체(Object) 객체 배열과 객체는 연관된 데이터들을 담아내는 그릇이다. 둘의 차이점은 배열은 인덱스의 값이 자동으로 0부터 숫자로 지정이 되지만 객체는 인덱스로 우리가 원하는 값을 지정할 수 있다. 이 인덱스를 이용하여 데이터를 가져올 수 있다. 또한 배열은 대괄호([])로 작성하지만 객체는 중괄호({})로 작성한다. 다른 언어에서는 객체를 연관배열, 맵, 혹은 딕셔너리라는 데이터 타입이라고 말하기도 한다. 1. 객체의 생성 객체 생성하기 객체를 생성해보자. 객체는 인덱스를 문자로 작성한다. 이 인덱스를 key라고 말한다. {'egoing': 10, 'k8805': 6, 'sorialgi': 80} 객체를 생성하면 객체를 대표하는 변수를 만들고, 그 변수에 객체를 담아낸다. 그럼 이제 변수를 통해 객체를 언제든지 관리.. Three.js 2: PCD(Point Cloud Data)Loader 1. PCD(Point Cloud Data) 1.1 PCD file format PCD 파일은 Point Cloud Library 포맷 구조를 가지고 있다. 하지만 PCD는 3D point cloud data를 나타내기 위해 처음 나온 파일 형식이 아니다. 이전에도 PLY, STL, OBJ, X3D 등 많은 종류가 있었다. 하지만 앞에서 언급된 파일 형식들은 최근에 개발된 센싱 기술들과 알고리즘 이전에 개발되었기 때문에 최근 방향과는 다른 목적을 위해 만들어졌다. 따라서 최근 기술 방향에 따르면 PCD 파일 형식이 사용되는 편이다. 1.2 PCD versions PCD 파일 형식은 PCD_V6, PCD_V7와 같이 PCD_Vx로 다른 버전을 나타낸다. 현재 공식적으로 버전은 0.7 즉 PCD_V7이어야 .. Three.js 1: 시작하기 1. Three.js란? 1.1 OpenGL Open Graphics Library. 2D, 3D 그래픽 라이브러리이자 API이며 범용성이 있어 광범위하게 사용되고 있다. 1.2 WebGL Web Graphics Library. WebGL은 이러한 OpenGL을 플러그인 도움 없이 사용할 수 있도록 만들어진 웹 기반의 그래픽 API이다. 자바스크립트로 작성된 제어 코드와 컴퓨터의 GPU에서 실행되는 특수한 효과를 내는 코드로 구성되어 있으며, HTML의 요소를 통해서 3D 렌더링을 할 수 있다. 대부분 최신 버전의 웹 브라우저라면 사용할 수 있으므로 호환성이 높은 편이다. 또한 WebGL 요소들은 HTML 요소들과 섞어서 함께 사용할 수도 있으므로 웹 페이지를 꾸미는데 사용할 수도 있다. 예시 웹 사이트.. JavaScript란? 자바스크립트란? 구글에 자바스크립트를 검색하면 위키백과에 아래와 같이 뜬다. 자바스크립트는 객체 기반의 스크립트 프로그래밍 언어이다. 이 언어는 웹 브라우저 내에서 주로 사용하며, 다른 응용 프로그램의 내장 객체에도 접근할 수 있는 기능을 가지고 있다. 또한 Node.js와 같은 런타임 환경과 같이 서버 프로그래밍에도 사용되고 있다. 자바스크립트는 객체지향 스크립트 프로그래밍 언어로 웹 브라우저 내에서 주로 사용되므로 웹 개발하는데에 사용된다. 웹의 프론트엔드를 개발하기 위해서 필요한 기술들은 기본적으로 HTML, CSS, JavaScript가 있다. 이 중에서 가장 핵심이 되는 기술이 자바스크립트이다. 자바스크립트 없이 웹 프로그래밍을 한다는 것은 거의 불가능에 가까운 일이 되었고, 언어가 가진 수 많.. JSON와 JSON 메서드 1. JSON이란? JSON 객체(JavaScript Object Notation)란, 속성-값 쌍 혹은 키-값 쌍으로 이루어진 데이터 객체를 전달하기 위해 인간이 읽을 수 있는 텍스트를 사용하는 포맷이다. 비동기 브라우저/서버 통신(AJAX)을 위해, 넓게는 XML을 대체하는 주요 데이터 포맷으로, 주로 인터넷에서 자료를 주고 받을 때 자료를 표현하는 방법으로 알려져 있다. 자바스크립트 객체에 기반하고 있으나, 프로그래밍 언어나 플랫폼에 독립적이므로 다양한 프로그래밍 언어에서 이용된다. 파일 확장자는 .json이다. 장점 텍스트로 이루어져 있으므로, 사람과 기계 모두 읽고쓰기 쉽다. 프로그래밍 언어와 플랫폼에 독립적이므로, 서로 다른 시스템간에 데이터 객체를 교환하기에 좋다. 자바스크립트의 문법을 기반.. JSON과 Javascript Object의 차이 JSON은 객체, 배열, 숫자, 문자열, boolean, null을 직렬화하기 위한 구문으로, Javascript 구문에 기반을 두고 있으나 둘은 엄밀히 다른 개념이다. (*JSON이란?) 1) 속성명 JSON에서 속성명은 반드시 큰따옴표로 표시된 문자열이어야 한다. 후행 쉼표는 허용되지 않는다. Javascript Object는 상관없다. 그냥 키-속성값으로 구성되기만 하면 된다. 2) JSON.parse() JSON.parse() 메서드에 JSON 포맷의 객체를 넣으면 자바스크립트 객체로 변환된다. 3) 후행 쉼표 JSON에서 후행 쉼표는 허용되지 않지만, 자바스크립트 객체에서는 허용된다. 4) 숫자 JSON에서 선행 0은 허용되지 않는다. 또한 소숫점 뒤에는 적어도 한 자릿수가 뒤따라야 한다. Na.. 이전 1 ··· 5 6 7 8 9 10 11 다음
