[Typescript] 19장 네임스페이스

1. 단일 파일 검사기타입스크립트는 기본적으로 하나의 파일로 작성된 네임스페이스를 지원하며, 이를 통해 네임스페이스 내의 모든 요소를 한번에 검사할 수 있습니다.namespace SingleFileNameSpace { export function greet(name: string) { console.log(`Hello, ${name}!`); }}SingleFileNameSpace.greet('John Doe'); // Hello, John Doe!2. 네임스페이스 적용하기네임스페이스를 사용하여 관련된 코드 조각을 그룹화할 수 있습니다. 예를 들어, 여러 함수와 클래스를 포함하는 네임스페이스를 만들 수 있습니다.namespace MathUtils { export function add(a: nu..

• format_list_bulleted TypeScript
• · 2025. 4. 7.
• textsms

[TypeScript] 18장 모듈

1. Export = 선언 export 하기타입스크릡트에서 export = 구문을 사용하기 위해 모듈을 내보낼 수 있습니다, 이 방식은 CommonJS 스타일의 모듈을 만들 때 주로 사용되는 방식입니다.function myFunction() { console.log('Hello, World');}export = myFunction;2. Export 문 (Export statements)여러 가지 요소를 내보내는 방법으로 export문을 사용합니다.export const number = 42;export function sayHello() { console.log('Hello');}sayHello();3. Re-export 하기 (Re-exports)다른 모듈에서 내보낸 요소를 다시 내보내는 방법입니다..

• format_list_bulleted TypeScript
• · 2025. 4. 1.
• textsms

[Typescript] 17장 믹스인

1. 믹스인타입스크립트에서 믹스인은 여러 클래스의 기능을 조합해 새로운 클래스를 만드는 패턴으로, 이를 통해 코드의 재사용성을 높여줍니다. 타입스크립트에서 믹스인을 구현하기 위해 먼저 함수를 정의합니다.function Mixin {}>(Base: T) { return class extends Base { mixinMethod() { console.log('Mixin method called'); } };}2. 믹스인 기본 클래스 정의먼저 믹스인이 결합될 기본 클래스를 정의해줍니다.class Robot { move() { console.log('Robot is moving!'); }} 다음은 믹스인을 적용해 새로운 클래스를 만들어줍니다. 믹스..

• format_list_bulleted TypeScript
• · 2025. 3. 27.
• textsms

[Sass] 3장 Nesting

1. Nesting (중첩) Sass의 중첩(Nesting)은 CSS 선택자를 더욱 직관적으로 작성할 수 있게 해주는 강력한 기능으로 부모 선택자 안에 자식 선택자를 중첩해 코드를 작성하면, 구조가 명확하고 유지보수가 쉬운 스타일 시트를 만들 수 있습니다. Go HTML CSS 2. Sass 중첩 코드 예시nav { ul { list-style: none; li { display: inline-block; a { text-decoration: none; color: red; &:hover { color: pink; } ..

• format_list_bulleted SASS
• · 2025. 3. 27.
• textsms

[Sass] 2장 기본 문법 - Sass 변수 사용법

1. 변수 정의하기Sass에서 변수를 정의하려면 $ 기호로 시작되며, 예를 들어 색상이나 폰트 크기 등을 변수로 정의할 수 있습니다.$primary-color: #3498db;$font-size: 16px;2. 변수 사용하기 정의한 변수를 CSS 속성에 사용할 수 있습니다.body { color: $primary-color; font-size: $font-size;}3.변수 재사용변수를 재사용하여 코드의 일관성을 유지하고 유지보수를 쉽게 할수 있습니다.$padding: 10px;.box { padding: $padding;}button { padding: $padding;}  GitHub - Koras02/sass-bloging: https://thinky.tistory.com/catego..

• format_list_bulleted SASS
• · 2025. 3. 25.
• textsms

[Typescript] 16장 JSX

1. 기본 사용법 (Basic Usage)JSX는 Javascript XML의 약자로, Javascript 코드 안에 HTML과 유사한 구문을 사용할 수 있습니다. React에서는 UI를 정의할 때 주로 사용합니다. 기본적인 JSX의 예시는 다음과 같습니다.const element = Hello, world!;2. Typescript에서 JSX 설정먼저 Typescript에서 JSX를 사용하기 위해 Typescript를 설치합니다. npm install --save-dev typescript React와 관련된 타입 정의도 설치합니다.npm install --save react react-domnpm install --save-dev @types/react @types/react-dom tsconfig...

• format_list_bulleted TypeScript
• · 2025. 3. 24.
• textsms