도시의 침묵보다는 바다의 속삭임이 좋아요

안녕하세요! 오늘은 30기 sopt 앱잼에서 처음 사용해보게 된, Recoil에 대해 사용해본 경험을 담아 포스팅해보려고 합니다 ヾ(≧▽≦*)o 0. React의 한계 React는 단방향으로 바인딩을 하는 라이브러리다. 그래서 부모 component에서 자식 component방향으로만 state를 props로 전달할 수 있고, 자식의 props를 부모에게 전달하는 방법은 없다! 없지만..! 자식 component에서 부모 component의 state를 아예 바꿀 수 없는 건 아니고, 다음과 같은 방법이 존재한다. 부모의 state를 바꾸는 setState 함수를 자식에게 넘겨준다. 상태 관리 tool 을 사용한다. 1번의 경우 , 자식을 내려보내는 depth가 조금만 깊어지면 1번의 방법은 효율적이지 ..

※배워가고 있는 학생입니다. 틀린 내용이 있다면 댓글로 피드백 부탁드립니다😊 1) 개요 웹 어플리케이션을 만들다 보면 반복되는 코드를 작성할 때가 있다. 그래서 오늘은 리액트에서 반복되는 코드를 효율적으로 작성하는 방법에 대해 적어보려 한다! 2) map() 함수 자바스크립트 배열 객체의 내장 함수인 map 함수를 사용해서 반복되는 컴포넌트를 렌더링할 수 있다. map 함수는 파라미터로 전달된 함수를 사용해서 배열 내 각 요소를 원하는 규칙에 따라 변환한 후 그 결과로 새로운 배열을 생성한다. arr.map(callback, [thisArg]) • callback: 새로운 배열의 요소를 생성하는 함수 - currentValue: 현재 처리하고 있는 요소 - index: 현재 처리하고 있는 요소의 inde..

※배워가고 있는 학생입니다. 틀린 부분이 있다면 댓글로 피드백 부탁드립니다!😁 리액트를 막 배우기 시작하면서, 처음 부딪친 난관은 바로 JSX 였다! html 만 공부하던 나에게 조금 혼란을 주는 문법이었는데, 오늘 스터디에서 현직자분이 가르쳐주신 덕분에! (감사합니다ヽ(✿ﾟ▽ﾟ)ノ) 조금 명확해질 수 있었다. 그래서 알게 된 이참에 저서를 참고해서 조금 정리해두려고 한다. 1) JSX 문법이란? 근본적으로, JSX는 React.createElement(component, props, ...children) 함수에 대한 문법적 설탕을 제공할 뿐입니다. -React 문서- JSX는 자바스크립트의 확장 문법이며 XML과 매우 비슷하게 생겼다. 이런 형식으로 작성한 코드는 브라우저에서 실행되기 전에 코드가 번..