profile
예발자입니다.
post-thumbnail

Next.js - SSR이라고만 알고있었다.

SSR은 사실 ..

2021년 9월 12일
·
8개의 댓글
post-thumbnail

리액트에서의 전역상태관리_1 Redux

직접 작성한 예제를 기반으로 작성코드와 같이 보시면 더욱 도움될 것 같습니다이전 글 에서 크게 달라지는 것이 없다.Action, Reducer은 완전하게 동일하다.달라지는 점은, Context API에선 전역 데이터에 접근하기 위해 Provider에 등록했고 Reduc

2021년 9월 10일
·
0개의 댓글
post-thumbnail

리액트에서의 전역상태관리_Context API

context를 이용하면 단계마다 일일이 props를 넘겨주지 않고도 컴포넌트 트리 전체에 데이터를 제공할 수 있습니다. - 공식문서위의 말처럼 기계적인 props전달 코드를 없앨 수 있는 방법 중 하나다.전역데이터를 공유하는 방법이며 로그인 유저, 테마 등의 데이터를

2021년 9월 10일
·
0개의 댓글
post-thumbnail

리액트에서의 전역상태관리를 이해해보자_1 (flux란?)

redux의 배경이되는 Flux패턴과 이를 기반으로한 redux를 이해하기 위해 작성 > Facebook에서는 알림기능에서 에러가 반복되어 양방향 데이터흐름의 MVC패턴에서 예측되지 않는 문제점을 해결하기 위해 Flux패턴을 도입했다고 한다. What is Flux

2021년 9월 10일
·
0개의 댓글
post-thumbnail

TS - Type, Interface, Generic, React에서 TS 정리

