dev42 [React] Carousel 기능 구현 위 쇼핑몰 메인페이지 기능구현 중 상단 이벤트 배너를 Carousel 기능으로 구현하려고 한다!🧐 📍Carousel 의 사전적인 의미는 회전목마로, 회전목마가 빙빙 도는 것처럼 이미지나 텍스트의 슬라이드를 가로로 슬라이드시켜 여러 개를 표시하는 컴포넌트이다. 실은 Carousel 을 편하게 만들 수 있는 라이브러리는 많지만 여러가지 기능이 들어가 있어 React공부에 많이 도움이 될거 같아 라이브러리를 쓰지 않고 직접 하나하나 코드를 짜보려고 한다 (그래서 탈도 많고 에러도 많고 나도 울 예정) ✅ 나중에 볼지도 모르니 정리해 놓는 Carousel 라이브러리 https://swiperjs.com/demos Swiper Demos Swiper is the most modern free mobile touc.. 2023. 5. 31. promise 대체 왜 사용하는걸까? 비동기는 언제끝날지 예측하기 어려울떄, 주가되는 작업이 아닐때 비동기 처리를 많이한다. 대표적으론 통신할때 비동기적 처리를한다. 서버와 웹브라우저가 통신을 할때 통신이 언제 끝날지 예측하기 어렵다. 이유는 인터넷이 느릴수도 서버가 느릴수도 있기 때문인다. 통신이 끝날때까지 아무일도 못하는 것보다는 통신이 끝날때까지 다른 작업을 하다가 통신이 끝날때 콜백이 호출되면서 필요한 작업들을 나중에 하면 좋을것이다. 이럴때 사용하는 것이 promise 이다. promise는 지금없으니까 이따 이상없으면 주고 이상 있으면 알려줄게 와 같은 약속이다. 서버와 통신을 통해 비동기적 처리하는 예시를 한번보자 먼저 웹서버와 웹브라우저가 통신할때 사용하는 'fetch' api 와 그 fetch 가 사용하는 promise가 있.. 2023. 5. 1. 비슷한 객체를 여러개 만들어보자! ✅ 생성자 함수 비슷한 객체를 여러개 만들어야할때 어떻게 해야할까? 그리고 만약 그 수가 100개 1000개가 된다면? 이럴떄 사용하는 것이 생성자 함수 이다! 보통 붕어빵 틀로 예시를 많이 든다. - 생성자 함수명은 관레적으로 첫글자를 대문자로 한다. - new 연산자를 이용해서 함수를 호출하여 객체를 생성한다. : 일반 함수호출에서 new 연산자를 붙이면 자동적으로 객체를 생성한다 이렇게 반환된 객체를 인스턴스(instansce)라고 한다. //todo 생성자 함수 function Factory() { } //* 일반적인 함수 호출 let factory1 = Factory() // undefined //* new 연산자를 붙인 함수 호출 let factory2 = new Factory() // Fac.. 2023. 4. 19. 함수 다시 한번 보기 ✅ function function num(a, b) { return a + b } num(3, 4) // 7 함수는 코드 조각의 모임으로 코드를 모아놓은 저장창고 역할을 한다. 함수와 메서드에 입력 변수이름인 parameter(매개변수) 와 함수와 메서드에 실제 입력되는 값인 argument(전달인자, 인수)가 있으며 return으로 값을 반환받는다. 함수는 return구문 을 만나면 종료된다. return문이 없거나 return 지시자만 있는 함수는 undefined를 반환 return문이 없는 함수도 무언가를 반환합니다. undefined를 반환 function fun() { console.log('hello1'); console.log('hello2'); return console.log('hel.. 2023. 4. 15. 이전 1 2 3 4 5 ··· 11 다음
