yarn start:dev 를 할 경우Many to Many 로 자동으로 생성되는 table이자꾸 문제를 일으키네요. 서버 재 실행시 기존에 만들어진 중간테이블 강의에서는 상품_상품태그 테이블이 되겠네요.해당 테이블을 삭제후 실행하지 않으면 에러발생시키네요.원인을 찾아보면 아래 코드의 주석된 custom join table 이 문제였는데요.기본 @JoinTable 사용시 문제는 사라집니다. // @JoinTable({ // name: 'PRODUCT_TO_PRODUCT_TAG', // 원하는 중간 테이블명 // joinColumn: { // name: 'PRODUCT_ID', // Product 엔티티 ID를 참조하는 컬럼명 // referencedColumnName: 'productId', // Product 엔티티의 실제 ID 컬럼명 (기본값은 PrimaryColumn 이름) // }, // inverseJoinColumn: { // name: 'PRODUCT_TAG_ID', // ProductTag 엔티티 ID를 참조하는 컬럼명 // referencedColumnName: 'productTagId', // ProductTag 엔티티의 실제 ID 컬럼명 // }, // }) @JoinTable() @ManyToMany(() => ProductTag, (productTags) => productTags.products) @Field(() => [ProductTag], { nullable: true }) productTags: ProductTag[]; 질문 1. 위의 문제를 해결할 수 있는 방법입니다.질문 2.DB 컬럼에는 UPPER_CASE (SCREAMING_SNAKE_CASE) 로 작성하지 않나요?그렇기 때문에 custom / 각 컬럼마다 @Column({ name: 'BOARD_TITLE', type: 'varchar', length: 50, nullable: false, }) @Field(() => String) boardTitle: string;위와 같이 컬럼명을 하나하나 지정해줬습니다.typeorm 또는 요즘 실무 컨벤션에서는 강의에서처럼 카멜표기법으로 사용하나요?Node 강의지만 Java기준 스프링 기본설정에서 카멜케이스조차도 스네이크로 자동 변환하는데 말이죠!msa 구조에서는 테이블은 공통된걸 사용할수도 있으니 궁금해서 질문 드립니다.

 위처럼 콘솔찍었을때,22번째 콘솔에서 arrC 배열 요소를 보면 0번쨰 인덱스에 "hellooo?"가 출력됩니다. 그러나 그다음 콘솔에서는 0번째 인덱스가 1로 찍힙니다.29번째 줄에서 arrC 배열의 0번째 인덱스를 "hellooo?"로 수정한 것이 22번째줄 콘솔에서 보여지는 것 같은데, 실질적인 값은 무엇인지, 이런건 자바스크립트 자체 오류인건지 아니면 원리가 따로 있는지 궁금합니다.

   스크린샷에서 보는 것처럼 잘못된 페이지라고 나옵니다. "/diary"만 입력하면 문제없는데 id만 입력하면 경로를 찾지 못하는 것 같습니다.

실습 준비 환경 만들 때, ESLint 설치까지는 완료했는데 좌측에 .eslintrc.cjs 파일이 저에겐 뜨지 않습니다 ㅠㅠ 어디서 열어야하나요?

PS C:\Users\user\Documents\prepare\front> npm initThis utility will walk you through creating a package.json file.It only covers the most common items, and tries to guess sensible defaults.See npm help init for definitive documentation on these fieldsand exactly what they do.Use npm install <pkg> afterwards to install a package andsave it as a dependency in the package.json file.Press ^C at any time to quit.package name: (front)PS C:\Users\user\Documents\prepare\front>  터미널을열고 저도 패키지 네임 다음 react-nodebird-front를 작성하고 싶은데 어떤방법이 있을까요?

만든파일을 배포하는 과정에 대해 질문이 있습니다.배운기술들로 다른것을 만들어서 ngrok에 배포하는것이 아닌 다른방법으로 배포하고 싶습니다. 상황은 이렇습니다. ・2대의 데스크톱이있습니다.・한대의 데스크톱이 서버의 역할을합니다.・또다른 데스크톱은 클라이언트 역할을합니다. vite와 node.js로 만든경우 vscode로 npm run dev하는것이 아닌 java에서 war파일을 만들어서 war파일만 교체하면되는것처럼 배포 가능한 하나의 번들형태로 만드는방법이 있나요?아니면 vite와 node.js만의 배포하는방법이있나요? 제가 배포를 경험해본 방법이 java에서 Maven으로 war파일을 만들어서 tomcat에 넣어서 사용하는방법밖에 몰라서 node.js는 어떤방법으로 로컬데스크톱에서 실행하게 하는지 궁금합니다.frontend폴더와 backend폴더가 따로 있는데 하나로 로컬데스크톱에 배포하는 방법이 있나요?

