1인당 1개의 제품만을 구매할 수 있는 조건을 가진 상품이라면 중복으로 장바구니에 담기는것은 당연히 안될것입니다. 제품을 장바구니에 담은후 또 같은제품을 장바구니에 담으려는 시도를하면 중복구매는 할수없다고 알림창을 띄어주는것이 사용자 경험에 좋을것입니다. 저는 NFT 거래소 사이트를 만들고있는데 NFT도 1개의 NFT는 중복으로 장바구니에 담을수 없기에 중복검사 로직 추가가 필요했습니다. Array.prototype.some() 을 사용해보자! 문법 arr.some(function(currentValue, index, array), thisValue)) some 메서드는 콜백함수의 반환값이 하나라도 true 라면 true를 반환하고 모두 false라면 false를 반환하게됩니다. 장바구니에 위와같은 배열..
function c(){ console.log('c') } function a(){ console.log('a') function b(){ console.log('b') c() } b() } a() c() a와 c 함수의 결과는 어떻게 될까? 일단 함수의 호출과 선언을 알아야한다. 자바스크립트 엔진은 코드를 위에서 아래로 읽으며 진행하게된다. 1. a() 함수가 호출되었으니 a함수의 선언문으로 이동하여 콘솔로그 'a'를 찍는다. 이후 선언문 아래로 진행. 2. b함수의 선언문이 발견되었다. 하지만 선언문이므로 그대로 밑으로 진행 3. b함수가 호출되었다 b함수의 선언문으로 이동하여 콘솔로그 'b'를 찍는다. 곧바로 'c'함수가 호출되어 콘솔로그 c를찍는다. 4. a함수 호출이 모두 끝났으므로 a함수 호출..
https://taejinii.tistory.com/50 FrontEnd - React-query 를 이용한 무한스크롤 구현하기 - (1) 무한스크롤 이란? 무한 스크롤은 웹사이트나 애플리케이션에서 사용되는 사용자 경험 기법 중 하나입니다. 일반적으로 긴 목록이나 콘텐츠가 있는 페이지에서 스크롤을 내리면, 새로운 콘텐츠 taejinii.tistory.com 첫번째 글을 안보신분들은 해당 글을 보고 오시면 됩니다. 첫번째 글에 이어 두번째 글에서는 데이터를 계속 불러와줄수있는 트리거를 해주는 Observer 에 대해서 설명하겠습니다. const Observer = () => { const [ref, inView] = useInView({ threshold: 0 }); useEffect(() => { if ..
무한스크롤 이란? 무한 스크롤은 웹사이트나 애플리케이션에서 사용되는 사용자 경험 기법 중 하나입니다. 일반적으로 긴 목록이나 콘텐츠가 있는 페이지에서 스크롤을 내리면, 새로운 콘텐츠가 자동으로 로드되어 사용자가 페이지를 더 이상 끝까지 스크롤하지 않고도 계속해서 내용을 볼 수 있게 됩니다. 무한 스크롤은 사용자가 페이지를 일일히 다음 페이지로 이동하지 않고도 계속해서 콘텐츠를 탐색할 수 있도록 합니다. 이는 특히 소셜 미디어 피드, 뉴스 웹사이트, 온라인 상점 등 콘텐츠가 계속해서 업데이트되는 경우에 유용합니다. 사용자는 스크롤을 하면서 새로운 콘텐츠가 자동으로 로드되기 때문에, 일정한 페이지 간격을 넘어갈 필요가 없고 보다 빠르고 원활한 사용자 경험을 제공합니다. 무한스크롤 왜 사용하였나? 저는 사이드..