hee-ya07 님의 블로그

1. 비관계형 데이터베이스(NoSQL)1.1 정의- 데이터를 표 형태 저장X, 비정형, 비관계로 정의한 시스템1.2 구성(비정형 + 비관계 + Schemaless)트리 구조의 데이터로 그 자체로 트리 기반의 데이터 간 종속성을 표현1) 복잡한(다차원) 데이터의 저장을 위해 Key-Value 나 JSON같은 비정형 형태로 저장2) 한 데이터에 수많은 데이터가 들어가 있기 때문에 비관계(관계가 X)3) 데이터를 K-V로 적재방대한 트래픽 및 데이터양의 처리 가능- 수평적 확장에 유리한 분산 저장과 효율적인 쿼리데이터 무결성 제약이 약함(신뢰성이 적음) 1.3 목적:: 빅데이터의 커버를 위한 무한 확장 가능한 DB의 역할1.4 NoSQL의 종류:: 정렬화된 2차원 데이터의 구성을 통해 쿼리만 다른 RDBMS와..

1. 관계형 데이터베이스(RDBMS, Relational Database Management System)1.1 정의- 데이터를 표 형태로 저장, 관계를 정의한 시스템1.2 구성(행렬 + 관계 + Fiexd Schema)2차원(행렬) 구조 데이터에 각 요소 간의 관계(Relation)를 기반으로 데이터의 종속성을 표현1) 데이터는 테이블이라는 2차원 배열 형식(행렬)으로 저장2) 복잡한 다차원 데이터를 다수의 2차원 Entity(테이블)에 분할3) 고정된 Column의 정의에 맞게 데이터 적재(Fiexd Schema)Fiexd Schema를 이용하여- ORM 형성 :: 관계형(DB - 2차원 구조 데이터) + 객체 지향(Application - 트리 구조 객체데이터)- 자체 쿼리 최적화 :: Parsin..

0. DB 와 DBMS항목DB (Database)DBMS (Database Management System)정의데이터를 체계적으로 저장하고 관리하는 시스템데이터베이스를 관리하는 소프트웨어 시스템기능- 데이터 나열 (CSV, Excel 등)- 데이터 저장 / 검색 / 관리1) DB 설계 / 생성 / 수정 / 관리2) 데이터 보안 관리 및 사용자 권한 제어3) 쿼리 최적화4) 트랜잭션 및 일관성 관리5) 백업 및 복구 기능 제공- 데이터 정의 / DDL :: 스키마(메타데이터)의 CRUD- 데이터 조작 / DML :: 데이터에 대한 CRUD, JOIN, AGG 등- 계정 관리, 노드 관리, 메모리 관리, 네트워크 관리, 커넥션 풀 관리구성 요소- 테이블, 데이터, 레코드 등- DB 엔진, 스키마, 데이터 조..

0. 개요- 개발할 때, 나만 그런지 모르겠는데대략적 구조 -> 각 기능 분배 및 이슈 설정 -> 개발 -> pr이런 순서로 진행하고 있다. 이 때, 따로 이슈나 pr에 대한 템플릿이 없다면 각 사람마다 다른 구조의 글이 나올 것이다.때문에 git에서는 이것을 공통화할수 있게끔 설정하였는데, 이에 대해 잠시 알아보자..1. github 연결- 이전에 로컬 개발 환경을 만들어놓고 remote에 연결하는 방식에 대해 설명한 적이 있다. [git] git 시작하기0. git 개념구분gitgithub목적분산형 버전 관리 시스템 (VCS)git, 클라우드 기반의 코드 호스팅 및 협업 플랫폼기능로컬 코드 관리 중앙 코드 관리 협업 관리 저장소Local RepositoryRemote Repository인터페이hee-..

:: 리렌더링을 줄이기 위해 use-hook-form을 사용하는데,:: 비밀번호 확인(보이기/숨기기), 포커싱 등을 보면 상태를 사용하거나 난감해하는 문제를 맞이한다..내 이야기. 1. useImperativeHandleuseImperativeHandle(ref, createHandle, dependencies?):: 자식 컴포넌트에서 부모 컴포넌트로 특정 인스턴스 값을 전달할 때 사용:: 주로, ref를 통해 자식 컴포넌트의 내부 메서드나 속성을 부모 컴포넌트에서 사용할 수 있도록 할 때 사용:: 즉, 자식의 인스턴스 값을 부모에게 노출 시킴:: 결합도가 증가함을 인지  useImperativeHandle – ReactThe library for web and native user interfacesk..

1. React-hook-form에서 Props Drilling 방지:: 제어 or 비제어에서 useForm 사용 시, 계층 구조가 만들어짐:: 구조가 커질수록 계층별로 퍼져 각 계층의 자식 인풋을 연결하면, Props Drilling 발생:: + useFormContext() 사용  == useFormContext()  == useContext()1.1  :: 으로 모든 인풋을 관리할 기반 폼 생성:: useForm()을 정의하는 곳에서 과 함께 정의:: useForm()엣 반환된 register, handleSubmit, formState 등을 하위 컴포넌트가 접근할 수 있도록 함function RegistrationForm() { const methods = useForm() const { r..

1.  useForm 사용 - 종료1.1 handleSubmit():: 종료 및 제출// 아래와 동일등록 Ex)export function App() { const { register, handleSubmit } = useForm() return ( console.log(data))}> Submit Button );}1.2 reset():: 종료 및 리셋// 아래와 동일초기화Ex)export function App() { const { register, reset } = useForm() return ( reset()}>Reset Button reset()} value="Reset Button" /> );}참고AS..

1. formState :: 렌더링 성능을 위해 프록시 패턴을 적용 => 리렌더링 X:: 리렌더링 X이므로 formState를 보기 위해서는 이벤트 발생이 필요최초 useForm을 생성 후, 모든 인풋들을 register or control로 일괄 등록 후,아래와 같이 formState로 상태 조회const { formState: { // A. 유효성 관련 errors, // 모든 인풋들의 각각의 유효성 출력 isValid, // 모든 인풋들이 유효한지 여부 isValidating, // 모든 인풋들이 유효성 검사중인지 validatingFields, // 모든 인풋들중 유효성 검사중인것들만 출력 // B. 기본값 대비 입력되었는지 여부 defaultVa..

0. useForm 사용 - 등록/유효성:: register(), control에는 유효성 검증을 위한 기준 파라미터가 있음:: 해당 객체 ref에 태그되는 "name"과 이를 같이 전달하여 등록 및 유효성 검증0.1 Vaildation 유효성 종류 - 대략Validation 유효성 종류내용- required필수 입력 여부- min / max최소 / 최대 값 설정- minLength / maxLength최소 / 최대 문자 길이 설정- pattern정규픽 패턴에 맞는지 검사- validate사용자 정의 유효성 검사 함수 더 많은 vaildation registerPerformant, flexible and extensible forms with easy-to-use validation.react-hook-..

0. useForm 사용 - 시작register() :: 비제어 입력 사용 시control     :: 제어 입력 사용 시(UI 라이브러리의 커스텀 input사용 시) 0.1 register()를 사용하는 경우:: 입력이 비제어 입력을 사용한다면 useForm의 register()를 사용:: 해당 비제어 컴포넌트의 Reference를 register에 등록하여 사용(ref에 연결됨을 의미)// 비구조화 사용function Input({ control, name }) { const { field } = useController({ name, control }); const { value, ref, onChange, onBlur, name = fieldname } = field; return ( ..