구버전
-
[CS Study] 동기, 비동기처리구버전/CS Study 2023. 12. 15. 21:46
개요 Javascript의 동작 방식 동기, 비동기 방식 Javascript의 비동기처리 Javascript 동작 방식 Javascript는 함수를 호출했을 때 어떤 동작을 실행하는지 알아보자! Javascript엔진은 단 하나의 실행 컨텍스트 스택을 갖는다.(한 번에 하나의 함수만 실행 가능, 싱글 스레드 방식) 자바스크립트 엔진이 함수 코드를 평가하고 함수 실행 컨텍스트를 생성한다. 생성된 실행 컨텍스트는 실행 컨텍스트 스택(Callstack)에 push되고 함수 코드가 실행된다. 실행이 종료되면 함수 실행 컨텍스트가 컨텍스트 스택(Callstack)에서 pop으로 제거된다. 이러한 자바스크립트 엔진이 시간이 걸리는 작업을 마주하게 되면 블로킹(작업 중단)이 발생한다. 테스크 큐와 이벤트 루프 싱글 ..
-
[Typescript] why Typescript?구버전/TypeScript 2023. 12. 8. 16:21
개요 자바스크립트와 타입스크립트란? 타입스크립트를 선택한 이유 착각하기 쉬운 타입스크립트 기본개념 Javascript) 동적 웹페이지를 만들기 위한 프로그래밍 언어로써 웹페이지를 조작하고, 서버와 클라이언트 간 상호작용에 관한 일을 한다. 등장배경 : 정적인 초기웹사이트에서 동적으로 변함에 따라 등장하게 되었다 인터프리터 언어이지만 컴파일러가 내장되어 있어 실행 속도가 매우 빠르다. 객체기반의 스크립트 언어이지만 함수형과 객체 지향형 프로그밍을 모두 구현할 수 있다, Typescript) Javascript를 기반으로 정적 타입 문법을 추가한 프로그래밍 언어 컴파일 언어, 정적 타입 언어 : 동적인 Javascript는 런타임에서 오류를 발견할 수 있는 것에 반해 Typescript는 코드의 작성 단계에..
-
[React] react-hook-form (Basic)구버전/React 2023. 12. 8. 11:17
개요react-hook-form을 도입하계 된 계기react-hook-form마무리제어 컴포넌트에서 벗어나 비제어 컴포넌트 방식으로 form을 관리한다?react-hook-form 도입라이브러리 없이 제어 컴포넌트로 form을 다루자) React에서 제어컴포넌트란 React를 통해서 제어하게 되는 컴포넌트이다. 간단하게 이름과 아이디, 비밀번호, 전화번호, 이메일을 받는 form을 만들 때 state를 통해서 값을 관리할 것이다.제어컴포넌트로 form을 다룰 시에 나올 수 있는 모습이다더보기import React, { useState } from "react";import InputText from "../component/InputText";import { Label, Row } from "../s..
-
[Next.js] Jest + Typescript + Next.js구버전/Next.js 2023. 12. 7. 11:37
개요 설치 및 적용 Get Started install) pnpm create next-app add dependencies) pnpm add -D @testing-library/jest-dom @testing-library/react @testing-library/user-event jest jest-environment-jsdom ts-jest script) // package.json "scripts": { ... "test": "jest", "test:watch": "jest --watchAll" }, jset config) // jest.config.js const nextJest = require('next/jest') const createJestConfig = nextJest({ dir: ..