혹시 4번째 줄에서 inline css style을 적용할 때 {} 중괄호로 한번 더 감싸는 이유가 무엇인가요?

import { useState, useRef } from "react"; const DiaryItem = ({ author, emotion, created_time, content, id, onDelete, onEdit, }) => { const [isEdit, setIsEdit] = useState(false); const [localContent, setLocalContent] = useState(content); // 본문 수정 시 수정 전 콘텐츠 띄우기 const localContentInput = useRef(); const toggleIsEdit = () => { setIsEdit(!isEdit); }; const handleDelete = () => { if (window.confirm(`${id}번째 일기를 삭제하시겠습니까?`)) { onDelete(id); } }; const handleQuitEdit = () => { setIsEdit(false); setLocalContent(content); }; const handleEdit = () => { if (localContent.length < 5) { localContentInput.current.focus(); return; } onEdit(id, localContent); }; return ( <div className="DiaryItem"> <div className="info"> <span> 작성자 : {author} | 감정점수 : {emotion} </span> <br /> <span className="date">{new Date(created_time).toLocaleString()}</span> </div> <div className="content"> {/* 수정 중 콘텐츠 vs 수정 전 콘텐츠 */} {isEdit ? ( <textArea ref={localContentInput} value={localContent} onChange={(e) => setLocalContent(e.target.value)} /> ) : ( <>{content}</> )} </div> {/* 수정 중 버튼 vs 수정 전 버튼 */} {isEdit ? ( <> <button onClick={handleQuitEdit}>수정 취소</button> <button onClick={handleEdit}>수정 완료</button> </> ) : ( <> <button onClick={handleDelete}>삭제하기</button> <button onClick={toggleIsEdit}>수정하기</button> </> )} </div> ); }; export default DiaryItem;위는 제가 수업을 보며 따라친 DiaryItem.js인데 실행을 시키면 수정하기 버튼을 눌렀을 때 원래 콘텐츠가 textArea에 뜨지 않고 수정이 되지 않습니다. 하지만 소스코드에 올려진 DiaryItem.js를 복붙했을 때는 또 됩니다. 몇 번이나 두 파일을 비교했지만 잘못된 점을 찾아낼 수가 없었는데 도와주세요 ㅠㅠ

34번째 줄에서 {content}를 빈 태그로 감싸는 이유가 뭔가요? 어차피 content는 문자열 아닌가요?

안녕하세요 섹션 5 . 수학 객체 파트3분 19 초 에서 077215 는 존재할 수 없다 라고 하셨는데 왜 존재할 수 없다라는 것인가요 ?077215에서 0을 인식할 수 없어 77215로 인식하기 때문에 그런 것 같은데 제 입장에서는 급 ?뜬금없이 ? 라는 느낌이 있어서 정확히 왜 존재할 수 없다고 하신지 이해가 가지 않습니다..

저는 그랩 님처럼 개발자 도구에서 data가 깔끔하게 정리 돼서 나오지 않습니다 어떤 부분이 잘못된 걸까요?

class-transformer 도 같이 설치후 요청을 날려보면 아래와 같은 의도하지 않은 에러미세지가 출력됩니다.{ "statusCode": 500, "message": "Internal server error" }또 동시에 터미널에 아래와 같은 에러 로그가 출력됩니다.[Nest] 8570 - 2023. 05. 27. 오전 10:48:03 ERROR [ExceptionsHandler] data and salt arguments required Error: data and salt arguments required at Object.hash (/Users/apple/Documents/sideProjects2/sleactNestJS/node_modules/bcrypt/bcrypt.js:137:17) at /Users/apple/Documents/sideProjects2/sleactNestJS/node_modules/bcrypt/promises.js:29:12 at new Promise (<anonymous>) at Object.module.exports.promise (/Users/apple/Documents/sideProjects2/sleactNestJS/node_modules/bcrypt/promises.js:20:12) at Object.hash (/Users/apple/Documents/sideProjects2/sleactNestJS/node_modules/bcrypt/bcrypt.js:133:25) at UsersService.postUsers (/Users/apple/Documents/sideProjects2/sleactNestJS/dist/main.js:426:55) at processTicksAndRejections (node:internal/process/task_queues:96:5) at async UsersController.join (/Users/apple/Documents/sideProjects2/sleactNestJS/dist/main.js:1247:9)ChatGPT에 문의해보니 bcrypt에러 같다고 하는데, bcrypt는 수정하지 않았고 문제도 없어보입니다. 제가 강의를 보며 수정한 코드는 4군데 입니다.users.service.ts 에 기존 Exception 코드 날리기async postUsers(email: string, nickname: string, password: string) { const user = await this.usersRepository.findOne({ where: { email } }); if (user) { throw new UnauthorizedException('이미 존재하는 사용자입니다'); }Users.ts entity에 Validation 추가하기 @IsEmail() @ApiProperty({ example: 'kim@gmail.com', description: '이메일', }) @Column('varchar', { name: 'email', unique: true, length: 30 }) email: string; @IsString() @IsNotEmpty() @Column('varchar', { name: 'nickname', length: 30 }) nickname: string; @IsString() @IsNotEmpty() @Column('varchar', { name: 'password', length: 100, select: false }) password: string; main.ts에 useGlobalPipes 꼽기app.useGlobalPipes(new ValidationPipe()); httpException.filter.ts response status 수정하기const err = exception.getResponse() as | { message: any; statusCode: number } | { error: string; statusCode: 400; message: string[] }; if (typeof err !== 'string' && err.statusCode === 400) { return response.status(status).json({ success: false, code: status, data: err.message, }); } response.status(status).json({ success: false, code: status, data: err.message, }); } }공식문서도 보았는데, 해결이 안되어서 질문 남깁니다.

