본문 바로가기

분류 전체보기243

TypeScript 학습 체크리스트 - 컴파일러 개념 및 tsc 용도, 주요 명령어 TypeScript 학습 체크리스트 - 컴파일러 개념 및 tsc 용도, 주요 명령어 TypeScript 강의 수강 후 숙지 및 개념 정리하기 위해 체크리스트와 함께 배웠던 개념들을 정리합니다. TypeScript 개념 체크리스트 ✅ ✅ 컴파일러의 개념에 대해서 공부하고 tsc를 어떻게 사용하는지 파악합니다. 컴파일러 개념 및 tsc 용도 컴파일러란 특정 프로그램 언어가 정적언어로서의 정체성을 유지할 수 있도록 하는 도구를 말합니다. 프로그래밍 언어 작성 코드 → 다른 프로그래밍 언어로 변환 이러한 변환 과정 속에서 컴파일러는 소스 코드의 구문과 구조를 검사하면서 문제가 없는지 확인합니다. 이를 통해 개발자는 작성한 코드의 오류를 찾아낼 수 있으며 문제를 해결할 수 있습니다. 컴파일러 특징 컴파일러 중 T.. 2023. 12. 21.
TypeScript 객체지향 설계 원칙 SOLID 설명, 예시 코드 TypeScript 객체지향 설계 원칙 SOLID TypeScript 객체지향 설계시 SOLID 원칙을 지켜 작성해야합니다. 이렇게 함으로써 프로그램이 유연해지고, 확장 가능하며, 이해하기 쉬운 구조를 가지게 됩니다. 아래 글에 소개하는 SOLID 원칙을 보며 효율적인 객체지향 설계에 많은 인사이트가 되시길 바랍니다. SOLID 제1원칙 S (SRP. 단일 책임 원칙) 클래스는 하나의 책임만을 가져야 한다는 매우 기본적인 원칙입니다. SOLID의 5가지 설계 원칙 중 가장 기본적이고 중요한 원칙입니다. 쉽게 말해 클래스 하나에는 하나의 기능만을 수행해야 합니다. 잘못된 예시 UserService 클래스 안에 갑자기 뜬금없이 이메일 전송하는 로직이 들어있습니다. 이는 UserService와는 관련없는 기능.. 2023. 12. 20.
JavaScript 명시적 this 바인딩, apply 메소드 쉽게 배우기 - 예시 코드 제공 JavaScript 명시적 this 바인딩, apply 메소드 쉽게 배우기 - 예시 코드 제공 자바스크립트에서 this 키워드의 동작은 함수가 어떻게 호출되느냐에 따라 다르게 작동합니다. 명시적으로 this를 바인딩하려면 apply 메소드를 사용할 수 있습니다. 이 글에서는 apply 메소드와 그 차이점을 살펴보고, 예시 코드를 통해 이해하겠습니다. apply 메소드란 무엇인가? apply는 모든 함수 객체에서 사용 가능한 메소드로, 함수를 호출하면서 this를 특정 객체로 명시적으로 바인딩하는 데 사용됩니다. call과 유사하지만 매개변수를 배열 형태로 받는 점이 다릅니다. apply 메소드의 사용법 apply 메소드를 사용하면 함수를 호출하면서 this를 특정 객체로 바인딩하고, 함수의 매개변수를 배.. 2023. 12. 19.
내일배움캠프 백오피스 프로젝트 - 펫시터 매칭 사이트 후기, 소감 내일배움캠프 백오피스 프로젝트 - 펫시터 매칭 사이트 후기, 소감 일주일간 팀원과 작업한 펫시터 매칭 사이트가 끝났습니다. 여러 우여곡절이 있었지만 목표한 대로 마쳤기에 만족하고 있습니다. 작업과정과 후기, 튜터님께 받은 피드백과 소감에 대해 소개하겠습니다. 펫시터 매칭 사이트 소개 간략히 설명하면 펫시터 매칭 사이트는 반려동물 키우는 사람들을 위한 사이트로, 반려동물을 대신 돌봐주는 펫시터를 매칭하는 서비스 입니다. 개발환경 프로그래밍 언어 : javascript (Node.js) 프레임워크 : Express.js 데이터베이스 : AWS RDS, Firebase Storage 버전 관리 시스템 : Git 개발 도구 : Visual Studio Code 협업 도구 : Slack, Notion 배포 환경 .. 2023. 12. 18.
JavaScript 명시적 this 바인딩, call 메소드 쉽게 배우기 - 예시 코드 제공 JavaScript 명시적 this 바인딩, call 메소드 쉽게 배우기 - 예시 코드 제공 자바스크립트에서 this 키워드는 함수가 어떻게 호출되는지에 따라 다르게 동작합니다. 이러한 동작을 이해하고 this를 명시적으로 바인딩하려면 call 메소드를 사용할 수 있습니다. 이 글에서는 call 메소드의 개념, 사용법 및 예시 코드를 통해 자세히 살펴보겠습니다. call 메소드란 무엇인가? call은 모든 함수 객체에서 사용할 수 있는 메소드로, 함수를 호출하는 동안 this를 특정 객체로 명시적으로 바인딩하는 데 사용됩니다. call 메소드 사용법 call 메소드를 사용하면 함수를 호출하면서 명시적으로 this를 지정할 수 있습니다. 아래는 기본적인 사용법입니다. function greet(name) .. 2023. 12. 17.
JavaScript 콜백 지옥 해결법 - Promise, async/await 사용법 소개 JavaScript 콜백 지옥 해결법 - Promise, async/await 사용법 소개 자바스크립트에서 비동기 프로그래밍을 다룰 때 가장 흔히 마주치는 문제 중 하나는 콜백 지옥입니다. 이 문제를 해결하기 위해 등장한 Promise와 async/await은 코드를 더 읽기 쉽게 만들고 비동기 코드를 관리하기 쉽게 합니다. 이 글에서는 Promise와 async/await의 개념, 사용법, 그리고 실제 코드에서의 활용을 예시와 함께 살펴보겠습니다. Promise란 무엇인가? Promise(약속) 는 자바스크립트에서 비동기 코드를 다루는 객체입니다. 이것은 비동기 작업이 완료되면 또 다른 동작을 수행하도록 예약된 객체로 생각할 수 있습니다. Promise의 사용법 Promise를 사용하면 다음과 같이 코.. 2023. 12. 16.
부트스트랩 달력 특정일자 비활성화 하는 방법 bootstrap datepicker 부트스트랩 달력 특정일자 비활성화 하는 방법 bootstrap datepicker 부트스트랩에서 달력을 사용하다가 특정일자 비활성화를 해야하는 일이 생겼습니다. 다른 서비스에서는 여러 보긴 했지만 부트스트랩에서도 사용할 수 있는지 궁금했는데 찾아보니 비활성화 할 수 있는 방법이 있었습니다. 이번 글에서는 부트스트랩 달력에 특정일자를 비활성화 하는 방법에 대해 소개하겠습니다. 부트스트랩 달력 특정일자 비활성화 하는 방법 부트스트랩 달력을 커스텀하기 위해서는 datepicker를 활용해야 합니다. 활용하기 위해서는 bootstrap-datepicker 파일을 프로젝트 내에 추가한 후 사용해야 합니다. GitHub - uxsolutions/bootstrap-datepicker: A datepicker for .. 2023. 12. 15.
prisma onDelete 다양한 옵션 소개, 사용 예시 prisma onDelete 다양한 옵션 소개, 사용 예시 psima를 활용하여 데이터베이스에서 릴레이션을 삭제할 때, Cascade, SetNull, SetDefault, Restrict, 그리고 NoAction과 같은 다양한 옵션을 사용하여 어떤 동작을 취할지 결정하는 것은 상당히 중요한 과제입니다. prisma onDelete 다양한 옵션 Cascade: 연쇄적 삭제 Cascade 옵션은 참조된 레코드가 삭제될 때, 해당 레코드와 연결된 모든 레코드를 자동으로 삭제하는 옵션입니다. 이는 종속적인 데이터를 간편하게 관리할 수 있도록 해줍니다. 아래는 Prisma에서의 Cascade 사용 예시입니다. model Author { id Int @id @default(autoincrement()) name .. 2023. 12. 14.
JavaScript 콜백함수 사용법, 콜백 지옥, 에러 처리, 관련 소스 코드 JavaScript 콜백함수 사용법, 콜백 지옥, 에러 처리, 관련 소스 코드 자바스크립트에서 콜백 함수는 중요한 개념 중 하나로, 비동기 프로그래밍과 이벤트 처리에서 주요 역할을 합니다. 이 글에서는 콜백 함수의 개념, 사용법, 그리고 다양한 활용 사례를 예시 코드와 함께 살펴보겠습니다. 콜백 함수란 무엇인가? 콜백 함수는 다른 함수의 인자로 전달되고, 해당 함수의 실행이 완료된 후에 호출되는 함수를 가리킵니다. 이것은 자바스크립트에서 비동기 작업을 다루고, 이벤트 처리 및 타이머와 같은 상황에서 특히 유용합니다. 콜백 함수의 사용법 콜백 함수는 주로 다음과 같이 사용됩니다. function doSomethingAsync(callback) { // 비동기 작업 수행 setTimeout(function(.. 2023. 12. 13.

티스토리툴바