TypeScript
-
TypeScript 학습 시작하는 방법 – 초보자를 위한 안내
JavaScript는 웹 개발을 위한 가장 널리 사용되는 프로그래밍 언어입니다. 하지만 현대 프로그래밍 언어의 필수 기능인 타입 체크 지원이 부족합니다. JavaScript는 원래 간단한 스크립트 언어로 설계되었습니다. 그 느슨한 특성과 중요한 객체 지향 프로그래밍 (OOP) 기능의 부재는 개발자에게 몇 가지 도전 과제를 제기합니다: 제한된 문서화 및 자동 완성 기능. OOP 개념을 활용할 수 없음. 타입 안전성이 부족하여 런타임 오류 발생. 리팩토링 및 유지 관리의 어려움. 인터페이스 및 통합 포인트의 부재. TypeScript는 이러한 문제를 해결합니다. JavaScript를 보다 완벽한 현대 프로그래밍 언어로 만들기 위해…
-
젠킷과 AI로 날씨 서비스 구축하기
개요 이 프로젝트는 Genkit, TypeScript, OpenWeatherAPI 및 GitHub 모델을 사용하여 AI 강화 날씨 서비스를 구축하는 방법을 보여줍니다. 이 애플리케이션은 현대적인 Node.js 패턴과 AI 통합 기술을 선보입니다. 전제 조건 시작하기 전에 다음 사항을 확인하세요: 귀하의 기기에 Node.js가 설치되어 있어야 합니다. GitHub API를 위한 GitHub 계정 및 액세스 토큰이 필요합니다. 날씨 데이터를 가져오기 위한 OpenWeatherAPI 키가 필요합니다. 귀하의 기기에 Genkit CLI가 설치되어 있어야 합니다. 기술적 심층 탐구 AI 구성 핵심 AI 설정은 Genkit 및 GitHub 플러그인 통합으로 초기화됩니다. 이 경우, 우리는 OpenAI…
-
타입스크립트에서 비동기 프로그래밍 배우기: 프로미스, Async/Await, 그리고 콜백
비동기 프로그래밍은 비동기식으로 실행되는 코드를 작성할 수 있게 해주는 프로그래밍 패러다임입니다. 코드가 순차적으로 실행되는 동기 프로그래밍과는 달리, 비동기 프로그래밍은 프로그램의 나머지 부분이 계속 실행되는 동안 백그라운드에서 코드를 실행할 수 있게 해줍니다. 이는 원격 API에서 데이터를 가져오는 것과 같이 완료하는 데 오랜 시간이 걸릴 수 있는 작업에 특히 유용합니다. 비동기 프로그래밍은 JavaScript에서 반응형이고 효율적인 애플리케이션을 만들기 위해 필수적입니다. JavaScript의 상위 집합인 TypeScript는 비동기 프로그래밍 작업을 더욱 쉽게 만들어 줍니다. TypeScript에서 비동기 프로그래밍을 위한 여러 접근 방식이 있으며, 여기에는 프라미스, async/await, 및…
-
TypeScript를 사용하여 지리적 거리 계산기 구현
교육 게임을 개발할 때 정확하고 의미 있는 피드백을 제공하는 것은 사용자 참여에 매우 중요합니다. 이 기사에서는 사용자가 상호작용 피드백을 통해 세계 지리를 배울 수 있도록 돕는 깃발 추측 게임인 Flagle Explorer를 위해 우리가 지리적 계산 시스템을 어떻게 구현했는지 공유하겠습니다. 기술적 도전 과제 우리의 주요 요구 사항은 다음과 같습니다: 지구상의 두 지점 간의 정확한 거리 계산 방향 안내를 위한 정밀한 방위각 계산 정규화된 근접 점수 즉각적인 피드백을 위한 실시간 성능 구현 세부 사항 1. 핵심 데이터 구조 먼저, 기본 지리적 점…
-
TypeScript를 사용하여 FormData에서 유형 안전성을 강제하는 방법
자바스크립트에서 FormData 인터페이스를 사용할 때, 데이터가 키/값 쌍으로 추가되는데, 추가하는 키에 대한 타입 안전성을 강제하는 내장 방법이 없습니다. 이는 오타, 누락된 키 및 예기치 않은 런타임 오류로 이어질 수 있습니다. 그러나 TypeScript에서는 엄격한 키 유효성을 강제하여 이를 해결할 수 있습니다. API에 폼 값을 보낼 때 스스로 이 솔루션이 필요했습니다. 후에 제가 페이로드에 추가하려고 시도한 여러 키/값 쌍에서 여러 오타를 발견했습니다. FormData는 키로 모든 문자열을 허용하기 때문에 잘못된 문자열을 전달하고 API 요청을 계속할 수 있었습니다. 이런 일이 일어난 후에는 TypeScript가 이러한…
-
타입스크립트의 브랜디드 타입
TypeScript로 엔티티를 모델링할 때, 이와 같은 인터페이스를 얻는 것은 매우 일반적입니다. TypeScript interface User { id: number username: string … } interface Order { id: number userId: number title: string year: number month: number day: number amount: { currency: ‘EUR’ | ‘USD’, value: number } … } 문제점 속성의 타입은 의미론적 의미가 없습니다. 타입 측면에서 User.id, Order.id, Order.year 등은 모두 동일합니다: 숫자이며, 숫자로서 상호 교환 가능하지만, 의미상으로는 그렇지 않습니다. 앞의 예를 따라, 엔티티에 대해 작업을 수행하는 함수 집합을…
-
자바스크립트 초보자를 위한: ngClass로 동적 클래스 할당하기
웹 앱에서는 조건에 따라 요소의 모양을 맞춤 설정해야 하는 일반적인 요구 사항입니다. 이를 수행하는 몇 가지 방법이 있지만 Angular를 사용하는 경우 선택은 명확합니다. ngClass 지시문은 요소나 구성 요소에 동적으로 클래스 이름을 할당하는 다양한 방법을 제공합니다. 해당 구문은 간결하며 비교적 복잡한 논리를 지원하여 클래스 이름 및 설정 기준에 대한 세부적인 제어를 제공합니다. 이 튜토리얼에서는 ngClass 지시문을 사용하여 요소에 CSS 클래스를 동적으로 할당하는 가장 일반적인 방법 중 일부를 살펴보겠습니다. [className] 속성 바인딩을 사용하여 CSS 클래스 할당하기 이 문서는 ngClass 지시문에 관한 것이지만,…
-
无服务器计算和 GraphQL: 现代应用开发
이 articl e에서는 TypeScript, AWS Lambda, 그리고 Apollo Server를 사용하여 서버를 관리하지 않는 GraphQL API를 생성하는 과정에 대해 引导할 것입니다. Serverless 컴퓨팅 Serverless 컴퓨팅은 클라우드 提供商이 응용 프로그램을 실행하기 위한 인프RASTRUCTURE를 자동으로 관리하는 클라우드 计算机 실행 모델입니다. 이 모델에서는 개발자는 코드를 写得 후, 클라우드 提供商이 서버를 运行, 扩展, 以及 mantain하는 것을 유치하므로 개발자는 서버 관리, 인프RASTRUCTURE 제공, 或者 扩展할 필요가 없습니다. “Serverless”이란 용어는 서버가 아닌 것이라고 해석되는 것이 아니라, 개발자에게 서버 관리 任务들이 abstraction되어 있다는 의미입니다. AWS Lambda는 Amazon Web…
-
타입스크립트에서 타입 프레디케이트란? 코드 예제로 설명
TypeScript에서의 형제이전제(type predicates)는 이해하기 어려운 구문적 특징입니다. 반환 형제annotation과 같은 곳에 나타나지만, 일반 annotation과 다르게 짧은 affirmative 문장처럼 보입니다. 이것은 형제 점검을 더욱 자주 사용하는 것입니다. TypeScript 5.5 릴리스 이후, 형제이전제를 사용하는 것이 더욱 直观적이었습니다. 많은 경우 자동으로 추론할 수 있습니다. 하지만 약간 더 老旧한 코드 베이스에 있으면, 亲手 写出한 형제이전제를 자주 만나게 됩니다. 이 記事에서는 간단히 형제이전제가 무엇인지 그리고 왜 유용한지 예시로 보여드릴 것입니다. 그렇다면 어느 문제를 해결하는지 보는 것이 좋습니다. 문제 형제이전제의 유용성을 이해하는 가장 좋은 방법은, 그들이…