완성전에 확인차 배포를 했는데 완성 후 그냥 vercel만 입력하면 빌드까지 되는건가요?

안녕하세요 강의 잘 듣고 있습니다현재 섹션 5. React.js 개론 - 구동원리를 듣고 있는데 import { StrictMode } from 'react' import { createRoot } from 'react-dom/client' import './index.css' import App from './App.jsx' createRoot(document.getElementById('root')).render( <StrictMode> <App /> </StrictMode>, )강의에 있는 코드와 제 main.jsx의 코드가 달라서요.. 전부 똑같이 설치했는데 달라도 괜찮은건가요?

반복문 뭔 소린지 모르겠어요 뭔가 영상이 짤린 느낌

강의를 만들어주셔서 감사합니다.몇가지 질문이 있습니다.Frontend와 Backend폴더를 만든이유가 협업과 소스코드관리를 위한것이라고 생각합니다.그런데 node-modules를 Frontend와 Backend에 각각 설치하신 이유가 있으실까요?company-website에 설치해서 두곳다 이용하는방법도 있을것같은데 Frontend와 Backend를 따로 설치하신이유가 궁금합니다.깃허브에는 node-modules가 저장되게 하지 않았는데요그러면 현재 사용하는 노트북이 아닌 다른 노트북이나 데스크톱에서 현재 개발한것을 이어서하고싶을 경우 Ch0-3과Ch0-4의 설치를 다시 해주면되나요?본강의를 듣고 저만의 웹페이지를 만드는게 목표인데 react에 대해 찾아보다가 Create React App(CRA)로 만드는법과 Vite, Next.js로 만드는방법이 있었습니다. 이중 Vite를 고른 이유가 있을까요?빠르다는 장점으로 선택하신건가요? 선택이유가 궁금합니다.

Context 분리하기 강의 중 3분 55초에 나오는 컴포넌트의 계층 구조 표를 보면,기존의 Context를 TodoStateContext와 TodoDispatchContext로 분리하면서 TodoDispatchContext가 TodoStateContext의 하위에 존재하는 것을 봤는데요,이 부분에서 의문이 생긴 것이 TodoStateContext와 TodoDispatchContext가 형제 위치에 존재하면 안되는걸까요..?제 생각에는 TodoDispatchContext가 하위에 존재하지 않고 StateContext와 형제 위치에 있다면 DispatchContext가 todos에 영향을 받지 않아 리랜더링도 발생하지 않을 것 같은데, 해당 방법이 안되는 이유가 있을까요?

노션에 있는 소스코드 다운로드 링크의 접속이 안됩니다. 구글과 네이버 두개의 링크로 접속했을때의 사진을 첨부해드립니다.혹시 코드를 받을 다른방법이있을까요? 깃허브를 알려주시면 거기서라도 다운로드하겠습니다

