바탕화면 캡쳐 사진 두개 e가 사용되지 않아서 오류인줄 알았으나 import안해서 생긴 문제 였음 근데 중요한건 제대로 확인도 하지 않고 e를 할당하지 않아서 생긴 오류라고 치부하고 넘김

유틸리티 우선 (Utility-First) CSS 프레임워크.빠르고 쉽게 스타일링을 적용할 수 있는 클래스를 제공기존의 CSS-in-JS 라이브러리인 Styled-Components보다 유연하고 직관적인 스타일링을 제공다양한 유틸리티 클래스를 제공, HTML 요소에

서비스를 이용하려는 유저가 등록된 회원인지 확인하는 절차인증을 받은 유저가 특정 리소스에 접근할 수 있는 권한이 있는지 확인하는 절차쿠키란 브라우저에 저장되는 작은 데이터 조각이며, key-value 형태로 저장된다세션이란 사용자와 서버 간의 연결이 활성화된 상태를 의

짧은 시간 간격으로 연속해서 발생한 이벤트들을 일정시간 단위로 그룹화하여 처음 또는 마지막 이벤트 핸들러만 호출되도록 하는 것짧은 시간 간격으로 연속해서 이벤트가 발생하면 이벤트 핸들러를 호출하지 않다가 마지막 이벤트로부터 일정 시간이 경과한 후에 한 번만 호출하도록

Zustand의 간편한 상태 업데이트 방식은 깊은 중첩 구조를 가지는 상태를 업데이트할 때 문제가 발생할 수 있다.배열이나 객체의 중첩된 상태를 업데이트할 때 불변성을 유지하지 않으면 상태 반영이 제대로 이루어지지 않아, 예상치 못한 오류가 발생 가능Mutable 메서

기존의 상태관리 라이브러리인 Redux는 제공하는 기능과 연계된 미들웨어 등 매우 강력한 퍼포먼스를 자랑하지만, 설정과 사용법이 복잡함Zustand는 상태관리 본연의 기능에 집중하여 위와 같은 복잡성을 줄이고, 보다 간단하고 직관적인 상태관리 기능을 제공함매우 간단한

node.js와 브라우저를 위한 Promise 기반 http 클라이언트(http를 이용해서 서버와 통신하기 위해 사용하는 패키지)yarn add axios서버의 데이터를 조회할 때 사용axios.get(url\[, config])서버에 데이터를 추가할 때 사용어떤 데이

DB와 API 서버를 생성해주는 패키지프론트엔드에 집중해야 할 것이 많기에 직접 백엔드를 구축할 수 없어서 사용함또한 프론트엔드에서 백엔드가 하고 있는 작업을 기다리지 않고, 프론트엔드의 로직과 화면을 구현 할 수 있어 효율적으로 협업 가능yarn add json-se

요청과 그에 따른 응답이 순차적으로 일어나는 방식요청을 보내면 그 응답이 올 때까지 대기하고 그 다음 작업을 수행일의 순서가 중요한 경우에 사용하는 방식처리 순서는 보장됨. 다만 응답을 기다리는 동안 다른 작업 수행이 불가능하기에 비효율적 요청과 그에 따른 응답이 비순

위 코드는 MOCK_DATA의 id값과 페이지의 id값이 서로 일치하면 해당 정보를 불러오게 작동하는 코드이다 사전에 console.log(pokemonId); 을 작성하여 올바른 id를 불러오고 있는지 확인 후 진행하려는데 작성한 코드를 다시 확인해본 결과 문제

참고 영상을 보며 과제 진행중 나만 오류가 발생 아무리 돌려봐도 오타도 없음 로그에는 내가 넣은 변수값이 함수가 아니라고 함 의심이 들어 재부팅함 vscode 재부팅하니 사라짐

=> 페이지가 안열림 확인해보니 Dex.jsx 파일의 pokemonList를 불러오는 부분이PokemonList로 앞글자가 대문자로 작성됨 이로 인해 props가 일치하지 않게 되어 오류가 발생했었다하필 얼핏보면 구분이 힘든 ( p, P ) 차이 때문에 한번에 알아차리

const TodoContext = createContext();export default TodoContext;

부모 → 자식 데이터 전달 메커니즘 = 컴포넌트 간의 정보 교류 방법props는 반드시 부모 → 자식 방향으로 흐름읽기 전용으로 취급하며, 변경하지 않음

아이콘 사용 메인 페이지에서 원하는 아이콘을 선택 혹은 검색 해당 사진에서는 ellipsis-vertical 아이콘을 선택했고 해당 이름 그대로 태그를 직접 작성하고 사용해도 무방하나 기호의 여부를 잘 생각하고, 첫글자를 대문자로 선택하는 것을 잊으면 안됨 <el

컴포넌트는 각자 하나의 책임만 가지기UI요소에 따라 분리하기 (Header, Main, Footer 등)

useEffect는 리액트 컴포넌트가 렌더링 된 이후마다 특정 작업을 수행하도록 설정할 수 있는 훅이다App 컴포넌트가 화면에 렌더링 된 이후 useEffect 안에 있는 console.log가 실행

border값의 color 속성을 각각 바꿔줄 것 이기에 함수 사용을 위한 ${ } 안에 props 전달각 요소에 설정 값 지정 브라우저마다 기본으로 제공하는 스타일을 초기화하고 기본값을 주기 위해 하는 설정cross browsing: 웹 페이지 제작 시 모든 브라우저

CSS in Js : 자바스크립트안에 CSS => 자바스크립트 코드로 CSS를 작성css-in-js를 사용해 기존의 import방식과는 달리 조건문, 변수 등 다양한 로직을 이용가능styled-components: 리액트에서 CSS-in-JS 방식으로 컴포넌트를 꾸밀수

완료 문구만 적힌 텍스트에서 삼항연산자를 이용한 함수를 추가 {todo.completed ? "되돌리기" : "완료"}css추가, completed가 true면 line-through, false면 none. 취소선 추가(+) 위 두 예시 모두 자바스크립트 문법이 들