안녕하세요

오늘 하루 열지 않기 CLOSE 우선 팝업창이 화면 전체를 덮도록 합니다. .popup { display: none; position: fixed; top: 0; left: 0; right: 0; height: 100vh; background: rgba(0, 0, 0, 0.25); z-index: 9999; } 팝업창에 cookie를 만들어 주고, cookie가 없다면 나타나도록 합니다. var getCookie = $.cookie('popup'); if (!getCookie) { $('.popup').show(); } 만료 시간을 정해주면 됩니다. { expires: 1 }로 설정하면 1일동안 보여주지 않기 입니다. input(체크박스)에다가 change 이벤트를 주고, 체크박스를 표시하게 되면 1일동..

react slick 활용 slick을 import 합니다. import Slider from "react-slick"; import "slick-carousel/slick/slick.css"; import한 Slider 태그 안에 슬라이드를 넣으면 됩니다. 끝... 01 02 03 ref 를 사용하여 태그를 다룰 이름을 지어줄 수 있습니다. const s1 = useRef(); return ( 01 02 03 slick의 속성 중에서 slickPrev(), slickNext()를 이용하여 태그에 버튼 기능을 추가할 수 있습니다. s1.current.slickPrev()} > s1.current.slickNext()}> react slick 화살표를 없애는 속성 입력 방법입니다. const set = {..

html구조를 직접 짜는 것이 아니라 for문으로 리스트를 만듭니다. for ( i=0; i { fetch("https://jsonplaceholder.typicode.com/todos/1") .then((response) => response.json()) .then((json) => setData(json)); }, []); return ( {/* */} {/* */} {console.log(data)} ); 무한 루프가 도는 상황에서 useEffect()를 사용하면 콜백함수를 한 번만 실행하도록 합니다. 산돌구름 pretendard 폰트 적용 방법입니다. 1. 글꼴을 다운로드 받습니다. https://cactus.tistory.com/306 2. web폴더의 static폴더 안의 pretendard..

리액트 1. App.js 컴포넌트에 작성됩니다. import React from "react"; import ReactDOM from "react-dom/client"; import App from "./App"; const root = ReactDOM.createRoot(document.getElementById("root")); root.render( ); 2. App.js에서 html 구조를 만들고, section을 이루는 component들을 가져오게 됩니다. import Test from "./list"; const App = () => { return ( ); }; export default App; 3. react에서는 tag에 직접 function을 줍니다. const Test = ({ l..