지식루프

[지식루프 IT공부] 자바스크립트로 태그 선택하기

이벤트 핸들러를 등록하는 2가지 방법 자바스크립트로 해당 DOM 객체의 onclick 프로퍼티에 등록하기 HTML 태그의 onclick 속성에 바로 표시하기

[지식루프 IT공부] document.querySelector와 document.getElementById 차이

자바스크립트에서 DOM(Document Object Model)을 조작할 때 자주 사용하는 메서드인 document.querySelector와 document.getElementById를 설명하고, 두 메서드의 차이점을 정리해볼게요.document.querySelector란?document.querySelector는 CSS 선택자(selector)를 사용해서 DOM에서 요소를 선택하는 메서드예요. 선택자에 맞는 첫 번째 요소를 반환합니다.사용법 const element = document.querySelector('선택자');선택자: CSS에서 사용하는 선택자 문자열 (예: '#id', '.class', 'tag', 'div > p' 등).반환값: 선택자에 맞는 첫 번째 요소(Element 객체)를 반환..

[지식루프 IT공부] 자바스크립트 변수 네이밍 가이드

자바스크립트 변수 네이밍 가이드변수 이름은 코드 가독성과 유지보수에 중요한 역할을 합니다.좋은 변수명은 직관적이며, 코드의 의도를 명확히 전달해야 합니다.아래 가이드를 따르면, 더 깔끔하고 읽기 쉬운 코드를 작성할 수 있습니다.1. 기본 원칙✅ 의미 있는 이름 사용❌ let a = 10; (X)✅ let userAge = 10; (O)목적이 분명한 이름을 선택해야 합니다.✅ 카멜케이스(Camel Case) 사용✅ let firstName = "Alice"; (O)❌ let first_name = "Alice"; (X) (파이썬 스타일)자바스크립트에서는 firstName처럼 소문자로 시작하고, 단어 연결 시 대문자를 사용하는 것이 일반적입니다.✅ 예약어 사용 금지let function = 10; (X)le..

[지식루프의 IT공부] 자바스크립트 자료형 정리

자바스크립트 자료형 정리 1. 기본형 (Primitive Type)문자열(String): let str = "Hello";숫자(Number): let num = 42; (정수, 실수 구분 없음, NaN, Infinity 포함)불리언(Boolean): let isTrue = true; (true / false)null: let empty = null; (의도적 비어있는 값)undefined: let notDefined; (값이 할당되지 않음)심볼(Symbol): let unique = Symbol('id'); (유일한 값 생성)BigInt: let bigNum = 123n; (정수 한계를 초과하는 큰 수)2. 객체형 (Object Type)객체(Object): { key: value } 형태 let obj..

git add -A 와 git add . 의 차이점Git에서 git add 명령어는 작업한 파일을 스테이징 영역(stage)에 추가하는 역할을 합니다.하지만 -A 옵션과 . 옵션은 적용 범위에서 차이가 있습니다.1. git add -A git add -A Tracked(추적 중인) 파일과 Untracked(추적되지 않은) 파일을 모두 스테이징함삭제된 파일도 스테이징됨 (즉, git rm을 하지 않아도 삭제된 파일이 반영됨)현재 디렉토리뿐만 아니라 프로젝트 전체(루트 디렉토리 포함)에서 변경된 모든 파일을 추가✅ 사용 예시 git add -A 프로젝트 전체에서 변경된 모든 파일을 추가새로 생성된 파일, 수정된 파일, 삭제된 파일까지 모두 반영2. git add . git add . 현재 디렉토리와 그 하위..

