Hey Tech

에러 상황 React 기반 화면 UI 구현 중 아래 에러 메시지 확인 에러 메시지 JSX expressions must have one parent element. 에러 원인 - JSX 문법에서 Component가 여러 개 있다면 반드시 parent element로 감싸야 하는데 그렇지 않아서 발생한 이슈 - Component 내부는 하나의 DOM Tree 구조로 이루어져야 한다는 규칙을 따라야 함 해결책 간단하게 div 태그 또는 fragment 태그 또는 중괄호{}로 여러 Component를 감싸는 parent element를 사용하면 쉽게 해결 가능 해결책 예시1: div 태그 ... 해결책 예시2: fragment 태그 ... 해결책 예시3: 태그명 생략가능 ... 포스팅 내용에 오류가 있다면 아..

에러 상황 React 서버 오픈 중에 아래와 같은 에러 메시지 확인 에러 메시지 'react-scripts'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는배치 파일이 아닙니다. 해결책 npm update 후 서버 재시작 npm update npm update 후에도 서버 실행이 안 된다면 react-scripts 설치 후 서버 재시작 npm install -g react-scripts npm start 포스팅 내용에 오류가 있다면 아래에 댓글 남겨주세요. 고맙습니다 :)

에러 상황 Repository에서 새로운 Branch가 업데이트되어 checkout 시도 중 아래와 같은 에러 발생 에러 메시지 error: pathspec 'development' did not match any file(s) known to git 문제 원인 Branch 업데이트가 안 되어 에러 발생 해결책 git remote update git checkout [branch 이름] 포스팅 내용에 오류가 있다면 아래에 댓글 남겨주세요. 고맙습니다 :)

솔루션 터미널에서 아래와 같이 branch 이름과 저장소 URL 입력 git clone -b {Branch 이름} --single-branch {저장소 URL} 작성 예시 git clone -b development --single-branch https://github.com/[...].git 포스팅 내용에 오류가 있다면 아래에 댓글 남겨주세요. 고맙습니다 :)

🔥 목표 DAO, DTO, VO의 기본적인 개념과 특징을 이해한다. 1. Data Access Object(DAO) Database에 Access 하는 Transaction Object Domain Logic에서 Persistence Mechanism 노출 없이 데이터 조회, 삽입, 삭제, 업데이트(i.e., CRUD) 기능 수행 Domain Logic과 비즈니스 로직 분리를 위해 사용 2. Data Transfer Object(DTO) 2.1. 개념 및 특징 계층 간 데이터 교환이 주된 목적인 객체로, 특별한 Logic을 따로 갖지 않음 클라이언트 측과 직접 마주하는 계층(e.g., Controller, View, Business Layer, Persistence Layer)에 Entity를 직접 전달..

🔥 목표 Entity의 기본 개념과 맵핑 방법을 이해한다. 1. Entity 개념 2차원 Table 자체를 Entity라고 부름 Table 내 각 Row가 Entity 객체이며, 각 Column이 Field Entity는 Table과 1대1 대응된다고 표현 Table 내 모든 Column은 Field로 반드시 정의해야 함 Entity 클래스는 다른 클래스를 상속받거나 인터페이스의 구현체로서 사용불가 2. Entity 클래스 사용 규칙 Entity 클래스는 클래스 작성 시 Entity Annotation을 붙여 해당 클래스가 Entity 클래스임을 명시해야 함 Entity 클래스에서 Domain 로직만 구현하고 Presentation 로직은 구현하지 않음 Proxy 생성을 위해 기본 생성자는 필수이며, p..

🔥 목표 JPA가 등장한 배경부터 JPA의 기본적인 개념에 대해 이해한다. 1. JPA 등장 배경 SQL Mapper는 SQL 구조/구문에 대한 의존성이 높아 아래와 같은 문제점을 야기하는데, JPA를 활용하면 아래 문제점을 해결할 수 있다는 장점 존재 - 객체지향 및 관계지향 DB의 Paradigm 불일치 야기 - 유지보수 어려움 야기(e.g., 필드 변경 시 방대한 쿼리문 수정 필요) - 생산성 저하: 번거로운 객체 필드-SQL 상호변환(개발자가 곧 SQL Mapper라고 할 만큼 방대한 SQL 작업량) 2. JPA 개념 2.1. JPA 기본 개념 - Java Persistence API의 약자 - Java Application에서 Relational Data Base(RDB) 사용 방식을 정의한 인..

🔥 목표 JavaScript와 HTML을 활용하여 간단한 Interactive Web 기능을 구현해 본다. 예제 간단한 예제를 실습해 봅니다. HTML을 활용해 버튼 UI를 생성하고 웹에 출력하고, JavaScript를 통해 사용자가 버튼을 클릭하는 것을 감지하여 클릭 횟수를 실시간으로 업데이트하는 것을 구현해 봅시다. 실습 코드 index.html Total Click: 0 버튼 실행결과 버튼 클릭 전입니다. 아래와 같이 버튼을 클릭하면 웹 페이지 및 콘솔에 클릭 횟수가 출력되는 것을 확인할 수 있습니다. JavaScript와 HTML를 활용하여 간단한 Interactive Web 기능을 구현해 봤습니다. 포스팅 내용에 오류나 질문이 있다면 댓글 남겨주시면 감사드리겠습니다. 고맙습니다 :)