객체 구조 분해 할당으로 파라미터 다루기 (JavaScript Destructuring Assignment) ({a, b, ...others})구조 분해 할당이란?JavaScript에서 함수를 호출할 때 객체를 파라미터로 넘기면, 특정 값만 따로 변수로 받고 나머지는 그대로 유지하는 방법이 있는데이런 기법을 객체 구조 분해 할당(Object Destructuring Assignment) 이라고 합니다. 함수를 호출할 때 { key: value } 형태의 객체를 넘겨줄 경우, 함수 내부에서 필요한 값만 골라서 사용할 수 있도록 해주는 문법인데이렇게 하면 불필요한 코드 작성을 줄이고 가독성을 높일 수 있어 사용합니다. 기본 사용법(1) - 각 객체 모두 등록다음처럼 함수를 정의할 때, 객체에서 특정 키만 추..

[React] Invaild host Header 오류 발생React 로컬 실행 Errornpm run start Invaild host Header로컬 실행 시 기본 세팅이 로컬에서의 접속은 허용하지만 외부에서의 접속을 허용하지 않아서 발생하였습니다.해결방법아래 경로에 진입하여 disableFirewall 에 따른 분기값을 수정해줍니다. node_modules/react-scripts/config/webpackDevServer.config.js//before (주석부분은 삭제하였습니다)const disableFirewall = !proxy || process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true'; return { allowedHosts: disableFir..

React Sitemap 생성 및 Google Search Console 제출sitemap 생성Google Search Console 제출Sitemap 생성 및 프로젝트 적용https://www.xml-sitemaps.com/대표적인 sitemap 생성 사이트로 위 사이트에 진입하여 본인의 URL을 입력하면 자동으로 sitemap 생성을 지원해줍니다. START아래의 More Options를 누르면 몇몇 옵션들을 추가로 선택하여 적용이 가능합니다.Include "Page Last modification" attribute : 변경되지 않은 페이지를 크롤러가 재크롤링하지않음.Automatically calculate "Page Priority" attribute : Page Depth에 따라 우선순위 설..

보호되어 있는 글입니다.

HEROKU | at=error code=H10 desc="App crashed" method=GET path="/" hostHeroku 빌드팩 에러 대응환경 : React TypeScript1. 헤로쿠 빌드팩 추가 -heroku buildpacks:set mars/create-react-app명령어를 통해 heroku 빌드팩 변경 하면 아래와 같이 변경된다.  BeforeAfter이후 git push heroku master 를 이용하여 배포하면git push heroku master Stack heroku-22 is not supported!아 ㅋㅋ.. 빌드팩이 헤로쿠22를 지원안한다네요 2. 빌드팩 22 버전 에러 해소22를 지원하는 빌드팩으로 변경을 하려다헤로쿠를 우선 20으로 변경하고 사용해보려..

React에서 클래스 변수와 state 변수의 차이점 선언 방법: 클래스 변수는 constructor() 안에서 this.변수명 = 초기값 형태로 선언하며, state 변수는 class 내부에서 state = { 변수명: 초기값 } 형태로 선언합니다. 업데이트 방법: 클래스 변수는 직접 값을 변경할 수 있지만, React에서는 setState() 함수를 통해 state 변수를 업데이트해야 합니다. 컴포넌트 렌더링 영향: 클래스 변수의 값이 변경되어도 컴포넌트가 다시 렌더링되지 않습니다. 반면에 state 변수의 값이 변경되면 컴포넌트가 다시 렌더링됩니다. 변경 가능성: 클래스 변수는 언제든지 값을 변경할 수 있지만, state 변수는 setState() 함수를 통해서만 값을 변경할 수 있습니다. 따라서,..