일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |
- typeScript
- 캡슐화
- Props
- 패스트캠퍼스
- CSS
- OOP
- 부트캠프
- 추상화
- REACT
- 타입스크립트
- 리액트
- Hooks
- 웹개발
- 클래스
- github
- webdevelopment
- 투두앱만들기
- 자바스크립트
- 객체지향프로그래밍
- JavaScript
- 프론트엔드
- frontend
- 상속
- Fetch
- 불변성
- 노마드코더
- js
- 자바스트립트
- Zustand
- 논리연산자
- Today
- Total
목록분류 전체보기 (78)
connecting dots
Redux 알아보기- state: 데이터- action: 함수함수도 하나의 데이터이긴 함. 데이터 중 함수는 호출 가능호출을 해서 추가적인 명령을 실행하는 개념 동기 처리는1) 액션을 만들어서 데이터를 어떻게 변경할지 type(액션의 이름)과 payload(매개변수)로 설정한다.2) 필요한 곳에서 디스패치 액션을 호출한다.3) 액션(내부 로직으로)에서 상태를 업데이트할 수 있다.비동기 처리는1) 액션을 만들어서 데이터를 어떻게 변경할지 type(액션의 이름)과 payload(매개변수)로 설정한다.2) 필요한 곳에서 디스패치 액션을 호출한다.3) 액션(내부 로직으로)에서 상태를 업데이트할 수 있다.- fulfilled/rejected (무엇을 의미하는 것인지 등은 파악해야 함)만일 사용자가 버튼을 클릭하는..
배열 메소드메소드란 ?객체의 속성 중 하나로, 함수 형태로 정의되어 객체의 동작(behavior)을 나타내는 속성입니다. JavaScript에서 배열 메서드는 배열 객체의 프로토타입에 정의된 함수로, 배열을 조작하거나 배열의 정보를 반환하는 데 사용됩니다.JavaScript 배열도 객체이며, 배열에 사용되는 메서드는 배열의 프로토타입에 정의되어 있습니다. 간단 정리정적 메서드1. Array.from: 유사 배열 객체나 반복 가능한 객체를 배열로 변환합니다.2. Array.isArray: 주어진 값이 배열인지 여부를 확인합니다.인스턴스 메서드1. at: 배열에서 지정된 인덱스에 있는 요소를 반환합니다.2. concat: 두 개 이상의 배열이나 값을 결합하여 새로운 배열을 반환합니다.3. every: 배열..
* 줄래 ? (요청, 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. 실시간 강의가 어렵다고 다른 거 하지말고 일단 열심히 듣기.최대한 필기 열심히 하면서 이해가 안되는 것들 메모해두고 나중에 질문해보기.지금 이해가 안가도 몇 주, 몇 달 혹은 몇 년 이후에 '아하 !' 하는 순..
호출 시그니처interface getLikeNumber { (like: number): number; // 호출 시그니처//(매개변수: type): 메소드가 반환하는 type(return 값)} copilot said ...호출 시그니처란?호출 시그니처(call signature)는 함수의 입력과 출력의 타입을 정의하는 방법입니다. 호출 시그니처는 함수가 어떤 매개변수를 받아서 어떤 타입의 값을 반환하는지 명확히 지정할 수 있게 도와줍니다.비유로 설명하기생각해보세요. 당신이 친구에게 요리 레시피를 줘야 하는 상황이에요. 레시피에는 필요한 재료(매개변수)와 그 재료를 사용해서 만드는 요리(반환 값)가 명시되어야 해요. 예를 들어, 스파게티 레시피에는 면, 소스 등의 재료가 필요하고, 그 재료를 사용하면 ..
타입스크립트 개발환경 구성npm install -g typescript = global로 typescript 설치하겠다 main.ts--> index.html에 연결 --> main.ts를 컴파일해서 main.js 만들어야 함 !주의) 컴파일할 때는 기본적으로 ES3 문법을 사용해서 컴파일하게 설정이 되어있음tsc main.ts --> watch모드로 main.ts 파일에서 변경된 사항을 자동으로 main.js에 반영tsc main.ts -w 타입 단언(Type assertion)프로그래머가 컴파일러에게 내가 너보다 타입에 대해 더 잘 알고 있고, 나의 주장에 대해 의심하지 말라고 하는 것interface Foo { bar: number; bas: string;}var foo = {} as Foo..
타입스크립트란 ?자바스크립트에 타입을 부여한 언어자바스크립트의 확장된 언어(super set) = 자바스크립트의 기능을 가지고 있고 + 그 외의 기능도 가짐자바스크립트와는 달리 브라우저에서 실행하려면 파일을 한번 변환해주어야 함 --> 이 변환 과정을 컴파일(compile)이라고 함 Typescript: 정적타임(static) 또는 컴파일 타임. 코드 작성 단계에서 오류 확인↓Typescript Compiler↓Javascript: 동적타임(dynamic). 런타임에서 동작할 때 타입 오류 확인 (비교적 안정성이 높음) Type System개발 환경에서 에러를 잡는 걸 도와줌type annotations를 사용해서 코드를 분석할 수 있음오직 개발환경에서만 활성화됨타입 스크립트와 성능 향상과는 관계가 없음..
hot module replacement모듈 전체를 다시 로드하지 않고 애플리케이션이 실행되는 동안 교환, 추가 또는 제거함실행 중인 상태의 코드의 변경 된 부분을 바꿔치기하는 것 copilot said ...Hot Module Replacement(HMR)는 리액트 개발에서 코드가 변경될 때 페이지를 새로 고치지 않고도 변경된 내용을 바로 반영해주는 기능이에요. 이 기능 덕분에 개발자가 코드 수정 후 저장할 때마다 페이지를 새로고침하지 않아도 변경된 내용을 즉시 볼 수 있어요.Vite는 기본적으로 HMR을 지원해요. 추가 설정 없이도 바로 사용할 수 있어요.비유로 설명하기한번 상상해보자. 네가 그림을 그리는 중이라고 생각해보자. HMR이 없다면, 색깔을 조금 바꿀 때마다 종이를 새로 갈아야 하는 상황이..