전체 글

innerHTML vs innerAdajcentHTML() 비교

innerHTML vs innerAdajcentHTML() 비교 둘 다 HTML 내용을 다룰 때 쓰이는 가장 일반적인 방법 중 하나이다. innerHTML 은 프로퍼티의 형태로 쓰이고 innerAdjacentHTML() 은 메서드의 형태로 쓰인다. innerHTML 프로퍼티 HTML 의 getter 혹은 setter 의 역할을 하는 인터페이스이다. 내용을 가져올 수도 있고 내용을 삽입할 수도 있다. 장점 직관적이고 사용하기 쉽다. 내부 내용 전체를 대체해야 할 때 유용하다. 단점 엘리먼트 내부 전체 내용을 지웠다가 새로 렌더링 해야 하는 만큼 비용이 크다. 사용자가 작성한 내용을 innerHTML 로 더해주는 코드가 있다면 XSS 공격에 취약해진다. innerAdjacentHTML() 메서드 전달된 텍스..

스케폴딩 교육이란?

스케폴딩 교육이란? Scaffolding (비계) 학습 독립성을 키우는데 도움이 되는 교육 방식이다. 레프 비고츠키의 근접발달영역 (Zone of Proximal Development) 에서 영감을 얻었다. 핵심은 학생이 독립적으로 성취할 수 있는 것과 지식을 가진 사람의 지도를 통해 성취할 수 있는 것의 차이를 이용하는 것이다. 공사할 때 처음엔 비계의 도움을 받다가 이후엔 차례로 비계를 제거해 나가는 과정과 흡사하다. 자전거에 처음엔 보조바퀴를 달았다가 나중엔 보조바퀴를 제거하고도 탈 수 있는 것과 흡사하다. 어떻게 진행되는가? 학생의 현재 수준을 평가한다. 시험, 직접적인 관찰, 대화를 통해 현재 학생의 스킬이나 능력을 평가한다. 다음으로 무엇을 배워야 할지 식별한다. 학생의 현재 지식 수준을 조금..

입력 값 집합 검증 및 출력 값 검증 프레임워크란?