Type Test해보는 사이트(https://www.typescriptlang.org/play?>각 Component 폴더에서 types.ts 를 분리해 import로 사용함.매개변수에 대한 타입(Date) : 으로 지정Return Type(string) :

2021년 8월 23일
·
0개의 댓글
post-thumbnail

실행컨텍스트

실행컨텍스트는 코드가 실행되기 위해 필요한 환경이미지출처, 내용참고사이트자바스크립트가 call Stack으로 코드를 처리하는 것은 알고있다.이 Call Stack에 쌓이는 것은 함수다. 쌓인다고 해서 내부 로직이 실행되는 것이 아니다.이 함수가 실행되려면 필요한 것들이

2021년 8월 21일
·
0개의 댓글
post-thumbnail

호이스팅

여기서 한가지 염두에 두고 글을 읽어야할 것이 있는데, JS엔진이 행하는 컴파일과정, 실행과정을 나누어서 생각을 해야한다.컴파일은 말 그대로 실행전, 인터프리터가 코드를 실행할 수 있도록 준비해놓 단계이고 실행은 바이트코드로 이루어진 기계어를 실행하는 것이다.코드 실행

2021년 8월 21일
·
0개의 댓글
post-thumbnail

원티드 프리온보딩 기업과제#3

이번 과제는 자란다의 기업과제이다.구현해야 할 사항은 크게 다음과 같았다.회원가입 / 로그인 - 유효성체크관리자계정에서 사용자 검색, 권한 수정, 페이지네이션권한에 따른 페이지 접근 분기2번 기능을 본인 포함 3명의 팀원과 페어프로그래밍으로 진행했다.사용자데이터를 필터

2021년 8월 13일
·
0개의 댓글
post-thumbnail

원티드 프리온보딩 기업과제#2(feat.only text)

지난 달 26일부터 프리온보딩 과정에 참여하게 되었다.이전부터 프론트엔드를 하겠다고 생각하고, 공부를 시작했다.그러나 독학하는게 생각보다 쉽지않았다. 혼자하는게 일정에서는 자유로울수 있지만 그만큼 늘어지기 십상이었다.또한 문제가 발생했을 때 이를 해결하는 방법이 맞는

2021년 8월 13일
·
0개의 댓글
post-thumbnail

JWT

추가로 더 다룰 예정입니다.Json 객체를 사용해 가볍고, self-contained 방식으로 정보를 안전성있게 전달해주기 위한 토큰.JSON Web Token (JWT) is an open standard (RFC 7519) that defines a compact

2021년 8월 13일
·
0개의 댓글
post-thumbnail

함수형 프로그래밍 슬쩍보기

Side effect가 없이 in, output이 동일한 순수함수로만 작성되고 공유상태, mutable을 피하는 SW를 만드는 프로세스함수형 프로그래밍은 명령형(imperative) 이 아닌 선언형(declarative) 이며 애플리케이션의 상태는 순수 함수를 통해 전

2021년 8월 13일
·
0개의 댓글
post-thumbnail

3탄_자바스크립트엔진의 구성요소와 비동기작업을 지원하는 이벤트루프

이전글에서는 자바스크립트 엔진이 js를 어떻게 읽고 해석하는지에 다뤘습니다.해당 글은구성요소와 이벤트루프가 어떻게 돌아가는지에 대한 글입니다.V8은 single thread으로 되어있는 실행 엔진이고 상당히 많은 일을 한다.js코드를 해석, 실행도 하며 callStac

2021년 8월 13일
·
5개의 댓글
post-thumbnail

2탄_브라우저의 자바스크립트 엔진은 js를 어떻게 해석하고 실행하는가 ?

이전 글에서 다루지 않았던 자바스크립트 엔진에 대한 글입니다.HTML이 parsing될 때 script태그를 만나면 parsing이 일시중지되고 script를 해석, 실행한다.이 해석, 실행되는 것이 어떻게 이루어지는가에 대한 정리를 시작해보자.컴파일러, 인터프리터,

2021년 8월 13일
·
3개의 댓글
post-thumbnail

1탄_브라우저 작동 원리_랜더링과정

브라우저의 동작을 정리한 원문(https://www.html5rocks.com/en/tutorials/internals/howbrowserswork/> Rendering Engine이 UI를 그려내기까지의 과정을 다루고 있으며,이전\_랜더링과정을 정리해놓은 글

2021년 8월 13일
·
3개의 댓글

Infinite Scroll 구현 (feat. pair Programming)

과제 1 1. API Request 1.1 Making Http Request 스크롤 구현전, api호출을 위한 http request를 만들어야 했다. 이를 위한 방법에는 크게 2가지, fetch, axios 가 있다. 이 둘의 차이점을 먼저 확인해보자 f

2021년 7월 27일
·
0개의 댓글

React에서 Infinite scroll 구현하기 (IntersectionObserver)

무한스크롤을 구현하는 방법scrollIntersectionObserver스크롤이벤트를 attch하여 현재 스크롤위치를 계산해 맨 끝에 스크롤되었을 때 다음 데이터를 fetch하는 방법을 사용한다.스크롤마다 이벤트가 발생하므로 성능이슈를 예방하기 위해 쓰로틀링 적용을

2021년 6월 19일
·
0개의 댓글

nextJS build된 정적파일 배포하기, nginx SSL적용 및 리버스프록시설정

nextJS build된 정적파일 무중단 서비스하기, nginx SSL적용 및 리버스프록시설정 nextJS를 배포하기 위해 .next라는 정적파일로 build하고 이를 배포하는 방법으로 기존에 진행했었다. 무중단서비스를 위해 PM2로 서버가 크래시나도 재시작을 할

2021년 4월 19일
·
0개의 댓글

This?

메소드를 호출한 객체가 저장되어있는 속성으로 함수를 호출하는 방법에 의해 결정됨일반 함수에서 this -> window중첩 함수에서 this -> window이벤트에서 this -> 이벤트 객체메소드에서 this -> 메소드 객체메소드 내부의 중첩 함수에서 this -

2020년 12월 15일
·
0개의 댓글
post-thumbnail

브라우저 랜더링 과정

HTML, CSS, JS 등을 브라우저에 출력하는 과정브라우저마다 사용하는 랜더링 엔진이 다름크롬 : 사파리의 웹킷 포크뜬거 블링크파폭 : 게코사파리 : 웹킷HTML, CSS를 다운로드 받는다랜더링 엔진은 먼저 HTML 문서를 파싱하고 DOM노드로 변환하고 CSS파일과

2020년 12월 5일
·
0개의 댓글

크롤러 무한스크롤 에러

무한스크롤의 페이지를 크롤링하기 위해 드래그를 맨 밑으로 내려서 div, a 등 태그들은 로딩이 됐지만 이미지는 해당 위치로 이동을 해야 로딩되는 방식이어서 img src를 받을 수 없었다. 그래서 setInterval로 시간초마다 일정 높이를 드래그하여 이미지 전체를

2020년 11월 14일
·
0개의 댓글