전체 글

키워드상황스택- 쌍이 맞는지- 최근- 무언가를 저장하고 반대로 처리해야 할 때- 데이터의 조합이 균형을 이루어야 할 때- 알고리즘이 재귀 특성을 가질 때- 최근 상태 추적큐- 순서대로- ~대로 동작하는 경우- 스케줄링- 최소 시간- 특정 조건에 따라 시뮬레이션 할 때- 시작 지점부터 목표 지점까지 최단 거리깊이 우선 탐색- 모든 경로- 메모리 사용량이 제한적일 때의 탐색- 백트래킹 문제를 풀 때너비 우선 탐색- 최적- 레벨 순회- 최소 단계- 네트워크 전파- 시작 지점 부터 최단 경로나 최수 횟수를 찾아야 할 때백트래킹- 조합- 순열- 부분 집합- 조합 및 순열 문제- 특정 조건을 만족하는 부분 집합최단 경로- 최단 경로- 최소 시간- 최소 비용- 트래픽- 음의 순환- 단일 출발점 경로- 다익스트라: 특..

JavaScript는 1995년 넷스케이프(Netscape) 사에서 브랜든 아이크(Brendan Eich) 가 단 10일 만에 개발한 것으로 유명합니다.이렇게 짧은 시간 안에 만들어진 이유는, 당시 브라우저에서 경량의 스크립트 언어가 필요했기 때문입니다.초기에는 “Mocha”라는 이름으로 개발되었으며, 이후 “LiveScript”를 거쳐 JavaScript라는 이름으로 변경되었습니다. 1996년, 마이크로소프트는 넷스케이프의 JavaScript를 리버스 엔지니어링하여 JScript를 개발했고,이를 자사 브라우저인 Internet Explorer(IE) 에 탑재하면서 브라우저 간의 표준 차이로 인해 비호환성 문제가 발생하게 되었습니다. 이에 따라 1997년 ECMA(European Computer Manu..

XSS와 SQL Injection: 왜 실행될까?💡 핵심 질문:"유저 입력에 JavaScript 코드나 SQL 문을 넣는다고 해서, 이게 클라이언트나 서버에서 실행될 수 있는가?"✅ 답변: 실행될 수 있음.XSS는 클라이언트(브라우저)에서 실행되는 문제SQL Injection은 서버(DB)에서 실행되는 문제둘 다 입력값을 제대로 처리하지 않으면 악성 코드가 실행될 수 있음.1️⃣ XSS (Cross-Site Scripting) → 클라이언트에서 실행됨XSS가 발생하는 이유:브라우저는 HTML을 렌더링할 때, 스크립트(이 값이 그대로 데이터베이스에 저장됨이후, 다른 사용자가 이 페이지를 방문할 때 저장된 악성 스크립트가 브라우저에서 실행됨📌 왜 실행될까?서버가 입력값을 필터링 없이 그대로 HTML로 반..

자바스크립트의 덕 타이핑(Duck Typing) 개념덕 타이핑(Duck Typing)은 객체의 실제 타입이 아니라, "어떤 속성과 메서드를 가지고 있는지"에 따라 타입을 결정하는 개념입니다. 📌 철학:"오리처럼 걷고, 오리처럼 꽥꽥거린다면, 그것은 오리다." 🦆즉, 객체의 타입을 확인할 때 클래스나 명시적인 타입 정보가 아니라, 객체가 특정 속성이나 메서드를 가지고 있는지를 기준으로 판단합니다.자바와 자바스크립트의 차이자바 (명시적 타입 시스템)객체가 특정 클래스에서 상속받거나 인터페이스를 구현해야 해당 타입으로 간주됨클래스 이름이 다르면, 같은 속성을 가지고 있어도 다른 타입으로 인식됨자바스크립트 (덕 타이핑 기반의 동적 타입 시스템)특정 클래스에서 파생되지 않아도 속성과 메서드만 맞으면 해당 타입..

1. XSS(Cross-Site Scripting) 방어💡 문제:사용자가 입력한 HTML 태그를 그대로 렌더링하는 취약점 발견 (Stored XSS)URL 파라미터에서 자바스크립트 실행이 가능한 이슈 발견 (Reflected XSS)✅ 해결 방법:React에서 기본적으로 dangerouslySetInnerHTML을 사용하지 않도록 하고, DOMPurify를 적용해 안전한 HTML만 허용서버에서 Content-Security-Policy (CSP) 헤더를 추가하여 악성 스크립트 실행 방지escape()를 적용해 HTML 인코딩 처리📌 예제 코드 (DOMPurify 적용)import DOMPurify from "dompurify";const sanitizedHTML = DOMPurify.sanitize(..

HTTP란 무엇인가?HTTP(HyperText Transfer Protocol)는 클라이언트-서버 간의 요청/응답을 처리하는 프로토콜입니다.HTTP는 클라이언트와 서버 간의 요청-응답을 처리하는 애플리케이션 계층 프로토콜입니다. 기본적으로 stateless하며, 요청 방식(메서드)과 응답 코드, 헤더, 바디 등의 개념을 포함합니다. GET, POST, PUT, DELETE 같은 메서드를 사용해 리소스를 요청하고 조작합니다. 또한, HTTP/1.1, HTTP/2, HTTP/3 등의 버전이 있으며 성능과 보안 측면에서 차이를 보입니다.주요 개념HTTP의 특징Stateless (기본적으로 상태를 유지하지 않음)Request-Response 구조메서드(GET, POST, PUT, DELETE 등)와 역할HTTP..

추상화(Abstraction)란?추상화는 코드의 복잡성을 줄이기 위해 핵심적인 기능만 노출하고, 불필요한 세부 사항을 숨기는 개념입니다. 예를 들어, 자동차를 운전할 때 내부 엔진 동작을 몰라도 '엑셀을 밟으면 가속된다'는 것만 알면 됩니다. 프로그래밍에서도, 함수나 클래스가 내부 로직을 감추고 인터페이스만 제공하면, 더 쉽게 이해하고 유지보수할 수 있습니다. 복잡성을 줄이고, 사용자가 필요한 정보만 보이도록 설계내부 구현을 숨기고, 인터페이스만 제공하여 유지보수성을 향상**객체지향 프로그래밍(OOP)에서 핵심 원칙 중 하나 ✅ 추상화의 핵심 역할 → "불필요한 세부 사항을 숨기고, 핵심 기능만 제공"✅ 쉽게 이해할 수 있는 비유 → "자동차의 가속 원리를 몰라도 운전 가능"✅ 실제 코드 적용 가능성 →..

📌 Trunk-Based Development vs GitHub Flow 차이점둘 다 가벼운 브랜치 전략으로, 빠른 배포를 목표로 합니다. 하지만 몇 가지 중요한 차이가 있습니다.🚀 1. Trunk-Based Development (TBD)✅ 핵심 개념:main 브랜치(=Trunk)에서 직접 개발하고,짧은-lived feature 브랜치만 사용하며,하루에도 여러 번 main에 머지하는 방식.✅ 특징:브랜치는 짧게 유지 → 몇 시간 또는 하루 이내 병합Long-lived feature 브랜치 없음 → develop 브랜치 XCI/CD 필수 → main에 병합 시 항상 배포 가능 상태 유지✅ 워크플로우:main에서 직접 개발하거나 짧은-lived 브랜치 생성빠르게 개발 후 main에 머지CI/CD가 ma..

애자일 방법론(Agile Methodology)이란?애자일(Agile) 방법론은 빠른 개발과 지속적인 개선을 목표로 하는 소프트웨어 개발 방식입니다.고객의 요구 사항 변화에 유연하게 대응하고, 반복적인 개발과 피드백을 통해 품질을 개선하는 것이 핵심입니다.🛠 애자일 방법론의 핵심 개념반복적(Iterative) 개발 → 짧은 주기로 기능을 추가 및 개선고객 중심(Customer Collaboration) → 고객 피드백을 지속적으로 반영자율적인 팀(Self-organizing Team) → 개발팀이 주도적으로 의사결정변화 수용(Embrace Change) → 계획보다 적응을 중요하게 생각작동하는 소프트웨어(Working Software) → 문서보다 실제 동작하는 제품을 우선📜 애자일 선언(Agile ..

React의 Synthetic Event란?Synthetic Event(합성 이벤트)는 React가 브라우저의 기본 이벤트를 감싸서 제공하는 래퍼(wrapper) 객체입니다.즉, 브라우저 이벤트를 추상화한 React만의 이벤트 시스템입니다. React에서 이벤트 핸들러를 사용할 때 onClick, onChange 같은 속성을 JSX에서 작성하면, 내부적으로 Synthetic Event가 생성되어 브라우저의 native event를 감싸게 됩니다.1. Synthetic Event가 필요한 이유 ✅ 브라우저 간 호환성 유지React는 모든 이벤트를 자체적으로 관리하므로, 브라우저마다 이벤트 동작이 다르게 구현되는 문제를 해결할 수 있습니다.✅ 성능 최적화이벤트 리스너를 개별 DOM 요소에 붙이는 것이 아니라..