profile
Mojittoba
post-thumbnail

NextJs

nextjs는 React의 SSR(Server-Side Rendering)을 쉽게 구현할 수 있게 도와주는 프레임워크이다. React만으로도 SSR을 자체적으로도 구현할 수 있긴 하지만 개발환경 세팅이 굉장히 복잡하다. 그래서 NextJs가 나왔고 간단한 설정만으로도

2021년 11월 17일
·
0개의 댓글
post-thumbnail

Next.js & Redux-saga(1) - 프로젝트 설정

프로젝트 create-next-app으로 생성redux-toolkit 및 redux-saga 설치eslint & prettier 설치.eslintrc.jsontypescript eslint 적용vscode 설정 - mac기준 vs코드내에서 파일을 저장할 때마다 자동으

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

기술 면접 정리 (2)

up, down 메소드를 제공하는 객체 ladder가 있다.연어이 메소드를 호출하고 싶으면이렇게 호출해야되는데 메소드 호출 체이닝을 이용하면이렇게 바꿀 수 있다. 그리고 각 메소드마다 호출을 연속적으로 하기 위해서는 return.this를 붙여서 쓰면된다.메모이제이션은

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

면접 질문 (React 관련)

DOM은 HTML문서를 프로그래밍적으로 접근가능하게 해주는 인터페이스로 DOM node에 접근하여 편집을 하게 되면 DOM이 업데이트 되는데 비용이 굉장히 많이 든다. node를 추가하면 node를 추가하여 업데이트 하고 이러한 업데이트로 인해 레이아웃에 변화가 생기면

2021년 9월 9일
·
0개의 댓글

Javascript에서 This

javascript에서 기본적으로 this는 window이다. strict.mode일 경우는 차이가 있다.this가 window가 아닌 경우객체의 메소드 안의 this의 경우는 객체를 카리킨다.명시적으로 this를 바꾸는 함수 3가지 bind, call apply를 사

2021년 9월 9일
·
0개의 댓글

기술 면접 예상 질문 정리(1)

DOM은 HTML, XML 문서의 프로그래밍 interface이다. 기본적으로 여러 프로그램들이 페이지의 콘텐츠 및 구조 그리고 스타일을 읽고 조작할 수 있는 API를 제공한다.DOM의 생성 방식DOM은 원본 HTML문서의 객체 기반 표현 방식이며 DOM의 개체 구조

2021년 9월 8일
·
0개의 댓글

코드분할(Code-splitting)

자바스크립트로 어플리케이션을 개발하게 되면 기본적으로 하나의 파일에 모든로직이 들어가서 용량이 커지고 속도가 느려지는 문제가 생기는데이를 방지하기 위해 코드를 따로 분리 시키고 비동기적으로 필요할때 불러와서 사용할수 있게 하는 것이다.리액트에서는 lazy-suspens

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

PWA

페이지가 업데이트 될때마다 이전 캐시스토리지를 초기화 해줘야되는 문제들이 발생.이렇게 index.html파일에서 실행을 시키고 worker.js파일을 구현. 그래서 캐싱할 파일을 지정하고 오프라인일때 나오는 페이지도 캐싱목록에 넣어서 지정했다.이렇게 캐시스토리지네임을

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

VanillaJS

컴포넌트 단위로 구현을 해보니 React의 클래스형 컴포넌트와 거의 흡사한 형태로 짜여지는거같다.기본 문법들이 조금씩 다른부분도 있지만 전체적인 데이터 흐름방식이나 단위단위로 쪼개서 구현하고 상위컴포넌트에서 구현하고 props를 내려주는 방식이 거의 일치한다.전체적으로

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

React(2)

가장 많이 널리쓰이는 훅중에 하나로 잘 못 구현되었을때 가장 많이 문제를 일으키기도 하는 훅이다기본적인 useEffect의 형태로 뒤에 deps가 없이 실행할경우 렌더링될때마다 매번 실행이 된다.deps를 비워둔채로 선언을 하게 되면 컴포넌트가 처음 마운트 될때에만 실

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

React (1)

위의 태그문법을 jsx라고 하며 javascript를 확장한 문법으로 보통 React와 함께 사용한다.위 처럼 JSX의 중괄호 안에는 유효한 모든 javascript 표현식을 넣을 수 있다. 위는 호출 결과인{list.word}를 span 엘리먼트에 포함 시킨것이다.그

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

동적 계획법

동적 계획법이란 복잡한 문제를 간단한 여러 개의 문제로 나누어 푸는 방법을 말합니다. 이것은 부분 문제 반복과 최적 부분 구조를 가지고 있는 알고리즘을 일반적인 방법에 비해 더욱 적은 시간 내에 풀 때 사용한다.동적 계획법은 여러 개의 하위 문제를 풀고 그 결과를 기록

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

DFS, BFS

자료의 검색, 트리나 그래프를 탐색하는 방법, 한노드를 시작으로 인접한 다른노드를 재귀적으로 탐색해가고 끝까지 탐색하면 다시 위로 와서 다음을 탐색하여 검색하는 것.정렬된 데이터를 이분 탐색하는 것처럼 아주 효율적인 방법이 있는 반면에, 모든 경우의 수를 전부 탐색해야

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

세션/쿠키 및 JWT

프론트엔드의 관점에서 인증은 사용자의 로그인, 회원가입과 같이 사용자의 도입부분을 말합니다. 백엔드(서버)에서는 모든 API요청에 대해 사용자를 확인하는 작업입니다.사용자 A와 B가 서비스(앱)를 쓸 때 두 사용자는 정보 및 보유하고 있는 컨텐츠들이 다를 것입니다. 그

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

서버사이드 렌더링(SSR)

\-페이지 요청시마다 새로고침이 일어나며 서버에 새로운페이지에 대한 요청을 하는 방식이다. 예를 들자면 필요한 물건이 있을때마다 마트에 장을 보러 가는 것과 비슷하다. 그리고 페이지가 어떻게 보여지는지 또한 서버에서 해석하여 보내주는 방식이다.\*Rendering: 웹

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

Bootstrap

부트스트랩은 트위터에서 사용하는 각종 레이아웃, 버튼, 입력창 등의 디자인을 CSS와 javascript로 만들어 놓은 웹 디자인 프레임워크이다.위 사진처럼 부트스트랩은 글자, 인용문, 목록, 표, 버튼, 이미지, 아이콘, 드롭다운 메뉴, 등 웹페이지에서 사용하는 것들

2021년 4월 29일
·
0개의 댓글
post-thumbnail

HTML & CSS

html은 구역과 텍스트를 나타내는 코드로 크게 head와 body로 구성되고 head안에는 페이지의 속성정보, body안에는 페이지의 내용을 담는다.이와 같은 기본형태에 head와 body태그안에 여러가지 태그들(h1~h6, hr, button 등)을 이용해서 페이지

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