git clone 으로 파일을 새로 내려받고 pod install 을 했더니라는 에러가 뜬다.m1 맥북 이슈인 것 같은데 sudo arch -x86_64 gem install ffi 로 ffi를 설치하고pod install 대신에 arch -x86_64 pod inst

단어 그대로 낙관적으로 생각하는 UI입니다. 서버로부터 받는 응답이 대부분 오류가 나지 않을 것이다. 성공적일 것이다라고 가정하고 사용자에게 성공했을 때의 결과를 바로 보여주는 것이다.사용자가 👍 버튼을 누른다.좋아요 갯수가 1개 증가한 UI를 바로 보여준다,서버에

JWT에는 두 가지 종류의 토큰이 있다.Access Token, Refresh TokenAccess Token을 통해서 민감한 정보에 접근할 수 있으며두 가지 토큰중에서 실제 권한에 접근하는 토큰이다.짧은 유효기간을 가지며Refresh Token을 통해서 만료된 Acc

재귀함수는 자기자신을 다시 호출하는 함수이다. 재귀함수는 종료조건이 있어야 하며, 종료조건을 설정해주지 않으면 무한 반복을 하게된다. 재귀함수로 작성이 되는 코드는 반복문으로도 작성할 수 있다.간단한 예시로는 1부터 100까지 합을 구하는 함수를 만들때 반복문을 이용해

1. Cookie 쿠키는 클라이언트에 대한 정보를 이용자의 PC 하드디스크에 보관하기 위해서 클라이언트의 웹브라우저로 전송해주는 정보이다. 웹 페이지에서 쿠키를 설정할 경우, 이후의 모든 웹에서의 요청은 쿠키정보를 포함하여 서버로 전송된다. 쿠기는 개수와 용량에

로그인 기능을 공부해보았다. 기본적으로 아이디 비밀번호를 입력해서 로그인한다고 해보자. 아이디와 비밀번호를 받았으면 로그인을 시도해보자 이미 만들어져있는 로그인 API이다. password와 email을 variables로 넘겨주고 로그인 했다는 것을 증명받아야

DB 연결 방식에는 ORM과 ODM으로 나뉜다.ORM은 데이터를 표형태로 담아주며 이런 방식을 관리형 데이터베이스라고 말한다.대표적으로는 Oracle, MySQL, Postgres가 있다. ODM은 데이터를 서류 봉투형식으로 담아주는데, 이를 NotOnlySQL 즉 N

Object.keys()Object.keys() 메소드는 주어진 객체의 속성 이름들을 일반적인 반복문과 동일한 순서로 순회되는 열거할 수 있는 배열로 반환한다. 예를들어 const object1 = { a: 'somestring', b: 42, c: false};

프로그래밍 언어를 막론하고 정규표현식은 자주 쓰인다. 정규표현식에는 정규표현식에만 사용되는 특수표현들이 있다.^ : 문자열의 시작$ : 문자열의 종료 , 옵션에 따라 문장의 끝 또는 문서의 끝에 매치된다.. : 임의의 한 문자\[] : 문자 클래스 . 문자 클래스 안

redux를 쓰는 이유는 다양하다.props가 없이도 모든 컴포넌트들이 state를 사용할 수 있게해준다.import {Provider} from 'react-redux';ReactDOM.render( <React.StrictMode>

보통 상위컴포넌트에서 하위컴포넌트로 데이터를 전달할 때 pros를 사용한다. 가까운 컴포넌트끼리는 괜찮을 수 있지만 컴포넌트간의 거리가 멀어진다면 props를 정말 많이 내려줘야한다. 큰 프로젝트일수록 컴포넌트마다 props를 거치는 것은 비효율적이므로 이럴때 Cont

useEffect 함수는 컴포넌트가 렌더링 될 때마다 특정한 작업을 발생시키는 Hook이다. 이로써 클래스형 컴포넌트에 있는 생명주기 메소드들을 함수형 컴포넌트에서도 useEffect로 사용할 수 있다.useEffect(function, deps)useEffect의 사

레이지 로딩은 이미지, 영상에 대한 로딩을 바로 하지않고 나중으로 미루는 것을 의미한다. 레이지 로딩을 적용시키지 않는 웹페이지를 열면 브라우저가 받아오는 모든 이미지를 읽고 불러와서 DOM 렌더링을 할 것이다. 이미지가 한두개면 상관이 없지만 100개~1000개의 많

JS를 통해 비동기 코드를 처리하는 가장 많이 사용하는 방법들은 콜백 함수, Promise, Async-await가 있다. 함수의 중첩이 심해질수록 콜백 함수는 심하게 복잡한 구조를 갖고, Promise가 여러개가 있는 상황에서는 에러를 디버깅하기 힘들었다. async

웹서비스는 Front-end, Back-end, DataBase로 이루어져 있고 이러한 구성으로 제작된 서비스를 user가 Browser를 통해 이용하게 된다.DataBase 연결방식에는 크게 ORM과 ODM으로 나뉜다.ORM은 데이터를 Table(표) 내부에 객체 형

useEffect는 컴포넌트가 다 그려진 후에 실행되는 함수이다.useEffect에는 (()=>{},\[]) 형태를 가지는데 이때 {} 내부의 것들은 useEffect가 실행될 때 작동하는 것들이고 \[]는 의존성 배열이라고 부르며 \[]안의 어떠한 요소든 변경될 때,

Ant-Design과 Material-UI 같은 UI프레임워크를 사용하면 개발자가 스스로 이미 디자인된 다양한 컴포넌트들을 만들 수 있도록 도와준다. 처음 세팅할때만 yarn add antd 와 같은 명령어로 프레임워크 초기세팅을 해주고 antd 사이트에 들어가서 사용

이벤트 버블링은 이벤트가 발생했을 때 해당 이벤트가 하위의 화면 요소에서 상위의 화면 요소로 전달되는 현상을 말한다. 위 그림처럼 내가 최하위 div태그에 이벤트 발생을 시키면 이 이벤트가 상위요소들로 이벤트가 전달된다는 것이다.이러한 특성을 반영하여 event를 다룰

호이스팅은 함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 유효 범위의 최상단에 선언하는 것을 말한다.자바스크립트에서 Parser가 함수 실행전 함수들을 한번씩 훑고 함수내에 존재하는 변수/함수선언에 대한 정보를 저장해두었다가 실행시킨다.즉, 함수 내에서 아래쪽 코

React에서 state나 상위컴포넌트에 있는 다양한 변수들을 다른 파일의 하위컴포넌트에서 쓰고 싶을 때가 있다. 이때 props라는 것을 사용한다.예를들어 import 하위컴포넌트 from '하위컴포넌트 경로'<상위컴포넌트> <하위컴포넌트 상위컴포넌트의 변