profile
적는 자만이 생존한다.
post-thumbnail

9. Hooks

리액트가 업데이트 되면서 나온 개념대부분 개발할 때 사용함생성자 단계에서 state를 정의해서 사용하고 setState()함수를 통해 state를 업데이트할 수 있으며 Lifecycle methods를 제공함클래스 컴포넌트의 state 사용이 불가하며 Lifecycle

약 8시간 전
·
0개의 댓글
post-thumbnail

10. 숫자, 수학

10진수에서 2진수/16진수로 바꿀 필요가 있음결과값은 숫자결과값은 숫자결과값은 숫자소수점 둘째자리까지 표현기존 숫자에 100을 곱한뒤 반올림 하고 그것을 다시 100으로 나누면 됨만약 소수점 0번째 자리 즉 정수이거나 기존의 자리보다 더 내려갔을 경우??0번째 자리는

약 10시간 전
·
0개의 댓글
post-thumbnail

9. 심볼

지금까지의 property key 모양은 문자형 이였음.다음과 같이 유일한 식별자를 만들 수가 있음.비교연산자를 사용해도 같지 않음.전체의 코드 중에 딱 하나문자열을 전달해줘서 설명을 붙혀줄 수 있음object의 property로 넣어주기computed property

약 11시간 전
·
0개의 댓글

8. 객체 메소드

1. computed property 객체에 key값에 변수를 넣기 위해서는 []가 필요함 (템플릿 리터럴 안됨) 식 자체를 넣는 것도 가능함 함수 역시 가능하다. 2. 객체 메서드 가. Objcet.assign() 객체 복제 ![](https://velog

약 13시간 전
·
0개의 댓글
post-thumbnail

렌더링(SSR, SSG, CSR), Next.js 렌더링, 특징

정적 페이지 생성 방식으로 90년대 많이 사용하던 방식으로 현재는 변경되지 않는 웹 페이지의 최적화에 쓰임1) 개발자가 HTML, CSS 파일 묶음을 생성(정적파일)해서 웹서버를 생성하여 거기에 묶음(정적파일)을 업로드함. 클라우드에 올려둠2) 클라이언트에서 HTTP

4일 전
·
0개의 댓글
post-thumbnail

8. State와 Lifecycle

영어로 상태라는 뜻이 있고 리액트에서는 Component의 상태를 의미한다.여기서 상태는 정상 비정상이 아닌 데이터를 의미한다.즉 리액트 Component의 변경 가능한 데이터를 의미함State는 개발자가 정의 하며 반드시 데이터 흐름에 사용되는 값만 state에 포함

6일 전
·
0개의 댓글
post-thumbnail

7. 생성자 함수

이러한 것을 객체 리터럴이라고 하며 개발을 하다보면 이러한 객체를 여러개 만들 필요가 있다.(유저, 장바구니 등등)보통 함수에 대문자로 시작을 하며 this를 이용해서 이름과 나이를 인자로 받아주고 new 연산자를 이용해서 호출을 한다.생성자 함수 === 붕어빵 틀필요

7일 전
·
0개의 댓글
post-thumbnail

6. 변수, 호이스팅, TDZ

let과 var는 크게 다르지 않음에러가 나오지 않음에러를 반환함var aaa = "hi"를 선언하기 전에 콘솔에 찍어도 에러가 나오지 않음.애초에 정의되지 않았다고 오류가 발생함다음과 같이 var는 실제로 코드가 이동하지는 않으나 최상위로 끌어올라감.이를 호이스팅이라

2022년 6월 22일
·
0개의 댓글
post-thumbnail

7. components, props

props에 넣어서 react-component에 들어가서 만든 뒤 react-element라는 결과물이 나옴property라는 의미로 속성이라는 뜻으로 사용되며, react-component의 속성임props는 붕어빵의 재료라고 생각하면 됨즉 컴포넌트에 전달할 다양한

2022년 6월 20일
·
0개의 댓글
post-thumbnail

5. this

this는 함수 내에서 함수 호출 맥락(context)를 의미함.맥락이라는 것은 상황에 따라서 달라진다는 의미인데 즉 함수를 어떻게 호출하느냐에 따라 this가 가르키는 대상이 달라짐.자바스크립트에서는 this는 이 둘을 연결시켜주는 실질적인 연결점의 역할을 함.아무것

