4장. 주석

"이런! 주석을 달아야겠다!" 아니다! 코드를 정리해야 한다! (p.69)

2024년 2월 1일
·
0개의 댓글
·

3장. 함수

작게! 더 작게! (p. 42)

2024년 1월 30일
·
0개의 댓글
·

2장. 의미 있는 이름

좋은 이름을 지으려면 시간이 걸리지만 좋은 이름으로 절약하는 시간이 훨씬 더 많다. (p.22)

2024년 1월 30일
·
0개의 댓글
·
post-thumbnail

Typescript (in React JS)

타입스크립트란, Javascript를 기반으로 한 strongly-typed 언어이다. strongly-typed이란, 프로그래밍 언어가 작동하기 전에 type을 확인 하는 것이다.아래의 예제 코드를 보자.해당 코드를 실행시키면 user에는 name이 없지만 에러는 나

2023년 5월 8일
·
0개의 댓글
·
post-thumbnail

Styled Components

리액트에는 여러 스타일링 방법이 있다.CSS-in-JS 방법을 많이 사용하며 그 중에서도 대중적으로 사용하는 styled-components에 대해 알아보겠다. 먼저 styled-components를 import 한다.styled.button을 생성한다. styled.

2023년 5월 8일
·
0개의 댓글
·
post-thumbnail

[Javascript] Hangman Game

Javascript 공부를 하면서 실습을 위한 토이 프로젝트를 진행해 보았다. 비기너들이 많이 해본다는 코드펜의 행맨 게임이 적당해 보여 참고하였다.

2023년 4월 26일
·
0개의 댓글
·
post-thumbnail

NextJS 시작해보기

Nomad Coder의 'NextJS 시작하기' 메모입니다.

2023년 1월 19일
·
0개의 댓글
·

useNavigate()

◾ Link가 a 태그와 같이 클릭 시 특정 주소로 이동해주는 태그라면, useNavigate는 양식이 제출되거나 특정 행동을 하면 페이지 이동을 할 수 있는 "함수를 반환"하는 훅◾ 특정 조건을 충족할 경우에 페이지 이동이 가능하다.◾ index를 사용하여

2022년 12월 12일
·
0개의 댓글
·

Context

✔ 데이터를 넘길 때 props를 사용하지 않는 새로운 방식아래는 기존에 데이터를 props로 전달하는 방식과 Context로 전달하는 방식을 표현한 예시이다.Context는 React 컴포넌트 트리 안에서 전역적(global)이라고 볼 수 있는 데이터를 공유할 수 있

2022년 12월 5일
·
0개의 댓글
·

합성과 상속

✔ 여러 개의 컴포넌트를 합쳐서 새로운 컴포넌트를 만드는 것.어떤 컴포넌트들은 어떤 자식 엘리먼트가 들어올 지 미리 예상할 수 없는 경우가 있다. 범용적인 ‘박스’ 역할을 하는 Sidebar 혹은 Dialog와 같은 컴포넌트에서 특히 자주 볼 수 있다.이러한 컴포넌트에

2022년 12월 5일
·
0개의 댓글
·

state 공유

종종 동일한 데이터에 대한 변경사항을 여러 컴포넌트에 반영해야 할 필요가 있다. 이럴 때는 가장 가까운 공통 상위 컴포넌트로 state를 끌어올리는 것이 좋다. 하위 컴포넌트에서 상위 컴포넌트의 state를 사용 상위 컴포넌트에서 하위 컴포넌트의 state를 사용

2022년 12월 1일
·
0개의 댓글
·

폼(form)

✔ React에 의해 값이 제어되는 입력 폼 엘리먼트.✔ 제어 컴포넌트의 값은 state, setState, useState 로 관리된다.✔ < input type="file" >은 값이 읽기 전용이므로 비제어 컴포넌트(https://ko.reactjs.

2022년 11월 24일
·
0개의 댓글
·

리스트와 키(key)

기본 리스트 컴포넌트 이 코드를 실행하면 리스트의 각 항목에 key를 넣어야 한다는 경고가 표시된다. Key > ✔ 리스트에서 아이템을 구분하기 위한 고유한 문자열. ✔ 어떤 항목을 변경, 추가 또는 삭제할지 식별하는 것을 돕는다. ✔ 배열 내부의 엘리먼트에 지정.

2022년 11월 24일
·
0개의 댓글
·

조건부 렌더링

✔ React에서 조건부 렌더링은 JavaScript에서의 조건 처리와 같이 동작한다. ✔ if 나 조건부 연산자 와 같은 JavaScript 연산자를 현재 상태를 나타내는 엘리먼트를 만드는 데에 사용.위에 나오는 Greeting 컴포넌트는 isLoggedIn이라는 변

2022년 11월 24일
·
0개의 댓글
·

Event handler(Event listener)

React의 이벤트 핸들러 > ✔ 이벤트가 발생했을 때 해당 이벤트를 처리하는 함수 ✔ 이벤트 리스너라고 부르기도 함 함수 컴포넌트에서의 사용 클래스 컴포넌트에서의 사용 클래스 컴포넌트에서는 bind를 꼭 해주어야 한다. 기본적으로 Javascript에서 클래스

2022년 11월 23일
·
0개의 댓글
·

useMemo()

· useMemo()란 Memoized value를 리턴하는 훅.· 연산량이 높은 작업이 매번 렌더링될 때마다 반복되는 것을 피하기 위해 사용.· 렌더링이 일어나는 동안 실행되므로 렌더링이 일어나는 동안 실행돼서는 안될 작업을 useMemo()에 넣으면 안 됨.

2022년 11월 14일
·
0개의 댓글
·