전체 글

[Html,Css] 반응형 헤더 따라만들기

https://youtu.be/X91jsJyZofw *위 엘리님 영상을 보고 학습한 포스팅입니다. html Two Angel Home Gallery Sale FAQ Blog css body { margin: 0; font-family: Poppins Source Sans Pro; } a { text-decoration: none; color: #fff; } .navbar { display: flex; justify-content: space-between; align-items: center; background-color: #263343; padding: 8px 12px; } .navbar__logo { font-size: 24px; color: white; } .navbar__logo i { colo..

[자바스크립트] for문과 foreach 실전 예제 비교

for문 let tabs = document.querySelectorAll(".task-tabs div"); for (let i = 1; i menu.addEventListener("click", (event) => getNewsByTopic(event)) ); const getNewsByTopic = (event) => { console.log("클림됨", event.targe..

[타입스크립트] 팩토리 패턴

1번 방식 interface Shoe { purpose: string; } class BalletFlat implements Shoe { purpose = "dancing"; } class Boot implements Shoe { purpose = "woodcutting"; } class Sneaker implements Shoe { purpose = "walking"; } class ShoeFactory { static create(Type: "balletFlat" | "boot" | "sneaker"): Shoe { switch (Type) { case "balletFlat": return new BalletFlat(); break; case "boot": return new Boot(); break..

[자바스크립트] Array.from( {length} 구문에서 {length}은 유사배열?

https://velog.io/@teihong93/Array.from%EC%9D%84-%ED%86%B5%ED%95%9C-%EB%B0%B0%EC%97%B4%EC%9D%98-%EC%B4%88%EA%B8%B0%ED%99%94

[타입스크립트] 연습용으로 자주 사용하는 세팅

설치와 변환 한줄 요약 node.js 설치 → npm i -g typescript → tsconfig.json 생성 → tsc -w ts는 브라우저에서도 node에서도 읽히지 않는다. ts는 js 코드로 변환해주어야 한다. index.ts를 만들었다면 tsc index.ts 란 명령어를 입력 main.js란 파일이 새로 생성된다. 이 변환된 js는 이제 브라우저나 node에서 읽을 수 있다. ts를 js로 매번 수동 변환 tsc 파일명.ts 노드에서 간편하게 실행 ts-node 설치 명령어: 내부적으로 타입스크립트 코드를 자바스크립트 코드로 변환해서 노드에서 실행하는 것을 한번에 할 수 있도록 도와주는 툴 npm install -g ts-node 설치 후 가령 index.ts를 실행하고 싶다면 ts-no..

[타입스크립트] 타입스크립트 컴파일러(Typescript Compiler, TSC)

컴파일러 타입스크립트 컴파일러(Typescript Compiler, TSC) 타입스크립트는 자바스크립트나 자바 같은 주요 언어와는 다른 방식으로 동작 프로그램은 프로그래머가 작성한 다수의 텍스트 파일로 구성된다. 텍스트를 컴파일러가 파싱하여 추상 문법 트리(abstract syntax tree, AST)라는 자료구조로 변환 컴파일러가 AST를 바이트코드로 변환 런타임 프로그램에 2에서 변환된 바이트코드를 입력, 평가 후 결과얻음. 즉, 프로그램 실행이란, 컴파일러가 소스 코드를 파싱해 AST로 만들고, 다시 AST를 바이트코드로 변환한 것을 런타임이 평가하도록 지시하는 것 타입스크립트는 컴파일러가 소스 코드를 자바스크립트 코드로 변환한다(바이트코드X). 타입스크립트는 코드는 언제 안전해지는가. 타입스크립..

[타입스크립트] 한정된 다형성, 타입스크립트 프로그래밍 이진트리 예제 분석

본 포스팅 예제 미리보기 1. 타입스크립트 프로그래밍 예제 내가 풀어본 것(한 포인트 미스, 아직도 생성자에 화살표 함수 받아들이는게 어색...) type TreeNode = { value: string; }; type LeafNode = TreeNode & { isLeaf: true; }; type InnerNode = TreeNode & { children: [TreeNode] | [TreeNode, TreeNode]; }; let a: TreeNode = { value: "a" }; //통과 let b: LeafNode = { value: "b", isLeaf: true }; //통과 let c: InnerNode = { value: "c", children: [b] }; //통과 let a1 = ..