connecting dots

fetch 함수에서 옵션 넣기async function getTodos() { try { // await new Promise(resolve => setTimeout(resolve, 2000)) const res = await fetch( 'https://~~~~', { headers: { 'content-type': 'application/json', apikey: '~~~', username: '~~~' } } // 수강생 전용 정보는 '~~~'로 처리함 fetch('주소', { headers: {}, body: {}. method:..

팩토리함수(Factory Function)객체 데이터(참조형 데이터)를 반환하는 함수function getUser() { return { name: "John", age: 30, };}const user = getUser();console.log(user); // { name: 'John', age: 30 }console.log(getUser()); // { name: 'John', age: 30 }console.log(user.name); // Johnconsole.log(getUser().name); // John// 모든 함수는 호출되면 return으로 반환하는 값을 가지고 있다. 고차함수함수를 인수로 전달하거나(콜백함수) 반환값으로 사용하는 함수function useUser() { ..

예외 처리하기 실습 코드 설명 export interface User { id: string name: string age: number isValid: boolean emails: string[] photo?: Photo} const [users, setUsers] = useState([]) const [message, setMessage] = useState('') useState([]): • useState 훅을 호출하여 초기 상태를 설정 • User[]는 TypeScript에서 제네릭(generic) 타입으로, users 상태가 User 객체들의 배열임을 명시 • []는 초기 상태값으로, 빈 배열을 의미함. 즉, 컴포넌트가 처음 렌더링될 때 users 상태는 빈 배열로 시작함...

즉시실행함수(IIFE)익명함수를 ( )로 감싸고 그 전체를 바로 (호출)하는 방식--> 원래 익명함수는 호출할 수 없음 (이름이 없으니까). 이를 가능하게 해주는 방식 ! 세미콜론을 명령 뒤에 안 붙이는 경우에는 위쪽의 명령과 섞이지 말라는 의미로즉시실행함수 앞에 ';'을 붙여줌. 이렇게 하면 오류가 나지 않음  비동기 처리 용어 쉽게 이해하기상황: 빵을 사러 서울에서 1시에 출발 ! 사고 다시 서울로 돌아온 시간 9시 !1. 대기(pending)- 1시부터 9시까지, 출발해서 다시 돌아올 때 까지, 8시간동안의 시간이 대기상태 (기다리고 있는 것)- 가져오고 있는 중 (ing)- 도착했으면 대기 끝 2-1. 이행(fulfilled)- 빵을 잘 사왔으면 '빵을 사러 다녀오다' 미션이 제대로 이행됨 -->..

Redux 알아보기- state: 데이터- action: 함수함수도 하나의 데이터이긴 함. 데이터 중 함수는 호출 가능호출을 해서 추가적인 명령을 실행하는 개념 동기 처리는1) 액션을 만들어서 데이터를 어떻게 변경할지 type(액션의 이름)과 payload(매개변수)로 설정한다.2) 필요한 곳에서 디스패치 액션을 호출한다.3) 액션(내부 로직으로)에서 상태를 업데이트할 수 있다.비동기 처리는1) 액션을 만들어서 데이터를 어떻게 변경할지 type(액션의 이름)과 payload(매개변수)로 설정한다.2) 필요한 곳에서 디스패치 액션을 호출한다.3) 액션(내부 로직으로)에서 상태를 업데이트할 수 있다.- fulfilled/rejected (무엇을 의미하는 것인지 등은 파악해야 함)만일 사용자가 버튼을 클릭하는..

*                줄래 ?       (요청, request)브라우저 https://www.heropy.com                줄게       (응답, response) 가장 먼저 ! html 가져옴 (화면의 구조를 그림. index.html)http = 프로토콜 (통신 규약) + s --> 보안을 위해서 ! * 로컬 서버(개발 서버) 실제 서버가 아님. 개발할 때만 씀vs배포 (다른사람이 접근할 수 있는 서버로) *for (let i = 0; i ++ 보다 +=를 추천 (더 명확함) *defer를 사용한다 = html 우선 먼저 다 읽고 나서 js 실행해줘 ! (먼저 불러오지만 html 다 읽을 때 까지 대기)  JS 코드 뜯어보기const usersEl = document.q..

Q.  챗 지피티에 의존을 너무 많이 해요 / 챗 지피티가 없으면 코드를 못 짜겠어요 A. 챗 지피티에게 코드를 주고 이걸 설명해줘 ! 하는 건 오케이. but 챗 지피티에게 코드를 짜줘 ! 하는건 이제부터 하지 않기.어떠한 코드를 해석해달라고 해서 그걸 이해하고 학습하기 위한 도구로 사용하는 것은 좋지만코드 생산을 위해서 쓰지 말 것. 최신 코드 부분에 있어서는 챗 지피티에서 정확히 알려주지 않음.구글링, 공식 문서 등을 통해 크로스 체크는 필수. Q. 정규 실시간 강의를 따라가기 어려워요 A. 실시간 강의가 어렵다고 다른 거 하지말고 일단 열심히 듣기.최대한 필기 열심히 하면서 이해가 안되는 것들 메모해두고 나중에 질문해보기.지금 이해가 안가도 몇 주, 몇 달 혹은 몇 년 이후에 '아하 !' 하는 순..