class MainActivity:ReactActivity(){// ...overridefunonCreate(savedInstanceState: Bundle?){super.onCreate(null)}// ...}공식문서와 강의에는 위의 코드로 진행해주셨는데수업노트에overridefunonCreate(savedInstanceState: Bundle?) { if (savedInstanceState == null) { SplashScreen.show(this) } super.onCreate(savedInstanceState) }이렇게 코드가 적혀있어서 문의드립니다. 수업노트 부분의 코드가 맞는 것이지요?

강의대로 했는데 왜 오류가 나죠??

안드로이드로 실행하고 있고 앱 아이콘까지 성공하였습니다. 그런데 app. tsx에function Section({children, title}: SectionProps): React.JSX.Element { useEffect(() => { setTimeout(() => { SplashScreen.hide(); }, 1000); }); const isDarkMode = useColorScheme() === 'dark';이 코드를 올리면 Cannot read property 'hide' of null 이라고 뜹니다. 그래서 시도해본 방법은-metro 서버 연겨리도 다시해보고-js hide 호출위치를 app()쪽에도 해보고-mainActivity 코드에 SplashScreen.show(this);코드가 잘 있는지 확인도 하고-gradle.properties에 android.enableJetifier=true추가해보고-androidmanifest의 activity에 android:theme="@style/SplashTheme"이 부분도 추가해보고-styles.xml에resource부분에 <!-- ① 스플래시 화면용 테마 --> <style name="SplashTheme" parent="Theme.AppCompat.Light.NoActionBar"> <!-- launch_screen.xml(layout) 을 배경으로 사용 --> <item name="android:windowBackground">@layout/launch_screen</item> </style> <!-- ② 앱 전체용 기본 테마 --> <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar"> <!-- 여기에 앱 전체 스타일 아이템들을 넣으세요 --> <!-- 예: 상태바 색상, 기본 버튼 스타일 등 --> </style>이렇게도 넣어보아도 앱이 켜지려다가 바로 꺼져버립니다. 로그도 따로 안남고.. 혹시 이 부분에서 왜 이렇게 되고 해결방안이 있을까요??

10:04에서의 문법을 보면 div안에 {}가 들어간 것이 아니라 {}안에 div태그를 넣는데 제대로 동작하는 것을 보면 그렇다고 생각합니다.

2분 22초에서 return 문 앞에 const sunriseData = weatherData ? new Date(weatherData.sys.sunrise);이렇게 코드를 적었는데 이후의 코드에서는 갑자기 보이지 않아 이 코드는 어디가고이후의 return 앞에는 이 코드가 오게 되었는지 궁금합니다.const formatTime = timestamp => { const date = new Date((timestamp - 9 * 3600) * 1000); // UTC timestamp에 9시간 추가 return date.toLocaleTimeString([], {hour: '2-digit', minute: '2-digit'}); // 로컬 시간으로 포맷 }; 제가 이해할 때는 sunriseData가 wetherData의 unixtime을 현재 우리가 보는 시간으로 바꾸어 저장하는 것인데...아래의 formatTime은 sunriseData를 대체한 코드인가요?(시차도 적용한?)

안녕하세요! 캡슐화 추가 설명 강의 중 궁금한 것이 있어 질문 드립니다. 상위 모듈인 app 모듈의 providers에서 하위 모듈들의 service나 repository를 주입 받아 사용하게 되면 다음과 같은 문제가 있다고 하셨습니다. 모듈들의 관리가 힘들어진다.단일책임원칙이 깨진다.추가적인 학습으로 알게된 1번에서 발생할 수 있는 문제는 다음과 같습니다.-상위 모듈의 providers에서 인덱스 순서대로 service를 불러 오기 때문에 만약 하위 클래스끼리의 의존성이 존재한다면, 그 순서를 관리해줘야 되는 복잡성이 발생한다 . 순환참조 또한 일어날 수 있다.하지만 2번 단일책임원칙이 깨진다는 문제점이 발생한다는 것은 아직 이해하지 못했습니다. app 모듈안에서 다른 클래스들의 기능을 사용할 때 참조하는 방식이 잘못된 것이지, 해당 클래스의 기능의 책임이 확장된 것은 아니라는 생각이 듭니다. 여전히 기능의 변경이 일어났을 때 해당 클래스만 수정하면 된다고 생각하기 때문입니다.제 이해가 잘못된 것인지, 강사님께서 SRP원칙의 의미를 조금 더 확장해서 말씀해주신 것인지 궁금합니다!

 import "./Main.css";나import "../Main.css"; 둘다 해봤는데css를 컴포넌트로 불러오기 오류떠요 ㅠㅠ

안녕하세요. 리액트 초보입니다. 이해하기 쉽게 설명해주셔서 감사합니다. 11.3) Context 분리하기 강의 약 7분 쯤에서 궁금한 부분이 있어서 질문 남깁니다.  <TodoDispatchContext.Provider> 를 통해 context를 전달할 때, 함수를 캐싱하기 위해 강의에서는 아래와 같이 useMemo를 사용해주셨는데요! const memoizedDispatch = useMemo(() => { return { onCreate, onUpdate, onDelete }; }, []); 우선 최적화하고자 한 이유는 아래와 같다고 이해했습니다. onCreate, onUpdate, onDelete 모두 한 번 생성한 후에 바뀌지 않는 함수로, TodoDispatchContext를 참조하는 자식 컴포넌트들의 리렌더링 방지  그리고 useMemo를 사용하신 부분에서는 마운트 후 onCreate, onUpdate, onDelete는 변하지 않는 함수 이므로 "값을 캐싱한다"는 의미에서 useMemo를 사용해주셨다고 이해했습니다. 다만 useCallback도 mount 후 deps 변경 전에는 함수의 중복 생성을 방지한다는 점에서는 useCallback을 사용해도 좋을 것 같단 생각이 들었는데요, 결론적으로 제가 궁금한 부분은 아래와 같습니다. useMemo 대신 useCallback을 사용해서도 동일하게 최적화 할 수 있다고 이해했는데, 제가 이해한 게 맞을까요? 1번이 맞다면 강의에서 useMemo를 사용해주신 이유는 캐싱하기 위함(의도)을 표현하기 위함이라고 이해하면 될지도 궁금합니다! 실무에서는 useMemo와 useCallback을 모두 사용할 수 있는 경우 어떤 훅을 선택하시는지, 강의에서 useMemo를 통해 캐싱하신 이유가 궁금했습니다 ! 블로그를 찾아봐도 잘 이해가 되지 않아서 질문으로 남깁니다! 답변 주시면 감사하겠습니다!