본문 바로가기

분류 전체보기

 (101)
[Git] git add -A vs git add (디렉토리 구조 변환 중) git add -A .현재 디렉토리 기준 전체 변경 사항을 정확하게 반영해서 스테이지에 올리는 명령. 삭제된 파일까지 함께 처리되기 때문에 커밋 상태를 깔끔하게 동기화할 수 있는 게 장점.🔍 비교: git add -A . vs git add .명령어설명삭제 파일 포함 여부git add .변경/추가된 파일만 스테이징❌ 삭제 파일 반영 안 됨git add -A .변경/추가/삭제된 모든 파일을 스테이징✅ 삭제 파일 반영됨 ✅ 깔끔한 커밋 상태 유지란?디렉토리 구조 리팩토링(FSD 구조 정리, 폴더 이동 등)을 할 경우,파일이 삭제 + 새로 생성되는 것처럼 처리되기 때문에, 삭제된 파일도 스테이지에 올려야 진짜 구조 변경이 정확하게 커밋됩니다.예시:# 변경 전src/components/Header.js# 변경..
[Git] 작업 도중, 실수로 이전 커밋 관련한 작업물을 올리지 못했을 때 git add git commit --amend git show --only-name: 이전 커밋의 파일명 확인 가능. 실수로 이미 push를 해버렸다면?.git add git commit --amend git push --force-with-lease origin force없이 push 하려고 한다면?🔍 오류 핵심 요약non-fast-forward 오류는 로컬의 커밋 해시가 원격의 HEAD와 달라졌는데,--force 없이 push 하려고 해서 Git이 거부한 것 amend를 하면 커밋 메시지가 변경되지 않아도 해시는 변경되기에, PR에 올라간 마지막 commit(HEAD)와 로컬의 amend한 커밋은 다름.➡️ 그래서 amend는 이전 커밋을 새 커밋으로 "덮어쓴 것처럼 보이지만 실제로는 완전..
[re-poompoom] FSD 디렉토리 구조 적용 중, 역할 기준 폴더에 관하여 ✅ atoms/, molecules/, organisms/ 구조의 배경이건 Atomic Design 패턴에 기반한 UI 계층 구조입니다.계층설명예시atoms가장 작은 단위의 UIButton, Input, Labelmolecules2개 이상의 atom 조합Input + Labelorganisms섹션 단위 구성 요소Header, Footer, Form ➡️ 이 구조는 UI 재사용성, 디자인 시스템 구성에 유리하지만➡️ 실제 비즈니스 로직과 도메인 흐름과는 분리되어 있어서, 복잡해질 수 있습니다. ✅ FSD에서 이걸 어떻게 해결하나?FSD는 UI 계층보다 **도메인 관심사(domain-centric)**를 기준으로 나눕니다.범위위치예시특정 feature 안에서만 쓰임features/review/ui/Butt..
[Web] 디스플레이 해상도에 따른 실 사용자 뷰포트 고려 ✅ 디자인 툴 vs 실제 브라우저 화면 차이항목디자인 툴 (Figma 등)실제 브라우저 (PC 기준)해상도1440×1024, 1920×1080 등 프레임 기준대부분 1366×768, 1920×1080 등사용 가능 높이전체 해상도 기준주소창 + 북마크바 + 탭바 등으로 약 150~200px 손실실제 뷰포트 높이1080px 기준 약 800~900px 정도(노트북은 768px 이하도 빈번)예시: 1920×1080 모니터 기준, 브라우저 크롬(주소창, 탭 등)을 제외하면, 실제 뷰포트는 약 890~920px 수준.=> 실제 브라우저에서의 뷰포트 높이는 디자인 프레임보다 상당히 작다. ✅ 실무 기준: 실제 사용자 높이 기준은?UI/UX 디자이너나 퍼블리셔는 보통 세로 기준 800px 또는 900px을 최소 기준 ..
[프로젝트 회고] STDev 해커톤 1. 피그마 SVG Export할 때는 Frame으로 감싸주고, 바로 밑에 하나의 벡터 이미지가 존재하도록. 2. Vite에서 SVG 사용할 때, 로컬에서는 잘 되는데 배포 환경에서 안되는 경우. import { ReactComponent as Logo } from './logo.svg'; // 이건 CRA 방식 Vite는 기본적으로 CRA 방식을 지원하지 않으므로 vite-plugin-svgr를 설치해야 합니다.npm install vite-plugin-svgr// vite.config.ts or vite.config.jsimport { defineConfig } from 'vite';import svgr from 'vite-plugin-svgr';import react from '@vitejs/plu..
[Python] 진수 변환 bin(), oct(), hex()는 "정수(int)를 문자열(string)로 변환"하는 함수고,int(문자열, 진수)는 "문자열(string)을 정수(int)로 변환"하는 함수입니다.1. 핵심 차이 정리함수목적예시결과 타입bin(x)10진수 int → 2진수 문자열(str) 변환bin(10) → '0b1010'문자열(str)oct(x)10진수 int → 8진수 문자열(str) 변환oct(10) → '0o12'문자열(str)hex(x)10진수 int → 16진수 문자열(str) 변환hex(10) → '0xa'문자열(str)int(str, base)문자열(str, 주어진 진수) → 10진수 int 변환int('1010', 2) → 10정수(int)✅ 요약:bin, oct, hex → int → str 변환..
[코테] 정렬 헷갈림 2. sorted() vs sort() 차이두 함수는 목적은 같지만 방식이 다릅니다.항목sorted()sort()동작 대상아무 이터러블(iterable) 가능 (리스트, 튜플, 문자열 등)리스트 객체만 가능리턴 값새로운 정렬된 리스트 반환제자리(in-place) 정렬, 리턴값은 None원본 수정 여부원본 리스트 수정 안 함원본 리스트를 수정함사용 가능 대상리스트, 튜플, 이터레이터 등리스트만 가능
[re-poompoom] poompoom 개선 ✅ 프로젝트 도중 발생한 애로사항1. container/presenter/styles 구조 적용에 대한 애로사항1-1. 파일 구조 불일치 문제 발생1-2. 3가지 그룹으로 분리하기 애매한 컴포넌트 발생( 작은 컴포넌트에선 과도한 분리가 부담 )1-3. 파일 이름이 길고 반복됨.=> 관심사의 분리(SoC: Separation of Concerns)라는 목적은 분명히 장점이 있으나, Presenter는 Container 없이도 다양한 페이지에서 재사용 가능하다는 등 재사용성과 작업 기한에 무리가 있어, PostCard/Container.tsx 같이 역할을 구분하여 개선하였다. 2. 폴더 구조가 중구난방이어서 이해하기 어려운 애로사항=> 도메인 기준으로 폴더를 분리하여 FSD 방식으로 구조화하였다. 3. ✅..

티스토리툴바