React

State,Props 1.state 컴포넌트 내부에서 가지고 있는 컴포넌트의 상태값 state는 화면에 보여줄 컴포넌트의 정보(상태)를 지니고 있는 객체 보여지기 위해 반드시 렌더 필요 State에서 상태값을 설정하는 이유는? 결국 컴포넌트 안의 요소에서 그 상태

왜 리엑트인지? 웹3세대 특징 (spa)-single page application. 규모가 커지고 복잡한 애플리케이션을 개발하며 생산성을 향상시키고 많은 양의 데이터 관리와 코드 유지 보수를 더욱 편리하게 하기 위해 다양한 frontend Framework(libra

🐥React를 공부하며 접하게 되는 컴포넌트의 생명주기 Component Lifecycle이란 도대체 무엇인가?공부하며 너무 헷갈리는 개념이어서 이번에 정리를 해보려고 한다.우리가 사용하는 브라우저의 페이지는 웹 컴포넌트로 구성이 되어있다.React에서는 각 컴포넌트

cannot read property '0' of undefined는 해당 값이 어느 순간에 비어있다는 뜻! 상태값 시점에 관한 문제라면 React의 Lifecycle과 연관이 있다. Mockup 데이터를 구성하여 import하거나 프로젝트가 시작되고 백엔드 A

그라폴리오 클론 (1차 프로젝트)후기 개발 인원 및 기간 개발 기간:10/19-10/30 개발 인원: 프론트엔드 4명, 백엔드 2명 구현 기능 (내가 맡은 부분) 작품 상세 페이지 담당

Hook은 함수 컴포넌트에서 React state와 생명주기 기능을 연동(hook into)할 수 있게 해주는 함수입니다.Hook은 class안에서는 동작하지 않는다.대신 class없이 React를 사용할 수 있게 해주는 것이다.왜 사용하는가?컴포넌트 사이에서 상태와

소셜 로그인이란? 현재 2차 프로젝트를 하며 소셜로그인 구현을 맡았다. 아직 구체적으로 Flow를 잘 모르겠어서 정리를 해보려고 한다. 카카오 로그인을 중심으로 기록해본다! 🍊어떻게 카카오로 가입한 적이 없는 서비스에 로그인을 할 수 있을까? 카카오 로그인 연동

Git rebase? 기준을 설정한다는 의미. 1.백업 Git rebase하기 전에 파일을 날릴 수 있으니 미리 백업을 해둔다. > cp -rpv adwards-frontend adwards-frontend2 cp -rpv옆에 왼쪽 것이 현재의 폴더명, 오른쪽이

Redux?자바스크립트 앱을 위한 예측 가능한 상태 컨테이너Redux는 일관적으로 동작하고 서로 다른 환경에서 작동하고 테스트하기 쉬운 앱을 작성하도록 도와준다. 여기에 더해서 시간 여행형 디버거와 결합된 싨시간 코드 수정과 같은 개발자 경험을 제공한다.Why Redu

응답이 오면 response.json()을 통해 json 데이터를 js로 요청하기 위해 한번 더 요청 js변환 후 두번째 .then을 통해 응답을 받은 후의 로직이 실행된다. method가 post인 경우 회원가입 회원가입 정보를 서버에 보내고 응답을 받음 f

2차 프로젝트_Function of Beauty site clone 후기 🍏* 개발인원 및 기간* 개발 기간 : 11/2 ~ 11/13 개발 인원 : 프론트엔드4명, 백엔드2명 커스터마이징 헤어제품을 주 제품으로 판매하는 미국 브랜드 사이트 클론을 진행 내가 맡은

아직 익숙하지 않은 리덕스. 다시 정리한 것을 기록해보자! 리덕스는 state를 관리한다!

기존 페이지에서 작성하다말고 다른 페이지로 넘어가려고 하면 팝업 모달 창을 띄우는 것이 이번 목표! 네를 누르면 내가 가고자하는 다른페이지에 이동할 수 있게하고,아니오를 누르면 그대로 기존 페이지에 머무를 수 있게 하고 싶다.처음해보는 모달창! 계속안되서 이방법도 써보

현재 기업협업으로 리액트로 만든 웹페이지를 디버깅 중이다. 항상 현재 위치한 페이지를 입력하다 나가려고 하면 모달창이 뜨게 만들었다. 그러나, 유저가 포인트가 부족한 경우도 고려해서 그 경우에는 모달창이 아예 안뜨게 만드려는 것이 목표다. 1번째 케이스 지금 위 케

기업협업 중 기억에 남는 코드로그인하고 로딩이 된다는 것(로딩이미지)을 표시해주고 로그인성공하고 다음 페이지로 넘어가게 하고 싶다!우선 나는 라이브러리 활용해서 loading spinner를 넣어줬다.위와 같이 아이디+비번을 입력하면 로그인 버튼이 활성화 된다.이에 덧

여전히 useEffect가 쉽지 않은 나지만 다른 Hook도 배워야할 필요성을 많이 느꼈다.성능 최적화를 위해서, 그리고 새로운 것을 배우는 것에 도전하기 위해..!useMemo와 useCallback은 리액트의 렌더링 성능 최적화를 위한 hook이다.참고할 부분1\.