업데이트 함수 setState를 활용하여 구현 import { useEffect, useState } from "react"; import "./App.css"; function App() { const [count, setCount] = useState(0); useEffect(() => { const timer = set...

1. Automatic Batching 자동 배치란 여러 개의 state 업데이트를 하나로 묶어 render 함수를 호출(리렌더링 성능 개선)하는 것을 말합니다. 기존 17 버전에서도 이러한 배칭 처리는 되었지만 비동기 부분에서는 자동 배치 처리가 되지 않았습니다. 하지만 18 버전부터는 비동기에서도 자동 배치 처리를 지원합니다. imp...

실행 중인 프로그램을 뜻하며, 실행파일(program)이 memory에 적재되어 CPU에 의해 실행(연산)되는 것을 말한다. 예를 들어, 코드를 작성한 후 저장을 하면 하드디스크에 저장하는 것을 프로그램이라 부른다. CPU는 하드디스크에 저장된 프로그램을 읽을 수 없다. RAM memory에 올라와있는 프로그램만 읽을 수 있다. 프...

웹 브라우저에서 주소창에 google.com을 입력했을 때 어떤 일이 일어날까?  면접 질문으로 많이 나오는 질문이다. 크게 두 가지 관점으로 나누어 볼 수 있다. 하나는, 네트워크 관점이고 또 하나는 브라우저가 웹 페이지를 그리는 관점이다. 우선 네트워크 관점부터 알아보면 아래 그림과 같은 흐름을 갖는다. 웹 동작 방식 사용자가 ...

TDD(Test Driven Development)란? TDD란 Test Driven Development라는 약자로 테스트 주도 개발을 의미한다. 테스트는 서비스의 품질 확인 및 버그를 찾는 데 사용할 수 있다. 내가 작성한 코드가 예상하는 대로 동작하는지 검증하고 확인하는 것이다. 테스트 주도 개발은 무엇일까?  테스트 주도 개발이란 테스트...

표현식 의미 ex ex 설명 ^ 텍스트의 시작 ^hello hello 텍스트로 시작되는 것을 의미 $ 텍스트의 마지막 hello$ 마지막 텍스트 hello를 의미...

Redux Toolkit이란? Redux Toolkit은 redux에서 지원하는 개발 도구이다. 스토어 설정, 리듀서, 데이터 가져오기 등 Redux 로직을 작성하기 위해 권장되는 접근 방식이다. Redux Toolkit의 configureStore는 설정을 단순화하고 일반적인 버그를 방지하는 데 도움이 되는 향상된 createStore 버...

AWS CodePipeline으로 배포하기 사이드 프로젝트를 CodePipeline을 이용해서 배포해 보았다. 그 과정을 아래와 같이 정리해 보았다. CodePipeline으로 배포할 때 Source -> Deploy으로 바로 배포할 수 있지만 프로젝트에 Typescript를 사용했기 때문에 Source -> Build -> De...

Node & AWS S3 Install npm i aws-sdk AWS S3 버킷 생성 및 권한 설정에서 이미지 저장 및 삭제는 권한(IAM 정책)을 부여했다. IAM 정책 생성시 받은 액세스 키(AWS_ACCESS_KEY), 시크릿 키(AWS_SECRET_KEY)와 S3 리전(AWS_REGION)을 .env에서 관리한다. ...

사이드 프로젝트를 진행하면서 이미지 파일 관리를 위해 AWS S3를 사용하면서 알게 된 정보를 정리해 보았다. S3(Simple Storage Service)란? 쉽게 말해 AWS(Amazon Web Service)에서 제공하는 클라우드 파일 저장소이다. S3를 사용하는 이유? 서버(EC2, ELB)만을 사용해서 파일을 저장을 하게 되면 성능 및 ...