Git이란?컴퓨터에서 파일을 저장하고 바꾼 내용을 관리하는 일기장 같은 것입니다. 파일이 어떻게 변하는지 기억해두는 역할을 합니다.Git에서 파일이 변하는 과정파일들은 4가지 상태를 가질 수 있습니다.Untracked (추적되지 않음 - 회색)→ 새로운 파일을 만들었지만, Git이 아직 모르는 상태입니다. (Git한테 "이 파일을 기억해줘!"라고 말하지 않은 상태)Unmodified (수정되지 않음 - 초록색)→ Git이 알고 있는 파일이고, 최근에 바뀐 적이 없는 상태입니다. (안전하게 저장된 상태)Modified (수정됨 - 주황색)→ 파일을 수정했지만, 아직 Git에게 "이거 바뀌었습니다!"라고 말하지 않은 상태입니다.Staged (저장 준비됨 - 빨간색)→ 수정된 파일을 Git에게 "이거 저장할 ..

git pull과 git fetch는 Git에서 원격 저장소(remote repository)의 데이터를 로컬로 가져오는 명령어지만, 동작 방식과 결과가 다릅니다. 차이를 쉽게 정리해서 설명해드릴게요. 핵심 차이 git fetch: 원격 저장소의 데이터를 가져오기만 하고, 로컬 브랜치에는 적용하지 않음.git pull: 원격 저장소의 데이터를 가져오고(fetch) 바로 로컬 브랜치에 병합(merge)까지 함.자세한 차이특징git fetchgit pull동작원격 저장소의 최신 데이터를 로컬로 다운로드.원격 데이터를 가져오고, 로컬 브랜치에 병합까지.영향로컬 브랜치(예: main)는 그대로 유지.로컬 브랜치가 원격 브랜치와 동기화됨.결과물origin/브랜치명(예: origin/main)만 업데이트.로컬 브랜..

git fetch origin은 Git에서 원격 저장소(remote repository)에서 데이터를 가져오는 명령어입니다. 여기서 origin은 원격 저장소의 이름으로, 일반적으로 git clone을 통해 저장소를 처음 가져올 때 기본으로 설정됩니다. 이 명령어의 뜻과 동작을 간단히 풀어서 설명해드릴게요.뜻"원격 저장소(origin)의 최신 정보를 로컬로 가져오되, 내가 작업 중인 브랜치는 건드리지 말아줘."쉽게 말해, 원격 저장소에 어떤 변화가 있는지 확인하기 위해 데이터를 다운로드하는 겁니다. 하지만 로컬 브랜치(예: main)에 바로 적용하지는 않아요.어떻게 동작하나요?원격 저장소에서 정보 가져오기origin에 있는 브랜치, 커밋, 태그 등의 최신 데이터를 가져옵니다.예: 누군가 origin/ma..

$ git pullfatal: Not possible to fast-forward, aborting.  위 에러 메시지는 Git에서 git pull 명령어를 실행했을 때 발생하는 것으로, 현재 브랜치와 원격 브랜치 간의 변경 사항을 자동으로 빠르게 병합(fast-forward)할 수 없다는 뜻입니다. 이 문제는 주로 로컬 브랜치와 원격 브랜치가 서로 다른 커밋을 가지고 있어서 충돌이 발생하거나 병합이 필요한 상황에서 나타납니다. 아래 단계별로 해결 방법을 설명하겠습니다.1. 상황 파악하기먼저, 로컬과 원격 브랜치의 상태를 확인해야 합니다.bashWrapCopygit fetch origin git log HEAD..origin/브랜치명git fetch는 원격 저장소의 최신 정보를 가져오지만 로컬 브랜치를 ..

Figma 단축키 보기WindowsMac메뉴 숨기기/보기Ctrl + \Cmd + \안내선 보기/숨기기Shift + RShift + R기본 툴WindowsMac선택/이동하기VV텍스트TT원OO사각형RR프레임FF　　　선택/그룹WindowsMac여러 요소 선택Shift + 클릭Shift + 클릭색 선택 (아이드로퍼)II그룹/프레임 내 요소 선택Ctrl + 클릭Cmd + 클릭전체 선택Ctrl + ACmd + A그룹Ctrl + GCmd + G그룹 해제Shift + Ctrl + GShift + Cmd + G프레임으로 만들기Alt + Ctrl + GOption + Cmd + G　　　커서WindowsMac요소 간격 확인하기Alt + 호버Option + 호버요소 복제하기Alt + 드래그Option + 드래그중간을 기준으로..