# React-slick

hi6863

'react-slick' 라이브러리를 사용하면서 다음과 같은 경고 메세지를 만났습니다.해석해보면 react-slick 컴포넌트가 Infinity라는 유효하지 않은 값을 width CSS 스타일 속성에 적용하여 발생한다고 합니다.처음에는 css 속성 중에 값이 잘못들어가

dumibell

프론트엔드 개발을 하다보면 캐러쉘이라고도 불리는 slider를 구현할 일이 정말정말 많은데 이 때 우리를 정말 편리하게 해주는 갓갓갓라이브러리가 있다. 바로 ✨slick✨이다. https://www.npmjs.com/package/react-slick WOW…! 어

cometes

FrontEnd TIL DAY12

seonghae

레이아웃 구조잡기레이아웃 HIDDEN 영역 설정하기슬로벌 스타일 적용하기폰트레이아웃이란 프로젝트 전체의 UI 구조를 의미합니다.쉽게 말하면, Header, Navigation, Menu, Footer, Main 등으로 화면을 쪼개는 일을 의미합니다.app.tsx 작동원

jaehoon0822

React Slick 을 공부하면서 써보았었다. 당시 때 는 잘 작동하여, 그냥 저냥 API 보고 만들면 되겠거니 했지만, 오늘 요상스럽게 작동하기 시작한것이 마음에 걸려 정리하고자 글을 쓴다React Slick 은 매우 잘 정의되어 있는 Carousel 이다.하지만

zeon8080

오늘은 라이브러리의 캐러셀을 불러오는 방법을 적어보겠다.캐러셀은 이미지나 텍스트의 슬라이드를 가로로 슬라이드시켜 여러 개를 표시하는 컴포넌트이다.위의 캐러셀을 다운 받는 법은 간단하다.👉🏻캐러셀 다운로드 링크👈🏻링크를 타고 들어가면 npm을 사용하면npm ins

seongsimk

react-slick을 이용해서 한페이지에 여러개의 carousel(slick) 구현하는 과정을 기록한 글입니다. 다소 부족한 점이 있으나 공부의 목적으로 작성하는 글이니 여러 배움을 주시는 피드백을 환영합니다!

aimzero9303

styled-component를 사용해 react-slick의 스타일을 수정하려면, styled()에 import로 불러온 Slider를 넣어주면 된다.

namyeji

우선 react-slick을 다운받아줍니다.(yarn 사용함) 그리고 타입스크립는 타입스크립트용 슬릭을 하나 더 깔아줍니다. 저는 src/components/commons/layout/banner/banner.slick.tsx 에 슬릭 SimpleSlider 를 복

eomdh

react-slick으로 캐루셀 구현

owlsuri

이전에도 react-slick arrow custom을 했지만, 같은 방법으로 했는데 (여기에 기본 설치와 커스텀 방법이 있음) 한쪽(왼쪽) arrow가 이미지의 맨 아래로 들어가서 zIndex가 적용되지 않는 상황이 발생했다. 왜지?? 그래서 찾아헤멘 두번째 방법! react-slick arrow custom settings에 있는 arrow를 fa...

okpyo12

react-slick으로 슬라이드 만들기

mango1004

프로젝트에 React-slick 라이브러리와 input 태그의 multiple 속성을 사용하여 이미지 CRU (Create, Read, Update) 구현하였다.구현하는 도중 버그아닌 버그(?)를 발견하였다!먼저 아래는 React-slick에서 제공하는 slider의

binest03459

react-slick, Carousel

hoje15v

이번 2차 프로젝트에서는 라이브러리를 자유로이 쓸 수 있었다(!)레이아웃 과정에서 구현해보고 싶었던 기능이 이미지 슬라이드 부분이었다. 1차 프로젝트 때는 라이브러리를 사용하지 않고 transformX 와 transition을 활용했는데, 이번에는 Styled Comp

mrvanc

현재 내가 만들고 있는 트위터 비슷한 이 노드버드 프로젝트에는 사람들이 게시글을 올릴 수 있고, 그 게시글에는 기본 글 외에도 이미지,해쉬태그 등을 올릴 수 있을 것이다.이미지 작업을 해보자.우선 post reducer의 맨 처음 게시글에는 3종류의 이미지를 넣어주었다

kimareum

포트폴리오 리뷰 오와 원두멘토님은 되게 ㅇ예쁘게 해오셨다 ! 근데 잼라이브.. 넘 고인물 아닌가 ? 푸합.......약간 큐플레이 느낌...헤헹 하지만 존경합니다 멘토님 이 폴더 구조 잊지 말고 component가 레이아웃에 prop.children으로 들어가는거

kimareum

goodmorning self study이제 알고리즘이 어렵다 나에게 너무...풀었던 문제도 다시 푸는 습관을 들여야한다.. 이문제는 풀이보고 겨우 이해한 문제이고..! 이문제는 풀이를 찾아보고도 이해못한 문제 ^^>...눈물나네 아침부터 굿모닝 아니네.... 이따 알

dkdlel102

일단, npm 혹은 yarn으로 react-slick과 slick-carousel을 설치합니다.혹은(타입스크립트 사용시 @types/react-slick 추가 설치)가장 먼저, 슬라이드 설정을 해줘야 합니다.dot: 슬라이드 밑에 점으로 나타내는 것을 보여주냐 여부 설

seokkitdo

react-slick 라이브러리는 React Carousel을 사용하기 쉽게 라이브러리화 시킨것을 의미합니다.실제로 react만을 이용해 carousel을 만들경우, 하단에 무한 carousel 이나 하단에 dot 등 고려해야 할 것이 많기 때문에 사용법만 안다면 훨씬