코딩기록

* useEffect() useEffect(() => { console.log("chchchch") }); - 상태 값이 변경 되서 다시 렌더링 된 다음에 호출 - 불필요한 실행을 막기 위해 두번째 매개변수로 배열을 전달 useEffect(() => { console.log("change") }, [count]); - 이 경우엔 count (의존성 배열) 가 변경될 때만 실행 useEffect(() => { console.log("change") }, []); - 렌더링이 된 후 최초에 한 번만 실행하려면 빈 배열로 실행

npm install -g json-server json-server --watch ./src/db/data.json --port 3001 ./src/db/data.json --port 3001 < - 여기는 경로설정

리액트 강의를 따라하던 중 react-router-dom에서 오류가 나는 것을 확인하고 찾아봤더니 강의는 버전 5로 제작되었고 지금은 리액트가 버전 6으로 업데이트 되면서 생긴 문제 - Switch -> Routes 로 바꿔주고 elment에 컴포넌트 파일을 넣음 - 하란대로 했지만 그래도 안되고 계속 빨갛게 이런 오류가 발생 ERROR in ./node_modules/react-router-dom/dist/index.js 13:0-812 -! node_modules 폴더 지워준 다음에 다시 npm i 해서 설치했더니 해결

리액트 강의 듣는데 다운로드 받은 파일 실행시키려면 npm install --save --legacy-peer-deps 하고 npm start 하면 실행됨!

return ( {Error && } 이름 나이 ) function Wrapper(props) { return props.children; } export default Wrapper 리액트에서 불필요한 div를 덜 생성하기 위해서 Wrapper로 컴포넌트를 감싸줌 import React, { useState, Fragment } from 'react'; return ( ); 를 사용하면 더 간단하게 가능!

1. 먼저 깃허브에서 new repository 생성 2. vscode 터미널에서 연동해주기 git init git remote add origin https://github.com/깃허브아이디/프로젝트명.git git remote -v git branch git push origin main 아래 코드는 깃허브가 잘 연결됐는지 확인하는 거라 생략 가능 git remote -v (깃허브 잘 연결됐나 확인) git branch(브랜치가 main인지 확인) 혹시나 push 하는 과정에서 오류가 뜬다면 git pull origin main --allow-unrelated-histories git push origin main 로 시도하기 3. gh-pages 설치 npm install gh-pages 4. p..

const [counter, setCounter] = useState(1); ... setCounter(counter + 1); const [counter, setCounter] = useState(1); // ... setCounter(prev => prev + 1); 위 아래 코드 모두 동일하게 작동되지만 아래 코드로 사용해야함 위 코드를 사용하면 상태가 예상과 다르게 업데이트 될 수 있으므로 이전 상태를 사용하는 게 좋음

우선 두 강의 다 처음부터 끝까지 학습한건 아니고 중간의 백 부분은 학습하지 않은 상태입니다..흑,, javascript 완벽 가이드 : 초급 + 고급 마스터 과정 the web developer 부트캠프 2023 두 강의 다 유명하고 후기도 많은 강의입니다. 처음에 javascript 완벽 가이드를 듣다가 부트캠프 2023을 추가로 들었는데요. 저 같은 경우엔 자바스크립트 이해도가 낮은 상태여서 자바스크립트를 이해하고 제가 사용할 수 있는 것이 중요했습니다. 자바스크립트 실력 마이너스 천만점이었는데 지금은 마이너스 백만점 정도로 조금 성장한 것 같아요. 나름 결과가 있습니다,, 우선 저처럼 비전공자이면서 자바스크립트의 이해도가 낮다! 고 하면 부트캠프 2023을 추천 드립니다. 앞에 html, css강..

!오류 해결 못했습니다.. 스와이퍼 안에서 실행되는 datepicker 왼쪽 사진 처럼 슬라이드 안에서도 주간 선택이 잘 실행된다. 하지만 이번 달에서는 주간 선택이 실행되지 않음... ㅎ? 안될거면 다 안되던가 이건 무슨 오류일까,, 근데 웃긴건 마지막 슬라이드에서는 또 주간 선택이 잘 됨...^^ 미쳐버리는 datepicker입니다,, https://codepen.io/hhsshsii-ii/pen/xxmgbVa * 혹시 사용하실 분 계시면 air-datepicker 를 사용중이고 moment.js가 필요합니다! $('.date_week').datepicker({ language: 'ko', autoClose: true, navTitles:{ days: 'yyyy년 mm월', /* 일별 달력 타이틀 *..

$('.date_week').datepicker({ language: 'ko', autoClose: true, startDate:new Date(), navTitles:{ days: 'yyyy년 mm월', /* 일별 달력 타이틀 */ months: 'yyyy년', /* 월별 달력 타이틀 */ years: 'yyyy1 - yyyy2' /* 년별 달력 타이틀 */ } }) const swiperDate = new Swiper('.swiper-container',{ slidesPerView: 1, spaceBetween: 0, allowTouchMove:false, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev', }, on..