useMutation section 에서 해당 소스를 작성하고 Graphql API 요청하기 버튼을 누르면 아래와 같이 오류 메세지가 나옵니다. 설치 오류인가 싶어 package.json 을 봐도 특별히 어떤 문제인지 확인되지 않습니다.

안녕하세요 강사님클로코딩 진행중 npm run dev 명령 시 정상적으로 런타임 되는데계속해서 아래 사진과 같이 각 entity가 초기화가 안됐다는 경고 창이 뜨는데 이건 어떻게 해결해야하는지 문의드립니다. 

apoll-cilent 관련된 질문입니다.질문1. 지금 강의에서는 api url이 한개만 있을 경우인데, 경로가 다 다른 경우는 어떻게 연결을 하나요??client를 여러개 만들어서 porivder에 담아줘야하나요??질문2. provider는 꼭 app.jsx를 감싸야하나요?? 아니면 내부 컴토넌트안에서 원하는 컴포넌트를 provider로 감싸도 동일하게 사용이 가능한가요??

UploadProductPage의handleSumbit 부분을 dispatch로 하지 않고바로 페이지안에서 작성한 이유가 따로 있는건가요?? 

import { Channels } from '../../entities/channel.entity'; import { Workspaces } from 'src/entities/workspace.entity'; import { DataSource } from 'typeorm'; import { Seeder, SeederFactoryManager } from 'typeorm-extension'; export default class UserSeeder implements Seeder { async run( dataSource: DataSource, factoryManager: SeederFactoryManager, ): Promise<any> { const workspaceRepository = dataSource.getRepository(Workspaces); await workspaceRepository.insert([ { id: 1, name: 'nest-practice', url: 'nest-practice', }, ]); const channelsRepository = dataSource.getRepository(Channels); await channelsRepository.insert([ { id: 1, name: '개인', WorkspaceId: 1, private: true, }, ]); } }에러 로그 BaseError: Cannot find module 'src/entities/workspace.entity' Require stack: - /Users/jinyoung/Desktop/study/nest/nest-project/src/database/seeds/create-initial-data.ts - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/locter/dist/index.cjs - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/utils/file-path.js - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/utils/index.js - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/factory/module.js - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/factory/manager.js - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/factory/index.js - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/index.js - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/data-source/options/module.js - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/data-source/options/index.js - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/data-source/index.js - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/cli/commands/database/create.js - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/cli/commands/database/index.js - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/cli/commands/index.js - /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/cli/index.js at ModuleLoader.loadSync (/Users/jinyoung/Desktop/study/nest/nest-project/node_modules/locter/src/loader/built-in/module/module.ts:179:23) at ModuleLoader.loadSync (/Users/jinyoung/Desktop/study/nest/nest-project/node_modules/locter/src/loader/built-in/module/module.ts:172:37) at ModuleLoader.execute (/Users/jinyoung/Desktop/study/nest/nest-project/node_modules/locter/src/loader/built-in/module/module.ts:55:31) at async prepareSeeder (/Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/module.js:58:39) at async runSeeders (/Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/module.js:111:19) at async Object.handler (/Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/cli/commands/seed.js:59:9) { options: { code: 'MODULE_NOT_FOUND', message: "Cannot find module 'src/entities/workspace.entity'\n" + 'Require stack:\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/src/database/seeds/create-initial-data.ts\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/locter/dist/index.cjs\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/utils/file-path.js\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/utils/index.js\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/factory/module.js\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/factory/manager.js\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/factory/index.js\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/seeder/index.js\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/data-source/options/module.js\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/data-source/options/index.js\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/data-source/index.js\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/cli/commands/database/create.js\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/cli/commands/database/index.js\n' + '- /Users/jinyoung/Desktop/study/nest/nest-project/node_modules/typeorm-extension/dist/cli/commands/index.js\n' +해당 코드에서 처음엔 Channels라는 엔티티경로를 인식해오지 못한다고 에러 로그를 받았습니다. 이거저거 해보다가 아 혹시 상대경로로 바꿔주면 인식이 될까? 해서 상대경로로 바꿔 주었더니 Channels가 인식되기 시작했습니다. 궁금한점은 처음 Import해올 당시 제가 경로를 직접입력한것이 아닌 타입스크립트가 자동으로 경로를 잡아주어 import했습니다. 하지만 어째서 타입스크립트가 인식해서 잡아준 경로에 존재하는 모듈을 찾을수 없다고 나오는지 모르겠습니다.

dataSource.ts import { DataSource } from 'typeorm'; import { ChannelChats } from './src/entities/channelChat.entity'; import { ChannelMembers } from './src/entities/channelMembers.entity'; import { Channels } from './src/entities/channel.entity'; import { DMs } from './src/entities/dm.entity'; import { Mentions } from './src/entities/mention.entity'; import { Users } from './src/entities/user.entity'; import { WorkspaceMembers } from './src/entities/workspaceMembers.entity'; import { Workspaces } from './src/entities/workspace.entity'; import { ConfigService } from '@nestjs/config'; const configService = new ConfigService(); const test = configService.get('DB_HOST'); console.log(test) const dataSource = new DataSource({ type: 'mysql', host: '127.0.0.1', port: 3306, username: configService.get('DB_USER'), password: configService.get('DB_PASSWORD'), database: configService.get('DB_NAME'), entities: [ ChannelChats, ChannelMembers, Channels, DMs, Mentions, Users, WorkspaceMembers, Workspaces, ], migrations: [__dirname + '/src/migrations/*.ts'], synchronize: false, logging: true, });출력 에러 로그 yarn seed yarn run v1.22.19 warning ../../../../package.json: No license field $ ts-node ./node_modules/typeorm-extension/dist/cli/index.js seed -d ./dataSource.ts undefined !!!!!!!!!!!!!!! Error during Data Source initialization Error: Access denied for user ''@'localhost' (using password: NO) at Packet.asError (/Users/jinyoung/Desktop/study/nest/nest-project/node_modules/mysql2/lib/packets/packet.js:728:17) at ClientHandshake.execute (/Users/jinyoung/Desktop/study/nest/nest-project/node_modules/mysql2/lib/commands/command.js:29:26) at PoolConnection.handlePacket (/Users/jinyoung/Desktop/study/nest/nest-project/node_modules/mysql2/lib/connection.js:478:34) at PacketParser.onPacket (/Users/jinyoung/Desktop/study/nest/nest-project/node_modules/mysql2/lib/connection.js:97:12) at PacketParser.executeStart (/Users/jinyoung/Desktop/study/nest/nest-project/node_modules/mysql2/lib/packet_parser.js:75:16) at Socket.<anonymous> (/Users/jinyoung/Desktop/study/nest/nest-project/node_modules/mysql2/lib/connection.js:104:25) at Socket.emit (node:events:513:28) at Socket.emit (node:domain:489:12) at addChunk (node:internal/streams/readable:324:12) at readableAddChunk (node:internal/streams/readable:297:9) { code: 'ER_ACCESS_DENIED_ERROR', errno: 1045, sqlState: '28000', sqlMessage: "Access denied for user ''@'localhost' (using password: NO)", sql: undefined } typeorm-extension seed.env NAME=development DB_HOST=localhost DB_NAME=nestdb DB_USER=root DB_PASSWORD=password!!!package.json "db:create": "ts-node ./node_modules/typeorm-extension/dist/cli/index.js db:create -d ./dataSource.ts", "db:drop": "ts-node ./node_modules/typeorm-extension/dist/cli/index.js db:drop -d ./dataSource.ts", "seed": "ts-node ./node_modules/typeorm-extension/dist/cli/index.js seed -d ./dataSource.ts", "schema:drop": "ts-node ./node_modules/typeorm/cli.js schema:drop", "schema:sync": "ts-node ./node_modules/typeorm/cli.js schema:sync", "db:migrate": "npm run typeorm migration:run -- -d ./dataSource.ts", "db:migrate:revert": "npm run typeorm migration:revert -- -d ./dataSource.ts", "db:create-migration": "npm run typeorm migration:create -- ./src/migrations/", "db:generate-migration": "npm run typeorm migration:generate -- ./src/migrations -d ./dataSource.ts"폴더구조 - node_module - src - .env - dataSource.ts - package.json 출력에러 로그에 보시면 맨위 yarn seed 기준 5번째 줄에 undefined !!!!!! 이런 로그를 확인하실수 있으실텐대 이게 process.env.DB_NAME을 해도 이렇게 나오고 configService.get('DB_NAME')을 해도 undefined로 나오는걸로 확인해본결과 현재 환경변수가 인지가 되지않는 상태라는것을 알아챈 상태까지 왔습니다. 여기서 어떤 부분을 손보면 좋을지 궁금합니다. 

31-2 포트폴리오 과제를 진행하다가 막혀서 질문드려요!!다른기능들은 이미 해봤던내용의 복습인것같아 잘진행을 하고있던 와중에 별점 기능을 구현하는데 어려움이 좀 있네요. 처음 만들어보는 기능이라 혼자 만들어보다가 잘진행이 되지않아 레퍼런스 코드를 한번보고싶은데요해당 과제 세션에 링크된 레퍼런스코드에는 그기능이 따로 없는것같아서 여쭈어봅니다.

안녕하세요 create-react-app을 설치하고create-react-app .를 입력한 후에 계속 이 에러가 떠서 진행을 못하고 있습니다.ㅠEEXIST라는 에러코드인데요.. 일단 저는 sudo npm install -g create-react-app 코드를 이용해서 설치를 했고create-react-app -V라는 코드를 이용해서 create-react-app의 버전이 나옴을 확인해, 설치는 제대로 되었음을 확인했습니다. 그런데 create-react-app . 이 부분을 입력할 때마다 저 에러가 뜹니다.. 어떻게 해결하면 좋을까요?처음부터도 다시 깔아보고, uninstall install도 해보고 npx로도 해봤지만 잘 안됐습니다..

 RestAPI로 배울때 swagger를 만들었던 경험이 있는데, graphql은 그 자체로 swagger의 역할까지 한다고 생각하면 될까요? 뭔가 swagger가 보기에 더 직관적이고 더 설명서 같은 느낌이 있어서 graphql을 사용하면서도 swagger처럼 만들 수 있는 방법이 있는지 여쭤봅니다!

npm run dev를 했는데아래와 같은 오류가 뜨면서 실행이 안됩니다어디서 문제가 있는 건가요? util/produce.js 코드 내용import { enableES5, produce } from 'immer'; export default (...args) => { enableES5(); return produce(...args); };  터미널 에러> react-nodebird-front@1.0.0 dev> next -p 3060ready - started server on 0.0.0.0:3060, url: http://localhost:3060event - compiled client and server successfully in 668 ms (1830 modules)wait - compiling / (client and server)...event - compiled client and server successfully in 1185 ms (4446 modules)4. WrappedApp created new store with withRedux(NodeBird) { initialState: undefined, initialStateFromGSPorGSSR: undefined }{}wait - compiling /_error (client and server)...error - util/produce.js (4:11) @ __WEBPACK_DEFAULT_EXPORT__error - TypeError: (0 , immer__WEBPACK_IMPORTED_MODULE_0__.enableES5) is not a function at __WEBPACK_DEFAULT_EXPORT__ (webpack-internal:///./util/produce.js:11:53) at reducer (webpack-internal:///./reducers/user.js:115:106) at /Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/redux/lib/redux.js:476:24 at Array.forEach (<anonymous>) at assertReducerShape (/Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/redux/lib/redux.js:474:25) at combineReducers (/Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/redux/lib/redux.js:539:5) at eval (webpack-internal:///./reducers/index.js:19:75) { page: '/'} 2 | 3 | export default (...args) => {> 4 | enableES5(); | ^ 5 | return produce(...args); 6 | };event - compiled client and server successfully in 315 ms (4447 modules)4. WrappedApp created new store with withRedux(NodeBird) { initialState: undefined, initialStateFromGSPorGSSR: undefined }{}TypeError: (0 , immer__WEBPACK_IMPORTED_MODULE_0__.enableES5) is not a function at __WEBPACK_DEFAULT_EXPORT__ (webpack-internal:///./util/produce.js:11:53) at reducer (webpack-internal:///./reducers/user.js:115:106) at /Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/redux/lib/redux.js:476:24 at Array.forEach (<anonymous>) at assertReducerShape (/Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/redux/lib/redux.js:474:25) at combineReducers (/Users/hyeonyeongjeong/Documents/2023project/nodebird/prepare/front/node_modules/redux/lib/redux.js:539:5) at eval (webpack-internal:///./reducers/index.js:19:75) at processTicksAndRejections (node:internal/process/task_queues:96:5)^C%

섹션6 '프로젝트 최적화' 강의의 14:30부터 끝 부분까지의 내용 관련 궁금한 점이 있어 질문 드립니다!강의를 들으면서, setstate 함수는 자동으로 useCallback 처리가 되어 반환되는 함수라 생각하면 되고, 따라서 setstate 함수를 props로 전달하면 성능 최적화를 할 수 있다고 이해했는데요,그래서 DiaryEditor 컴포넌트가 자식 컴포넌트인 EmotionItem 에게 onClick={handleClickEmote} 를 props로 전달할 때 onClick={(e) => setEmotion(e)} 와 같이 setEmotion이라는 상태변화 함수를 전달해주면 useCallback을 사용하지 않고도 최적화를 할 수 있을 거라고 생각했습니다!그러나 확인해보니 이 코드로는 최적화가 되지 않는데, 이유가 무엇인지 이해가 잘 되지 않습니다 ㅠㅠ(EmotionItem에 React.memo로 묶어주었습니다!)혹시 제가 잘못 이해한 부분이 있는지 여쭤봐도 괜찮을까요? 아래는 DiaryEditor.js 코드입니다!import { useState, useRef, useContext, useEffect, useCallback } from 'react'; import { useNavigate } from 'react-router-dom'; import { DiaryDispatchContext } from './../App'; import EmotionItem from './EmotionItem'; import MyHeader from './MyHeader'; import MyButton from './MyButton'; import { getStringDate } from '../util/data'; import { emotionList } from '../util/emotion'; const DiaryEditor = ({ isEdit, originData }) => { const contentRef = useRef(); const [content, setContent] = useState(''); const [emotion, setEmotion] = useState(3); const [date, setDate] = useState(getStringDate(new Date())); const navigate = useNavigate(); const { onCreate, onEdit, onRemove } = useContext(DiaryDispatchContext); const handleClickEmote = useCallback((emotion) => { setEmotion(emotion); }, []); const handleSubmit = () => { if (content.length < 1) { contentRef.current.focus(); return; } if ( window.confirm( isEdit ? '일기를 수정하시겠습니까?' : '새로운 일기를 작성하시겠습니까?' ) ) { if (!isEdit) { onCreate(date, content, emotion); } else { onEdit(originData.id, date, content, emotion); } } navigate('/', { replace: true }); }; const handleRemove = () => { if (window.confirm('정말 삭제하시겠습니까?')) { onRemove(originData.id); navigate('/', { replace: true }); } }; useEffect(() => { if (isEdit) { setDate(getStringDate(new Date(parseInt(originData.date)))); setEmotion(originData.emotion); setContent(originData.content); } }, [isEdit, originData]); return ( <div className='DiaryEditor'> <MyHeader headerText={isEdit ? '일기 수정하기' : '새 일기 쓰기'} leftChild={ <MyButton onClick={() => navigate(-1)} text={'< 뒤로가기'} /> } rightChild={ isEdit && ( <MyButton onClick={handleRemove} text={'삭제하기'} type={'negative'} /> ) } /> <div> <section> <h4>오늘은 언제인가요?</h4> <div className='input_box'> <input className='input_date' value={date} onChange={(e) => setDate(e.target.value)} type='date' /> </div> </section> <section> <h4>오늘의 감정</h4> <div className='input_box emotion_list_wrapper'> {emotionList.map((it) => ( <EmotionItem onClick={handleClickEmote} isSelected={it.emotion_id === emotion} key={it.emotion_id} {...it} /> ))} </div> </section> <section> <h4>오늘의 일기</h4> <div className='input_box text_wrapper'> <textarea ref={contentRef} value={content} onChange={(e) => setContent(e.target.value)} placeholder='오늘은 어땠나요?' ></textarea> </div> </section> <section> <div className='control_box'> <MyButton text={'취소하기'} onClick={() => navigate(-1)} /> <MyButton text={'작성완료'} type={'positive'} onClick={handleSubmit} /> </div> </section> </div> </div> ); }; export default DiaryEditor;

6:25에서 POST /v1/token 요청시 성공인 200응답이 아니면 401응답으로 등록되지 않은 도메인이었거나 500응답으로 기타 에러였는데 그런 응답을 받았다면 else문 건너뛰고 바로 catch문으로 이동하게 되는 것 아닌가요? 6:25에 작성한 else문은 어떤 상황에 작동되는 건지 궁금합니다.

아무리 구글링 유튜브 찾아 봐도 알수가 없네요mock-sever 주소 크롬 주소창에 넣으면 분명히 자료가 잘 나오는데 vs코드에서 실행 하면 위에 처럼 에러가 나옵니다. 선생님 해결좀 부탁드립니다.수업을 나갈수가 없네요. 

상품 상세 페이지에서 구매 버튼을 누르게 되면,해당 상품의 soldout값이 1로 바뀌게고 적용 완료.그 이후 자동으로 구매 버튼이 회색으로 다시 바뀌겠끔도 구현 완료 그 이후 뒷 페이지로 돌아갔을 때, 상품 목록에서 blur처리 되는 기능이 구현되지 않아 이 방법이 궁금합니다.뒤로가기 버튼을 눌렀을 때는 해당 페이지가 새로 불러와지는 로직이 아닌가요? // Main페이지 코드 import { StatusBar } from "expo-status-bar"; import { StyleSheet, Text, View, Image, ScrollView, Dimensions, TouchableOpacity, Alert } from "react-native"; import React, {useEffect, useState} from "react"; import axios from "axios"; import dayjs from "dayjs" import relativeTime from "dayjs/plugin/relativeTime" import "dayjs/locale/ko" import Carousel from "react-native-reanimated-carousel" import { API_URL } from "../config/constants"; import AvatarImage from "../assets/icons/avatar.png"; dayjs.extend(relativeTime); dayjs.locale("ko"); export default function MainScreen(props) { const [products, setProducts] = useState([]); const [banners, setBanners] = useState([]); const getProduct = () => { axios .get(`${API_URL}/products`) .then((result) => { console.log(result); setProducts(result.data.products) }) .catch((error) => { console.error(error); }); } useEffect(() => { getProduct(); axios .get(`${API_URL}/banners`) .then((result) => { setBanners(result.data.banners); }) .catch((error) => { console.error(error); }) }, []); return ( <View style={styles.container}> <ScrollView> <Carousel data={banners} width={Dimensions.get("window").width} height={200} autoPlay={true} sliderWidth={Dimensions.get("window").width} itemWidth={Dimensions.get("window").width} itemHeight={200} renderItem={(obj) => { return ( <TouchableOpacity onPress={() => { Alert.alert("배너 클릭"); }} > <Image style={styles.bannerImage} source={{ uri: `${API_URL}/${obj.item.imageUrl}`}} resizeMode="contain" /> </TouchableOpacity> ); }} /> <Text style={styles.Headline}>판매되는 상품들</Text> <View sytle={styles.productList}> {products.map((product, index) => { return ( <TouchableOpacity onPress={() => { props.navigation.navigate("Product", { id: product.id }) }}> <View style={styles.productCard}> {product.soldout === 1 && ( <View style={styles.productBlur} /> )} <View> <Image style={styles.productImage} source={{ uri: `${API_URL}/${product.imageUrl}`, }} resizeMode={"contain"} /> </View> <View style={styles.productContents}> <Text sytle={styles.productName}> {product.name} </Text> <Text sytle={styles.productPrice}> {product.price}원 </Text> <View style={styles.productFooter}> <View style={styles.productSeller}> <Image style={styles.productAvatar} source={AvatarImage} /> <Text style={styles.productSellerName} > {product.seller} </Text> </View> <Text style={styles.productDate}> {dayjs(product.createdAt).fromNow()} </Text> </View> </View> </View> </TouchableOpacity> ); })} </View> </ScrollView> </View> ); } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff", padding: 32, }, productCard: { width: 320, borderColor: "rgb(230,230,230)", borderWidth: 1, borderRadius: 16, backgroundColor: "white", marginBottom: 8, }, productImage: { width: "100%", height: 210, }, productContents: { padding: 8, }, productSeller: { flexDirection: "row", alignItems: "center", }, productAvatar: { width: 24, height: 24, }, productFooter: { flexDirection: "row", justifyContent: "space-between", alignItems: "center", marginTop: 12, }, productName: { fontSize: 16, }, productPrice: { fontSize: 18, fontWeight: "600", marginTop: 8, }, productSellerName: { fontSize: 16, }, productDate: { fontSize: 16, }, productList: { alignItems: "center", }, Headline: { fontSize: 24, fontWeight: "800", marginBottom: 24, }, productBlur: { position: "absolute", top: 0, bottom: 0, left: 0, right: 0, backgroundColor : "#ffffffa6", zIndex: 999 }, bannerImage: { width: "90%", height: 200, }, safeAreaView: { flex: 1, backgroundColor: "#fff" } });   // Product 화면 코드 import axios from "axios"; import React, { useEffect, useState } from "react" import {Image, ActivityIndicator, StyleSheet, View, Text, TouchableOpacity, Alert, ScrollView} from "react-native" import { API_URL } from "../config/constants"; import Avatar from "../assets/icons/avatar.png" import dayjs from "dayjs" export default function ProductScreen(props){ const {id} = props.route.params; const [product, setProduct] = useState(null); const getProduct = () => { axios.get(`${API_URL}/products/${id}`) .then((result) => { console.log("product result : ", result.data); setProduct(result.data.product); }) .catch((error) => { console.error(error); }) } useEffect(() => { getProduct(); }, []); const onPressButton = () => { if(product.soldout !== 1) { axios.post(`${API_URL}/purchase/${id}`) .then((result) => { Alert.alert("구매가 완료되었습니다."); getProduct(); }) .catch((error) => { Alert.alert(`에러가 발생했습니다. ${error.message}`); }) } } if(!product){ return <ActivityIndicator /> } return ( <View style={styles.container}> <ScrollView> <View> <Image style={styles.productImage} source={{uri: `${API_URL}/${product.imageUrl}`}} resizeMode="contain" /> </View> <View style={styles.productSection}> <View style={styles.productSeller}> <Image style={styles.avatarImage} source={Avatar} /> <Text>{product.seller}</Text> </View> <View style={styles.divider} /> <View> <Text style={styles.productName}>{product.name}</Text> <Text style={styles.productPrice}>{product.price} 원</Text> <Text style={styles.productDate}>{dayjs(product.createAt).format("YYYY년 MM월 DD일")}</Text> <Text style={styles.productDescription}>{product.description}</Text> </View> </View> </ScrollView> <TouchableOpacity onPress={onPressButton}> <View style={product.soldout ===1 ? styles.purchaseDisabled : styles.purchaseButton}> <Text style={styles.purchaseText}>{product.soldout === 1 ? "구매완료" : "구매하기"}</Text> </View> </TouchableOpacity> </View> ) } const styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#fff" }, productImage: { width: "100%", height: 300 }, productSeller: { flexDirection: "row", alignItems: "center" }, avatarImage: { width: 50, height: 50, }, productSection: { padding: 16 }, divider: { backgroundColor: "#e9ecef", height: 1, marginVertical: 16 }, productName: { fontSize: 20, fontWeight: "400" }, productPrice: { fontSize: 18, fontWeight: "700", marginTop: 8 }, productDate: { fontSize:14, marginTop: 4, color: "rgb(204,204,204)" }, productDescription: { marginTop : 16, fontSize: 17 }, purchaseButton: { position: "absolute", bottom: 0, left: 0, right: 0, height: 60, backgroundColor: "rgb(255,80,88)", alignItems : "center", justifyContent: "center" }, purchaseText : { color: "white", fontSize: 20, }, purchaseDisabled: { position: "absolute", bottom: 0, left: 0, right: 0, height: 60, backgroundColor: "gray", alignItems : "center", justifyContent: "center" } })

기존에 mysql에 연결은 이런식으로 했습니다. 코드가 너무 지져분해서 mvc패턴으로 나눠보려고 하는중입니다.아래처럼 바꾸고 db연결하고 로그인하려고 하는데 이렇게 오류가 발생하고있습니다.구글링해봤는데 대부분은 처음에했던 위에것처럼 많이 나오는거 같아요. db를 models폴더에 mysql.js에 정의하고 controller에서 연결해서 사용하고싶습니다.혹시 controller에서 쿼리문입력하면 너무 지저분한거 같아서 강사님이 models의 user.js에 시퀄라이즈를 이용해서 db에 정보넣는것처럼 쿼리문 따로 폴더를 만들어서 가져오고 사용할수있나요?(쿼리문을 밖으로 빼서 사용하고싶습니다.) 자세히 설명해 주시면 감사하겠습니다.

사용자 이름을 누르면 사용자의 게시글이 출력되는 기능 구현중 res.render가 동작하지 않아 질문 드립니다.아래가 컨트롤러 부분이고 console.log(posts[0].User.nick); 이부분도 출력 되는걸 확인했습니다.그런데 title 안에 posts[0].User.nick 이 부분에서 오류가 뜨는데 위 console.log에서 출력이 되는데 왜 여기선 오류가 뜨는지도 모르겠고 title과 twits 부분을 지우고 main을 다른 페이지로 바꿨는데도 아예 동작을 하지 않는걸 확인했습니다. title 부분에서 오류가 안떠도 페이지가 제대로 로드 되지도 않습니다. exports.renderUpost = async (req, res, next) => { try { console.log("!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!"); let posts = []; if (req.params.userId) { const posts = await Post.findAll({ include: [ { model: User, where: { id: req.params.userId }, attributes: ["id", "nick"], }, ], }); console.log(posts[0].User.nick); } res.render("main", { title: ` ${posts[0].User.nick} | NodeBird`, twits: posts, }); } catch (error) { console.error(error); next(error); } }; 제가 작성자 이름을 a 태그로 해서 아래 코드처럼 수정해서 했는데 혹시 이 a태그에 넣은것들이 잘못된건가요? 위 코드에서 console.log 까지 출력 다 되는거 보면 문제가 없을것 같은데 그나마 생길것 같은게 이부분뿐이라 올려봅니다.<a href="#" onclick="findUpost(this);return false;" class="twit-author">{{twit.User.nick}}</a>

강의에 나온 대로 아무리 해도 계속 서버 에러가 뜨네요. 이전에 질문했던 codegen 까지 설치 완료 해서 제대로 작동이 되는데 이 페이지만 실행시키면 계속 오류가 발생합니다. 저가 뭘 잘못한 걸까요?  import { useQuery, gql } from "@apollo/client"; import type { IQuery, IQueryFetchBoardArgs, } from "../../../src/commons/types/generated/types"; const FETCH_BOARDS = gql` query { fetchBoards { _id writer title contents } } `; export default function StaticRoutingMovedPage() { const { data } = useQuery<Pick<IQuery, "fetchBoards">, IQueryFetchBoardArgs>( FETCH_BOARDS ); console.log(data?.fetchBoards); return ( <div> {data?.fetchBoards.map((el) => ( <div key={el._id}> <span style={{ margin: "10px" }}>{el.title}</span> <span style={{ margin: "10px" }}>{el.writer}</span> </div> ))} </div> ); }  

안녕하세요.그랩마켓 상세페이지 만들기 중에서 농구공 이미지 하고postman에서 만든 products/1 내용이 안나오기에 MOCK SEVER를 다시 생성해서 .GET에 복사 붙여 넣기를 했습니다.그랬더니 에러가 나면서 아무것도 안보이게 됐습니다.그래서 lean-all-with -java 페이지로 가서 INDEX.HTML로 에 있는 axios.get ( "https://831a8e94-7b7a-4354-9e1a-eb37becbc7ad.mock.pstmn.io/products"에 가서 보니 예전에 만들은 것들은 그대로 더군요. 그래서 이것도 지우고 새로 만든 mock주소를 넣었더니 이것도 에러가 납니디.원래 mock서버 새로 만들어서 붙여 놓으면 안되나요? 몇일동안 매달려도 안되네요.도와주세요.선생님

안녕하세요강의 영상 잘 보고 있습니다.next.js 설치를 강의영상과 동일하게 명령어로 설치하는데 디렉토리 구조가 영상과 달라서 문의드립니다.별것 아닌 문제긴 한데 pages 폴더가 제쪽에는 설치가되지 않아서 경로설정등의 소소한 차이가 생겨서 문의드립니다.감사합니다

에러 종류: 위와 같은 환경에서 error: password authentication failed for user "postgres" 로 추정되는 에러 발생아마 서버 연결시 인증 문제로 보입니다.작동 절차: docker-compose up 입력,server 파일로 이동, npm run dev 실행. 에러 발생+1)POSTGRES_HOST_AUTH_METHOD: trust로 설정하고 서버 새로 만들어도 동일한 에러가 발생하여 무슨 문제일지 잘 모르겠네요.. 도움 주시면 감사하겠습니다.+2) 아래에 터미널의 전체 에러 코드 남깁니다.C:\Users\tukim\Desktop\reddit-clone-app\server>npm run dev > server@1.0.0 dev> nodemon --exec ts-node ./src/server.ts[nodemon] 3.0.1[nodemon] to restart at any time, enter rs[nodemon] watching path(s): .[nodemon] watching extensions: ts,json[nodemon] starting ts-node ./src/server.tsserver running at https://localhost:4000error: ����� "postgres"�� password ������ �����߽��ϴ� at Parser.parseErrorMessage (C:\Users\tukim\Desktop\reddit-clone-app\server\node_modules\pg-protocol\src\parser.ts:369:69) at Parser.handlePacket (C:\Users\tukim\Desktop\reddit-clone-app\server\node_modules\pg-protocol\src\parser.ts:188:21) at Parser.parse (C:\Users\tukim\Desktop\reddit-clone-app\server\node_modules\pg-protocol\src\parser.ts:103:30) at Socket.<anonymous> (C:\Users\tukim\Desktop\reddit-clone-app\server\node_modules\pg-protocol\src\index.ts:7:48) at Socket.emit (node:events:513:28) at Socket.emit (node:domain:489:12) at addChunk (node:internal/streams/readable:324:12) at readableAddChunk (node:internal/streams/readable:297:9) at Socket.Readable.push (node:internal/streams/readable:234:10) at TCP.onStreamRead (node:internal/stream_base_commons:190:23) { length: 107, severity: 'ġ��������', code: '28P01', detail: undefined, hint: undefined, position: undefined, internalPosition: undefined, internalQuery: undefined, where: undefined, schema: undefined, table: undefined, column: undefined, dataType: undefined, constraint: undefined, file: 'auth.c', line: '329', routine: 'auth_failed'}