입력 값 집합을 논리적으로 좁히고 출력 값을 검증하는 프레임워크 보통 숫자 값을 입력할 때 유용한 테스트 프레임워크이다. 세금을 낼 때 소득 구간에 따라서 세금의 퍼센티지가 달라지는 것을 예제로 사용하기 적당하다. 동등 클래스 분할 (Equivalence class partitioning) 동일하거나 유사한 결과가 나오는 입력 값을 파티션 클래스로 분할하고 하나의 샘플 입력만 선택하여 전체 기능을 테스트한다. 세금을 계산해주는 프로그램을 예시로 든다면 아래의 입력을 갖는 테스트를 고루 만들면 된다. 5000만원 이상 ~ 8800만원 이하 8800만원 초과 ~ 1억 5천만원 이하 1억 5천만원 초과 ~ 3억원 이하 부정적 테스트 케이스도 이렇게 클래스로 분할할 수 있다. 음수 (숫자의 크기와 상관없이 일단..

오류 추측 프레임워크란?

오류 추측 프레임워크 분석력과 논리적인 사고력을 통해 탐색하는 프레임워크이다. 통합 실패, 입력 유효성 검사 실패, 경계 케이스 문제와 같이 일반적으로 발생할 수 있는 실패를 과거의 경험과 기술에 관한 이해를 기반으로 예측하는 것이다. 일반적인 오류 유형 예시 잘못된 값, 빈 값에 대해 유효성 검사 누락 및 적절한 오류 메세지가 없는 경우 기술 및 비즈니스 오류에 대해 적절한 HTTP 상태 코드가 반환되지 않는 경우 도메인, 데이터 유형, 상태 등에 따라 경계 조건이 처리되지 않은 경우 서버 다운, 응답시간 초과 등에 대해 오류 처리를 하지 않은 경우 페이지 전환, 데이터 새로고침 중 UI 문제가 발생하는 경우 like, equals 와 같은 SQL 키워드를 혼용해서 사용해 결과가 변경되는 경우 오래된 ..

독립적인 변수와 대규모 데이터셋 처리 프레임워크란?

독립적인 변수와 대규모 데이터셋 처리 프레임워크 페어와이즈 테스트 다양한 입력값의 조합을 관리함 독립적인 변수/입력에서 결과를 도출할 때 테스트 케이스 최소화에 도움이 되는 프레임워크이다. 장치 제조업체, 해상도, OS 의 조합이 각각 아래와 같다고 가정해보자 삼성, 구글, 오포 Small, Medium, Large 안드로이드, 윈도우 모든 경우를 테스트하면 총 경우의 수가 18개가 나온다. 안드로이드 * 사이즈 3종 * 제조업체 3종 구글 * 사이즈 3종 * 제조업체 3종 여기서 [구글, Medium], [구글, 윈도우] 쌍은 한번만 검증하는 방식으로 테스트 케이스를 줄일 수 있다. 총 경우의 수가 9개로 줄어든다. 샘플링 동등 클래스 분할을 적용하기 어렵고, 페어 와이즈 테스트도 적용하기 어려운 경우..

시각화 테스트 프레임워크란?

시각화 테스트 프레임워크 프레임워크를 이용해 테스트 케이스를 시각화할 수 있다. 상태 전환 입력 기록을 기반으로 애플리케이션의 작동이 변경되는 상황에서 테스트 케이스를 도출하는데 유용 로그인 페이지는 사용자가 잘못된 비밀번호를 3번 입력하면 계정이 잠김 전환 트리를 그려서 테스트 케이스를 도출할 수 있다. 각 노드는 애플리케이션의 상태이다. 시작 상태, 상태 변경 작업, 예상 결과를 명확하게 표현할 수 있다. 도메인에 따라 상태의 종류는 많이 복잡해질 수 있다. 결정 테이블 결과를 산출하기 위한 입력이 논리값인 경우 결정 테이블로 시각화 가능하다. 모든 입력 조합과 예상 출력을 미리 표시해볼 수 있다. 경우의 수를 미리 알 수 있다. 인과관계 그래프 논리적으로 연결된 입력/출력을 시각화한다. 분석단계에서..

8가지 탐색적 테스트 프레임워크란?

탐색적 테스트 프레임워크란? 기능을 이해하고 구조화하여 테스트 범위를 좁힌다. 입력을 논리적으로 샘플링하거나 비즈니스 규칙을 구조화하여 다양한 사용자 흐름과 테스트 케이스를 분류한다. 동등 클래스 분할, 경곗값 분석, 상태 전환, 결정 테이블, 인과관계 그래프, 페어 와이즈 테스트, 샘플링, 오류 추측 과 같은 8가지 기본적 테스트 프레임워크가 존재한다. 테스트 프레임워크 종류 입력 값 검증 및 출력 값 검증 프레임워크 시각화 테스트 프레임워크 독립변수 및 대규모 데이터셋 처리 프레임워크 오류 추측 프레임워크

시스템 테스트 (System Test) 란?

시스템 테스트 (System testing) 란? 전체 시스템 혹은 애플리케이션을 전체적으로 평가한다. 지정된 요구사항이 충족되는지 확인한다. 의도한 환경에서 올바르게 작동하는지 확인한다. 전체 시스템이 사용자 및 이해관계자의 요구사항을 충족하는지 확인하는 것이 목적이다. 보통 통합 테스트 후, 인수 테스트 전에 진행된다. 모든 컴포넌트, 모듈 및 외부 시스템 (DB, API, 타사 서비스) 을 포함하여 시스템을 E2E 로 테스트하는 작업이 포함된다. 시스템 테스트는 프로덕션 환경과 매우 유사한 별도의 테스트 환경에서 수행되는 경우가 많다. 시스템 테스트의 주요 관점 기능 테스트: 시스템이 기능 요구사항을 충족하고 의도한 기능을 올바르게 수행하는지 확인한다. 비기능 테스트: 시스템의 성능, 안정성, 보안..

통합 테스트 (Integration Test) 란?

통합 테스트 (Integration testing) 란? 애플리케이션의 여러 컴포넌트 혹은 모듈간의 상호작용과 조정을 검증하는데 중점을 둔 소프트웨어 테스팅 유형이다. 유닛 테스트에서 테스트된 유닛들이 결합되었을 때 올바르게 작동되는지를 확인한다. 데이터 통신, 데이터 공유, 컴포넌트간 전반적 제어 흐름에 관련된 문제를 식별하는데 도움이 된다. 분산 시스템, Micro Service Architecture (MSA), 타사 API 등에 의존하는 서비스 애플리케이션을 테스트할 때 중요하다. 개발 프로세스에서 보통 단위 테스트 후 시스템 테스트 전에 수행된다. 자동화 가능한 테스트 영역이다. 통합 테스트의 주요 관점 컴포넌트 상호작용: 예상대로 통신하고 데이터를 공유하는지 확인한다. API 및 서비스 유효성..

유닛 테스트 혹은 단위 테스트 (Unit test) 란?

유닛 테스트 (Unit Test, 단위 테스트) 란? 말 그대로 유닛 혹은 컴포넌트와 같이 애플리케이션에서 가장 작은 단위가 정상적으로 동작하는지 확인하는 단계이다. 함수, 메서드, 클래스 등을 말한다. 주요 목적은 각 유닛이 제대로 동작하는지 검증하고 개발 프로세스 초기에 버그를 포착하는 것이다. 개발자가 직접 작성하며 개발 및 빌드 프로세스 중에 자동으로 실행된다. DB 나 네트워크 같은 외부 종속성 없이 독립적으로 실행될 수 있도록 격리되어야 한다. 이 격리 때문에 매우 빠른 테스트가 가능하고 쉽게 수정할 수 있다. 유닛 테스트의 특징 빠르다. 독립적이다. 외부 종속성에 의존해선 안 된다. 반복 가능하다. 명확하고 간결하다. 유닛 테스트의 장점 조기 버그 발견 커다란 모듈 전체를 돌렸을 때 버그를 ..

인수 테스트 혹은 수락 테스트 (Acceptance Test) 란?

인수 테스트 혹은 수락 테스트라 불리는 Acceptance test 란? 소프트웨어 개발 프로세스에서 최종 사용자 혹은 이해관계자가 지정한 요구 사항을 충족하는지 확인하기 위해 시스템을 테스트하는 단계이다. 주요 목적은 소프트웨어가 비즈니스 요구 사항을 충족하고, 합의된 사항을 준수하며, 배포할 준비가 되었는지 확인하는 것이다. 보통 단위 테스트나 통합 테스트와 같은 다른 테스트 단계 이후에 최종적으로 진행되는 테스트이다. 특정 결함이나 문제를 식별하기보다는 시스템의 기능, 사용성, 성능 및 사용자 기대치와의 전반적인 일치 여부를 평가하는데 중점을 둔다. 인수 테스트가 이뤄지는 과정 최종 사용자 (End User) 혹은 이해관계자가 시스템을 사용하여 자신의 요구사항과 기대치를 충족하는지 확인한다. QA ..

자바스크립트 이벤트(Event) 객체와 커스텀 이벤트 (Custom Event) 란?

자바스크립트 이벤트(Event) 객체와 커스텀 이벤트(Custom Event) 란? 자바스크립트는 브라우저에서 이벤트 콜백을 통해 화면(DOM)과 함께 상호작용 하는 일이 잦다. 흔히 사용되는 이벤트로 클릭, 마우스 움직임, 키 입력, 양식 제출 등이 있다. 기본 이벤트 중 필요한 이벤트가 없거나 특수한 이벤트를 만들고 싶을 때 커스텀 이벤트(Custom Event) 를 만들 수 있다. 이를테면 동영상 플랫폼에서는 동영상을 재생하는 이벤트나 일시정지하는 이벤트 등을 만들 수 있다. MDN Event 공식문서의 Interfaces based on Event 항목 을 보면, 자바스크립트 이벤트를 기반으로 한 인터페이스가 아주 많다. 원하는 이벤트가 있는지 먼저 찾아보면 된다. 커스텀 이벤트 사용 방법 이벤트..