2022년 6월 20일
·
0개의 댓글
post-thumbnail

고차함수

함수를 인자로 받거나 또는 함수를 반환함으로써 작동 하는 함수원래 함수를 만들고 사용을 할때 함수명()을 하게 되면 함수의 결과값인 undefined가 나오게 되는데 이를 return 값으로 내가 실행하고자 하는 함수를 넣게 되면 undefined대신에 return 안

2022년 6월 18일
·
0개의 댓글
post-thumbnail

git 에러 : refusing to merge unrelated histories

새로운 프로젝트를 만들고 깃을 올려야 한다...언제나 그렇듯git remote add ~git add .git commit -m "~"git push origin main했지만 실패,,,,??구글링 결과git pull을 하시고 하셨어야지~pull 했고다시 push를 하

2022년 6월 17일
·
0개의 댓글
post-thumbnail

리액트 18 -> 17 다운그레이드 에러

18버전에서 17버전으로 다운그레이드 했을 경우 나타나는 에러src/index.js 수정렌더링 방식의 변화로 설정을 다르게 해줘야 됨

2022년 6월 17일
·
0개의 댓글
post-thumbnail

6. Element 렌더링 실습

Clock 컴포넌트 만들기src 폴더에 chapter_04를 만들고 Clock.jsx를 만들어준다.new Date()함수에 toLocaleTimeString()을 붙혀서 현재 시간을 출력하도록 한다.이제 index.js에 가서 내가 만든 Clock.jsx를 임포트 해준

2022년 6월 17일
·
0개의 댓글
post-thumbnail

5. Elements의 특징

React Elemtents are immutable한 번 생성된 Elements는 바꿀 수 없다.즉 Elements 생성 후에는 children이나 attributes를 바꿀 수 없다.한 번 구워진 붕어빵의 속 내용물은 바꿀 수 없듯이 생성 후에는 변경할 수 없다.변

2022년 6월 17일
·
0개의 댓글
post-thumbnail

4. Elements

리액트를 구성하는 가장 작은 블록기존에 Browser DOM에 존재하는 것이 DOM Elements라고 했다면리액트에서는 Virtual DOM(가상 돔)에 존재하는 것들을 React Elements라고 부르게 됨즉 React에서의 Elements는 DOM Element

2022년 6월 17일
·
0개의 댓글

콜백함수

콜백함수란?어떤 동작이 일어나고 다음에 일어나는 함수들을 콜백함수라고 함반드시 자리가 중요함예시잘못된 예시둘의 차이점?잘못된 예시에서는 onClick() 하고 함수를 호출하면 리턴값이 들어감뒤에 return undefined가 생략이 되어 있어서 onClick() 하면

2022년 6월 17일
·
0개의 댓글
post-thumbnail

3. JSX의 장점

깔끔해짐가의 사진 참고깔끔하니까 버그를 발견하기 쉬움입력창에 문자나 숫자가 아닌 소스코드 입력하는 것인데 그거 실행 안되게 방지함title에 들어온 값 전부를 문자열로 바꾸어버림태그 사이에 {}를 넣으면 자바스크립트 코드를 넣을 수 있음

2022년 6월 16일
·
0개의 댓글
post-thumbnail

2. JSX란?

A syntax extension to JavaScript자바스크립트의 확장 문법Javascript + XML/HTML 이다내부적으로 XML/HTML을 자바스크립트로 변환하게 됨JSX로 작성이 되어도 javascript 언어로 변환되서 나옴리액트에서 .createEle

2022년 6월 16일
·
0개의 댓글
post-thumbnail

2. 리액트의 장점과 단점(Virtual DOM, DOM)

빠른 업데이트란 화면에 그리는 속도가 빠르다는 것임이를 위해서 가상 돔 개념이 나옴가상의 돔으로웹페이지를 정의하는 하나의 객체즉 하나의 웹사이트에 대한 정보를 모두 담고 있는 큰 그릇이라고 생각하면 됨사용자가 사용하는 웹사이트에는 화면에 업데이트가 수시로 일어남즉 화면

2022년 6월 16일
·
0개의 댓글