본문 바로가기

React32

React Slick 사용법 🌳 React Slick 리액트 프로젝트에서 carousel을 쉽게 구현하도록 도와주는 모듈 👉🏻 React Slick 홈페이지 👉🏻 슬라이드 종류 1. 다음과 같은 명령어를 터미널에 입력해서 설치해준다. $ npm install react-slick --save $ npm install slick-carousel --save 2. 그리고 Slick에서 제공해주는 CSS를 사용하기 위해 다음의 코드를 import해준다. import "slick-carousel/slick/slick.css"; import "slick-carousel/slick/slick-theme.css"; 3. 기본 형태는 다음과 같다. import React, { Component } from "react"; import Slider.. 2021. 11. 16.

[React] Too many re-renders. React limits the number of renders to prevent an infinite loop. 백엔드와 데이터를 연결한 후 게시판 리스트를 받아오다가 이런 에러를 만났다...!!! (동공지진) 검색 함수를 실행할 때 저렇게 함수명만 호출해서 그런 것이였다. 아래와 같이 적용해주니 더이상 뜨지 않았다. setKey({ ...searchKey, is_active: e.value })}>검색 2021. 11. 16.

Custom-Hook Custom-Hook은 사용자 정의 Hook이라는 뜻이다. 사용자 정의 Hook은 다른 hook을 호출할 수 있다. 사용자 정의 Hook은 특정한 시그니처가 필요 없다. 무엇을 인수로 받아야 하며 필요하다면 무엇을 반환해야 하는 지를 사용자가 결정할 수 있다. 사용자 정의 Hook의 이름은 “use”로 시작되어야 한다. (관습) 사용자 정의 Hook은 이전 React 컴포넌트에서는 불가능했던 로직 공유의 유연성을 제공한다. 참고 사이트 👉🏻 자신만의 Hook 만들기 2021. 11. 16.

[TypeScript] tsc-watch -onSuccess " node dist/index.js" Cannot find module 'typescript/bin/tsc' error Command failed with exit code 9. $ npm i -D @types/node typescript ts-node 로 해결 가능하다. 2021. 11. 16.

[생활코딩-React] State 사용 [출처 : Youtube - 생활코딩] https://youtu.be/e2c1EUcW7oo?list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi 오늘 배우는건 이해하려하지말고 그냥 그렇구나 하고 받아들이는게 편하다고 한다... ※주의 : 리액트에서는 props에 따옴표를 쓰면 문자로 인식을 한다. 문자가 아니라 자바스크립트의 코드로서 실행하게하고싶으면 중괄호{}를 사용하면 된다. src/App.js import './App.css'; import TOC from "./components/TOC"; import Content from "./components/Content"; import Subject from "./components/Subject"; import React, { Com.. 2021. 5. 29.

[생활코딩-React] Component 파일로 분리하기 [출처 : Youtube - 생활코딩] https://youtu.be/8hGqznPGVc0?list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi src 디렉토리 안에 components 디렉토리를 생성한다. components 디렉토리 안에는 TOC.js라는 파일을 생성한다. TOC.js 파일에다가 App.js의 TOC 클래스를 복붙한다. 아래의 코드도 같이 복붙한다. import React, { Component } from 'react'; 'react라는 라이브러리에서 Component라고 하는 클래스를 로딩한다' 라는 뜻이다. 리액트를 사용할 땐 필수적으로 넣어야하는 코드라고 생각하면 된다. TOC라는 클래스를 외부에서 사용할 것을 허용하는 코드도 작성한다. export defau.. 2021. 5. 29.

이전 1 2 3 4 5 6 다음

티스토리툴바