NextJS, Create React App(CRA)를 사용하지 않고 초기 프로젝트에 TypeScript를 설치하고 설정하는 방법에 대해 알아보겠습니다. 프로젝트 시작 프로젝트 디렉터리를 생성합니다. 12$ mkdir typescripttest$ cd typescripttest 다음 명령어를 실행하여 package.json을 초기화합니다. 1$ npm i
TypeScript에서 인터페이스(Interface)를 생성하고 사용하는 방법에 대해 알아보겠습니다. Interfaces 객체의 모양을 특정해 주기 위해 사용합니다. 여기서는 firstName 및 lastName 필드가 있는 객체를 설명하는 인터페이스를 사용합니다. 1234interface Person { firstName: string; l
TypeScript에서 클래스(Class)를 생성하고 사용하는 방법에 대해 알아보겠습니다. 클래스(Class) 가장 기본적인 클래스입니다. 1class Player {} 필드를 선언해서 사용 가능합니다. 12345678class Player { firstname: string; lastname: string;}con
다형성(Polymorphism) 다형성이란, 여러 타입을 받아들임으로써 여러 형태를 가지는 것을 의미합니다. poly: many, serveral, much, multi 등과 같은 뜻 morphos: form, structure 등과 같은 뜻 polymorphos = poly + morphos: 여러 다른 구조 예시 123456789101112typ
Function Overloads 동일한 이름에 매개 변수와 매개 변수 타입 또는 리턴 타입이 다른 여러 버전의 함수를 만드는 것을 말합니다. TypeScript에서는 오버로드 signatures을 작성하여 **“다양한 방식으로 호출할 수 있는 함수”**를 지정할 수 있습니다. 사용 예제 매개변수의 데이터 타입이 다른 경우 매개변수의 데이터 타입이 다
타입스크립트란? TypeScript는 JavaScript에 추가적인 구문을 추가하여 editor 와의 단단한 통합을 지원합니다. editor에서 초기에 오류를 잡을 수 있습니다. TypeScript 코드는 JavaScript가 실행되는 모든 곳(브라우저, Node.js 또는 Deno 및 앱 등)에서 JavaScript로 변환될 수 있습니다. TypeScr
이전 글 [OpenLayers] Custom Icon Feature 추가 에서 추가된 Icon Feature를 Drag and Drop 하는 예제입니다. Script ol.interaction.Modify 을 이용해서 Drag and Drop 기능을 구현합니다. modifystart, modifyend 이벤트를 등록하여 Icon을 선택하거나 이동 시 커서
이전 글 [OpenLayers] Static Image에서 설정한 Static Image 위에 주어진 위치의 아이콘을 표시하는 예제입니다. OpenLayers 3 버전을 사용하였습니다. Script 기존 코드에서 addVectorLayer 함수와 styles 객체가 추가되었습니다. 먼저 ol.style.Icon 을 이용해서 아이콘 경로를 설정합니다. 12
OpenLayers 사용하여 OSM(OpenStreetMap)으로 지도를 가시화하는 것이 아닌 Static Image를 Layer Source로 사용하여 이미지를 가시화하는 예제입니다. OpenLayers 3 버전을 사용하였습니다. HTML 12345678910111213141516171819202122232425<!-- index.html --&g
Iteration 람다(Lambda)의 forEach 함수를 사용하는 예제입니다. 사용 예 1List<String> friends = Arrays.asList("Brian", "Nate", "Neal", "Raju", "Sara", "Scott"); 기존 for 문 1234567for (int i = 0; i < friends.size