Counter.js의 defaultProps를 설정했는데도 count 값이 0으로 설정되지 않아 질문드립니다.각각 App.js랑 Counter.js 입니다.// import logo from './logo.svg'; // import "./App.css"; // inline 스타일 적용 시 필요 없음 import MyHeader from "./MyHeader"; import MyFooter from "./MyFooter"; import Counter from "./Counter"; function App() { let name = "김학준"; const style = { App: { backgroundColor: "black", // Camel case }, h2: { color: "red", }, bold_text: { color: "green", }, }; const counterProps = { a: 1, b: 2, }; return ( // <div className="App"> // <div style={style.App}> <div> <MyHeader /> <Counter {...counterProps} /> {/* <header className="App-header"> <img src={logo} className="App-logo" alt="logo" /> <p> Edit <code>src/App.js</code> and save to reload. </p> <a className="App-link" href="https://reactjs.org" target="_blank" rel="noopener noreferrer" > Learn React </a> </header> */} {/* <h2>안녕 리액트 {name}</h2> */} {/* <h2 style={style.h2}>안녕 리액트 {name}</h2> */} {/* <b id="bold_text">React.js</b> */} {/* <b style={style.bold_text}>React.js</b> */} {/* <MyFooter /> */} </div> ); } export default App; import React, { useState } from "react"; // React의 메소드 const Counter = ({ initialValue }) => { // console.log("counter 호출!"); console.log(initialValue); const [count, setCount] = useState(initialValue); const onIncrease = () => { setCount(count + 1); }; const onDecrease = () => { setCount(count - 1); }; return ( <div> <h2>{count}</h2> <button onClick={onIncrease}>+</button> <button onClick={onDecrease}>-</button> </div> ); }; Counter.defaultProps = { initialValue: 0, }; export default Counter;  

9번째 줄에서 useState(0)이라는 값이 배열을 반환하는 것이죠?

inline 스타일을 적용할 때 div의 속성 className을 제거하는 이유가 무엇인가요?

저는 콘솔 창에서 함수가 안 나오고 에러가 나오는데 어떤 부분이 문제인 건가요?

강의에서 설치돼 있지 않은 패키지를 딱 한번만 쓰고 싶을 때 npx를 사용한다고 했는데 이게 무슨 말씀인지 좀 더 자세하게 설명해주실 수 있나요?

10강 Bcrypt로 비밀번호 암호화 하기에서 User.js의49번째 줄에서 next()로 인해 index.js의 38번째 줄 미들웨어 함수로 이동한다고 했는데 많은 미들웨어 함수중에서 38번째 줄 미들웨어 함수로 이동하는 이유가 뭔지 궁금합니다

