Home
Taewok
Cancel

[JavaScript] ES6 const와 let 이해하기

const constant(상수)를 뜻하며 ‘항상 같은 수’를 말한다. 값을 재할당 할 수 없다. 재선언은 할 수 없다. const name = "독고진"; name = "구애정"; console.log(name); //실행결과 TypeError: Assignment to constant variable. const 변수는...

[React] react-github-calendar 사용하기

사용하게된 이유 백엔드에서 user에 github 정보를 받아오는데 잔디까지 가져오는데 어려움이 있어 직접 알아보니 프론트에서 react-github-calendar라는 라이브러리를 사용하면 간편하게 잔디를 가져올 수 있다고 한다. 설치 npm install react-github-calendar //npm 사용시 yarn add react-...

[JavaScript] this란?

자바스크립트 this란? 공식문서 피셜 this의 값은 호출한 방법에 따라 결정된다...라는데 사실 잘 모르겠다 그러니 직접해보자 자바스크립트 this 사용해보기 기본 세팅 index.js 객체 안에 함수도 가능 함수 안에 함수도 가능 const name = { name: "오윤희", getName: function () {...

[Html] from origin 'null' has been blocked by CORS policy 에러발생

에러 발생 index.html 파일을 Open In Default Browser(Alt+B)로 실행하니 index.js를 불러오려고 하는 부분에서 위와 같은 Error가 발생했다. 해결방법 1. http-server가 설치돼 있지 않다면 npm install http-server -g 2. http-server 실행 npx http-...

[React] 'value' prop on 'input' should not be null 에러발생

팀 프로젝트를 진행하던 중 잘 동작하던 코드에 콘솔에 위와 같은 에러가 생겼다. 아무래도 백하고 통신 중 input 값에 null이나 undefined 값이 들어가서 그런 것 같다. 동작하는 데는 아무 문제가 없지만 에러 콘솔은 없을수록 좋으니... 해결방법 input에 value 부분에 null 혹은 undefined 값일 때의 대처를 작성해...

[React] onClick 사용하기

react onClick이란? - react에서 자주 사용되는 이벤트로 html 요소를 클릭했을 떄 실행할 함수를 말한다. onClick 기본 사용법 App.js onClick은 클릭했을떄 함수를 실행하는 것 이기 떄문에 ()=>를 사용해 함수를 만들어준다. function App() { return ( <div&g...

[JavaScript] Date함수 사용하기

자바스크립트 Date함수란? - 날짜와 시간을 위한 메소드를 제공하는 함수 이다.(년, 월, 일, 시, 분, 초, 밀리초) Date함수 다양히게 다루기 1. 기본 형태 현재 위치한 국가에 현재 시간을 반환해준다. 하지만 기본 형태를 그대로 쓰는 경우는 실전에선 거의 없다. const date = new Date(); consol...

[React] react-router 사용하기

react-router란? a태그를 사용해 페이지 이동을 한다면 새로고침과 같은 현상이 일어난다. 하지만 react-router는 신규 페이지를 렌더링 하지 않고 url 주소에 따라 선택된 데이터를 하나의 페이지에서 렌더링 해주는 라이브러리 라고 볼 수 있다. react-router 사용준비 1. 라이브러리 설치 npm install reac...

[JavaScript] [...]스프레드 연산자란?

스프레드 연산자란 spread는 ES6에서 도입된 문법으로 단어 자체는 펼치다,퍼뜨리다 라는 의미를 가지고 있으며 객체나 배열을 펼칠 수 있다. 기본의 객체나 배열은 변하지 않으며 새로운 객체나 배열을 변화시킨다. 사용 상황 1. 객체에서 사용 const object1 = { name:"오윤희", job:"vocalist" ...

[React] react-icons 사용하기

react 프로젝트에서 간편하고 퀄리티있는 아이콘을 사용하게 해주는 라이브러리~~ https://react-icons.github.io/react-icons/ 리액트 아이콘!!!! 사용전 준비 우선 해당 react 프로젝트 터미널에 라이브러리를 설치 해준다. npm install react-icons --save // npm 사용시 yarn ad...