객체 리터럴 중복 허용   ❗️상황export default function ReviewForm() { const [values, setValues] = useState({ title: "", rating: 0, content: "", imgFile: null, }); const handleChange = (name, value) => { setValues((prevValues) => ({ ...prevValues, [name]: value, })); }; /.../여기서 prevValues에는{ title: "", rating: 0, content: "", imgFile: null,}이 객체 리터럴이 들어갈 거고[nam..

권한 부족으로 저장할 수 없는니다. 슈퍼 사용자...    상황새로운 프로젝트 만들고 저장 눌렀는데사진에서 보이는 에러가 나왔고 sudo로 다시 시도를 누르고 다시 저장해도 반복적으로 사진에 보이는 메시지가 나오는 상황임 해결방법sudo chmod -R 777 ~/Desktop/프로젝트폴더경로여기서 한글 부분만 지우고 tap 누르면서 경로 쓰고 tap 누르고 하면서 현재 폴더를 찾아주면 해결 - 끝 -

SPA vs MPA 개념, 장단점    ❗️SPA (Single Page Application)란?SPA는 이름 그대로 단일 HTML 페이지로 구성된 웹 애플리케이션입니다. 사용자가 애플리케이션을 처음 로드할 때, 서버로부터 하나의 HTML 페이지를 받아오고 이후의 모든 상호작용은 JavaScript를 통해 이루어집니다.특징:동적 데이터 로딩: 사용자가 페이지 내에서 링크를 클릭하거나 동작을 수행할 때마다 전체 페이지를 다시 로드하지 않고, 필요한 데이터만 서버로부터 받아와서 화면의 일부만 업데이트합니다.빠른 사용자 경험: 전체 페이지를 새로고침하지 않기 때문에 애플리케이션이 빠르고 부드럽게 동작합니다.클라이언트 사이드 라우팅: URL 변경 시 전체 페이지를 다시 로드하지 않고 JavaScript를 통해..

React 모듈 불러오는 방법   ❗️상황지금까지 아래와 같은 코드를 이용해서 사용했었는데import { createContext } from 'react';const MyContext = createContext(null); 다른 강의를 보면서 공부중 아래와 같은 코드를 사용해서 이게 뭐지? 하면서 찾아보았다 import React from 'react';const MyContext = React.createContext(null); ❗️차이점이 두 방법은 기능적으로 동일합니다. React.createContext는 React 모듈의 메서드를 직접 호출하는 방식이고,import { createContext } from 'react'는 ES6 구조 분해 할당을 사용하여 createContext 메서드만을..

타입스크립트 - 리액트 오류해결    ❗️상황리액트 앱 설치- npx create-react-app .Type 선언 패키지 추가- npm i @types/node @types/react @types/react-dom @types/jest부가적인 React를 TypeScript로 적용시킨 후npm run start 했는데 오류가 나옴 ❗️오류이렇게 나옴 이 오류는 프로젝트 종속성이나 설정에 문제가 있을 때 보여질 수 있는 메세지라고 한다. ❗️해결 방법npm과 create-react-app의 버전 호환성으로 인한 충돌이 의심되었고두 가지 모두 최신버전으로 업데이트 해주었다.npm install -g npm@latestnpx create-react-app my-app주의! npx로 설치할 경우 실행 되고 난..

TypeScript 공부일지: 열거형 타입(enumerable type)(enum)   ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️ 열거형 타입 (enumerable type)(enum)// enum 타입// 여러가지 값들에 각각 이름을 부여해 열거해두고 사용하는 타입// enum은 특별하게 컴파일 결과 사라지지 않음// 0이 관리자인지 일반유저인지 헷갈리는 경우가 있음 이럴때 enum type 사용enum Role { ADMIN = 0, USER = 1, GUEST = 2,}// 0,1,2 지정안해도 위에서부터 자동으로 0,1,2 순으로 지정됨// 만약에 ADMIN을 10으로 할당하면 자동으로 아래로 +1 씩 증가되면서 숫자 지정됨const uset1 = { ..

TypeScript 공부일지: 타입 별칭, 인덱스 시그니쳐  ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️ 타입별칭// 타입 별칭 - 타입을 마치 변수처럼 정의해서 사용할 수 있음// 이러한 user가 많아질수록 타입 지정 코드 또한 많아짐type User = { id: number; name: string; nickname: string; birth: string; bio: string; location: string;};let user1: User = { id: 1, name: "은동혁", nickname: "동동이", birth: "1999.04.10", bio: "안녕하세요", location: "한국",};let user2: User = ..

TypeScript 공부일지: 객체  ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️ 객체// object// 객체 리터럴 타입let user: { id?: number; name: string;} = { id: 1, name: "은동혁",};let dog: { name: string; color: string;} = { name: "돌돌이", color: "gray",};let config: { readonly apiKey: string;} = { apiKey: "MY API KEY",}; ❗️ 마무리객체 리터럴 타입을 배웠는데 변수마다 이런식으로 지정하면  코드가 길어질 것 같고 뒤로가서 더 공부할수록 가독성이 좋은 코드를 만들 수 있을것같다. 오늘..

TypeScript 공부일지: 배열과 튜플 ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️ 배열let numArr: number[] = [1, 2, 3];let strArr: string[] = ["hello", "im", "winter"];let boolArr: Array = [true, false, true];// 배열에 들어가는 요소들의 타입이 다양할 경우let multiArr: (string | number)[] = [1, "hello"];// 다차원 배열의 타입을 정의하는 방법let doubleArr: number[][] = [ [1, 2, 3], [4, 5],]; ❗️ 튜플 // 길이와 타입이 고정된 배열let tup1: [number, number] = ..