웹으로 확인해보려 하니 이런화면이 자꾸 뜹니다ㅠ

 06-03 클래스 전략 패턴수업에서 선생님과 코드를 똑같이 입력했는데 오류(공중 몬스터 not defined)가 납니다. 어떤 부분이 문제일까요? class 공중부품 { run = () => { console.log("날아서 도망가자!!"); } } class 지상부품 { run = () => { console.log("뛰어서 도망가자!!"); } } class Monster { power = 10; 부품; constructor(qqq){ this.부품 = qqq; } attack = () => { console.log("공격하자!!"); console.log("내 공격력은" + this.power + "야!!!"); }; run = () => { this.부품.run();class 공중부품 { run = () => { console.log("날아서 도망가자!!"); } } class 지상부품 { run = () => { console.log("뛰어서 도망가자!!"); } } class Monster { power = 10; 부품; constructor(qqq){ this.부품 = qqq; } attack = () => { console.log("공격하자!!"); console.log("내 공격력은" + this.power + "야!! }; } const mymonster1 = new Monster(new 공중부품()); mymonster1.attack(); mymonster1.run(); const mymonster2 = new Monster(new 지상부품()); mymonster2.attack(); mymonster2.run();

프로젝트 세팅은 어떻게 하는지 언급이 따로 안된 것 같은데 뒤에 설명이 나올까요?orientjs 를 프로젝트에 적용하는 파트에서 프로젝트 세팅이 없었다는 것을 깨달았습니다.

왼쪽이 어떻게 오른쪽과 같을 수 있나요? resolve가 콜백함수라서 그런 건가요? 맞다면 좀 더 자세하게 설명해주세요.

해당 화면 3번째 줄에서 randomColor() 말고 randomColor라고 쓰면 왜 안되는 건가요?

회원가입 과제는 따로 정답 코드가 없는건가요?

http://practice.codebootcamp.co.kr/graphql서버에 문제가 있나요? 어제는 잘 되었는데 안들어가지네요.

엔티티@Entity() @ObjectType() export class Reservation { @PrimaryGeneratedColumn('uuid') @Field(() => String) reservationId: string; @Column({ nullable: false }) @Field(() => Date) startDate: Date; @Column({ nullable: false }) @Field(() => Date) endDate: Date; @Column({ nullable: false }) @Field(() => Int) usersNumber: number; @Column({ nullable: false }) @Field(() => Int) lengthOfStay: number; @Column({ nullable: false }) @Field(() => Int) price: number; @ManyToOne(() => Member) @JoinColumn({ name: 'memberId' }) @Field(() => Member) member: Member; @ManyToOne(() => Campground) @JoinColumn({ name: 'campgroundId' }) @Field(() => Campground) campground: Campground; @ManyToOne(() => Tent) @JoinColumn({ name: 'tentId' }) @Field(() => Tent) tent: Tent; @DeleteDateColumn() deletedAt: Date; } 데이터 생성 DTO@InputType() export class CreateReservationInput extends OmitType( Reservation, ['reservationId', 'member', 'campground', 'tent'], InputType, ) { @Field(() => String) memberId: string; @Field(() => String) campgroundId: string; @Field(() => String) tentId: string; }   위 코드에 graphQL 요청시 에러가 발생합니다.mutation { createReservation ( createReservationInput: { startDate: "2023-01-01" endDate: "2023-06-06" usersNumber: 5 lengthOfStay: 10 price: 5 memberId: "lhw3542" campgroundId: "d35d3972-5c07-47d7-94a2-23c784f0a27e" tentId: "3ae33a7c-c898-4b66-b110-02b4f8c96398" } ) { reservationId startDate endDate usersNumber lengthOfStay price member { memberId } campground { campgroundId } tent { tentId } } } Field 'startDate' doesn't have a default value날짜 형식을 읽지 못하는 것 같은데 무엇이 잘못된 걸까요?아래와 같이 DTO에 직접 써줘도 인식을 못하고 있습니다. @Field(() => Date) startDate: Date; @Field(() => Date) endDate: Date;