이렇게 초기값을 설정 해주지 않았을 때, 하나의 항목만 수정하고 수정하기 버튼을 누르면 다른 항목들은 그 전 내용 그대로 띄워졌는데 그 이유가 궁금해요 !굳이 boards 수정 2편에서 한 방법이 아니더라도 이렇게 하면 문제가 되는 걸까요 ? 초기값을 설정 안해주면 안되는 이유가 있나요 ㅜㅜ강사님께서 그냥 여기 초기값을 "" 빈문자열로 바꾸고 다시 실행하시기만 하셔서 왜 이 방법을 쓰면 안되는지, boards 수정 2편의 방법과는 무슨 차이가 있는지 잘 모르겠습니다 ..!

package.json "dependencies": { "@ant-design/icons": "^5.0.1",위와 같이 수정 후 yarn.lock, node_modules 삭제 - yarn install 하여 재 설치 하여도 아래와 같이 err 문구는 사라지지 않았으며 yarn dev를 통해 웹페이지 확인 하면 정상적으로 icon은 출력됩니다.icon = 정상 출력 되나 코드상 error 문구는 삭제되지 않습니다.VS code 를 재시작 하여도code_modules 등 삭제 후 재설치 3~4번 하여도 동일합니다. yarn.lock 첨부합니다."@ant-design/icons-svg@^4.3.0": version "4.3.2" resolved "https://registry.yarnpkg.com/@ant-design/icons-svg/-/icons-svg-4.3.2.tgz#ab2e082991877fdc85b2b32f0b68628b716bad23" integrity sha512-s9WV19cXTC/Tux/XpDru/rCfPZQhGaho36B+9RrN1v5YsaKmE6dJ+fq6LQnXVBVYjzkqykEEK+1XG+SYiottTQ== "@ant-design/icons@^4.8.1": version "4.8.1" resolved "https://registry.yarnpkg.com/@ant-design/icons/-/icons-4.8.1.tgz#44f6c81f609811d68d48a123eb5dcc477f8fbcb7" integrity sha512-JRAuiqllnMsiZIO8OvBOeFconprC3cnMpJ9MvXrHh+H5co9rlg8/aSHQfLf5jKKe18lUgRaIwC2pz8YxH9VuCA== dependencies: "@ant-design/colors" "^6.0.0" "@ant-design/icons-svg" "^4.3.0" "@babel/runtime" "^7.11.2" classnames "^2.2.6" lodash "^4.17.15" rc-util "^5.9.4" "@ant-design/icons@^5.0.1": version "5.2.6" resolved "https://registry.yarnpkg.com/@ant-design/icons/-/icons-5.2.6.tgz#2d4a9a37f531eb2a20cebec01d6fb69cf593900d" integrity sha512-4wn0WShF43TrggskBJPRqCD0fcHbzTYjnaoskdiJrVHg86yxoZ8ZUqsXvyn4WUqehRiFKnaclOhqk9w4Ui2KVw== dependencies: "@ant-design/colors" "^7.0.0" "@ant-design/icons-svg" "^4.3.0" "@babel/runtime" "^7.11.2" classnames "^2.2.6" rc-util "^5.31.1"

SyntaxError: Cannot use import statement outside a module 오류가 발생하는데 boards에서 수정하기, 상세페이지를 들어갈 때는 문제가 없다가 수정하기, 상세페이지 안에서 f5를 누르면 위와 같은 오류가 발생했습니다. 어떤게 문제인지 알려주시면 감사하겠습니다.

AntDesign만 사용하면 SyntaxError: Cannot use import statement outside a module 에러가 나옵니다.구글링 해서 package.json에 "type":"module"을 작성하면 된다고 하는데 작성하면 ReferenceError: module is not defined in ES module scope 에러가 나옵니다어떻게 해결하면 좋을까요?

안녕하세요 제로초님 다른 비슷한 질문에서 다음과 같은 답변을 하셨어요 런타임에 있어서 런타임에도 타입체크를 수행하길 원하면 class로 선언하면 되고, 런타임에는 없길 원하면 interface를 쓰시면 됩니다. 런타임이 실제 코드가 실행될때라고 이해하고 있는데 런타임에 타입체크등 코드가 남아있으면 좋은점이 와닿지 않아서요!실제로 어떤 경우에 런타임에 코드가 남아있서서 좋은지, 타입체크가 되면 좋은지 여쭤봐도 될까요?

이 부분 에러 어떻게 고치나요?export const firebaseApp = initializeApp(firebaseConfig, "appname") 하니까 위에 오류는 안뜨는데 이 방법이 맞나요?저 방법으로 수정하면이 오류가 뜹니다 ㅠ

 @Field 하면 어떠한 객체에 있는것에 있는 Field 를 가져다 쓸거야~ 라고 말하면서 그러한 함수를 불러오는 건가요?? ㄷ

안녕하세요 선생님 이미지 업로드와 관련한 질문 사항인데요, 도메인 연결 후 이미지 업로드시 이미지가 화면에 안뜨고, 서버에서 아래와 같은 타입 에러가 발생해서 에러 원인을 검색해보았는데, 버전을 2에서 3으로 업그레이드 한 뒤 코드를 수정한 뒤 이미지는 화면에 떴는데, 게시글이 안올라가서 보니까 이미지 Url길이가 너무 길어서 발생한 문제인것 같아서 image테이블에 src컬럼 길이 1000으로 변경하니까 에러가 해결되긴 했는데, 이렇게 변경해도 될까욧?백엔드 에러로그)0|app | Please migrate your code to use AWS SDK for JavaScript (v3). 0|app | For more information, check the migration guide at https://a.co/7PzMCcy 0|app | (Use `node --trace-warnings ...` to show where the warning was created) 0|app | TypeError: this.client.send is not a function 0|app | at _Upload.__uploadUsingPut (/home/ubuntu/react_nodebird/back/node_modules/@aws-sdk/lib-storage/dist-cjs/index.js:217:53) 0|app | at _Upload.__doConcurrentUpload (/home/ubuntu/react_nodebird/back/node_modules/@aws-sdk/lib-storage/dist-cjs/index.js:280:29) 0|app | at process.processTicksAndRejections (node:internal/process/task_queues:95:5) 0|app | at async Promise.all (index 0) 0|app | at async _Upload.__doMultipartUpload (/home/ubuntu/react_nodebird/back/node_modules/@aws-sdk/lib-storage/dist-cjs/index.js:366:5) 0|app | at async _Upload.done (/home/ubuntu/react_nodebird/back/node_modules/@aws-sdk/lib-storage/dist-cjs/index.js:190:12)문의1)back/package.json 버전 => aws-sdk 2버전에서 aws-sdk/client-s3 3버전으로 업그레이드{ "name": "react-nodebird-back", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "start": "cross-env NODE_ENV=production pm2 start app.js" }, "author": "luckyhaejin", "license": "ISC", "dependencies": { "@aws-sdk/client-s3": "^3.496.0", "aws-sdk": "^2.1538.0", "bcrypt": "^5.1.1", "cookie-parser": "^1.4.6", "cors": "^2.8.5", "cross-env": "^7.0.3", "dotenv": "^16.3.1", "express": "^4.18.2", "express-session": "^1.17.3", "helmet": "^7.1.0", "hpp": "^0.2.3", "morgan": "^1.10.0", "multer": "^1.4.5-lts.1", "multer-s3": "^3.0.1", "mysql2": "^3.6.5", "passport": "^0.7.0", "passport-local": "^1.0.0", "pm2": "^5.3.0", "sequelize": "^6.35.2", "sequelize-cli": "^6.6.2" }, "devDependencies": { "nodemon": "^2.0.22" } } 수정한 후 post.js 이미지 관련 코드const express = require('express'); const {Post, Image, Comment, User, Hashtag} = require('../models'); const {isLoggedIn} = require('./middlewares'); const router = express.Router(); const multer = require('multer'); const path = require('path'); const fs = require('fs'); const multerS3 = require('multer-s3'); // const AWS = require('aws-sdk'); try { fs.accessSync('uploads'); } catch(error) { console.error('uploads폴더가 없으므로 생성합니다.'); fs.mkdirSync('uploads'); } // AWS.config.update({ // accessKeyId: process.env.S3_ACCESS_KEY_ID, // secretAccessKey: process.env.S3_SECRET_ACCESS_KEY, // region: 'ap-northeast-2', // }); const { S3Client } = require('@aws-sdk/client-s3'); const s3Client = new S3Client({ credentials: { accessKeyId: process.env.S3_ACCESS_KEY_ID, secretAccessKey: process.env.S3_SECRET_ACCESS_KEY, }, region: 'ap-northeast-2', }); const upload = multer({ storage: multerS3({ // s3: new AWS.S3(), s3: s3Client, bucket: 'react-saga-nodebird-s3', key(req, file, cb){ cb(null, `original/${Date.now()}_${path.basename(file.originalname)}`) } }), limits: {fileSize: 20 * 1024 * 1024} //20MB }); router.post('/images', isLoggedIn, upload.array('image'),(req, res, next) => { //POST /post/images res.json(req.files.map((v) => v.location)); }); 게시글 업로드시 에러 로그)Error 0|app | at Query.run (/home/ubuntu/react_nodebird/back/node_modules/sequelize/lib/dialects/mysql/query.js:52:25) 0|app | at /home/ubuntu/react_nodebird/back/node_modules/sequelize/lib/sequelize.js:315:28 0|app | at process.processTicksAndRejections (node:internal/process/task_queues:95:5) 0|app | at async MySQLQueryInterface.insert (/home/ubuntu/react_nodebird/back/node_modules/sequelize/lib/dialects/abstract/query-interface.js:308:21) 0|app | at async Image.save (/home/ubuntu/react_nodebird/back/node_modules/sequelize/lib/model.js:2490:35) 0|app | at async Image.create (/home/ubuntu/react_nodebird/back/node_modules/sequelize/lib/model.js:1362:12) 0|app | at async /home/ubuntu/react_nodebird/back/routes/post.js:60:31 { 0|app | name: 'SequelizeDatabaseError', 0|app | parent: Error: Data too long for column 'src' at row 1 0|app | at Packet.asError (/home/ubuntu/react_nodebird/back/node_modules/mysql2/lib/packets/packet.js:728:17) 0|app | at Execute.execute (/home/ubuntu/react_nodebird/back/node_modules/mysql2/lib/commands/command.js:29:26) 0|app | at Connection.handlePacket (/home/ubuntu/react_nodebird/back/node_modules/mysql2/lib/connection.js:481:34) 0|app | at PacketParser.onPacket (/home/ubuntu/react_nodebird/back/node_modules/mysql2/lib/connection.js:97:12) 0|app | at PacketParser.executeStart (/home/ubuntu/react_nodebird/back/node_modules/mysql2/lib/packet_parser.js:75:16) 0|app | at Socket.<anonymous> (/home/ubuntu/react_nodebird/back/node_modules/mysql2/lib/connection.js:104:25) 0|app | at Socket.emit (node:events:518:28) 0|app | at addChunk (node:internal/streams/readable:559:12) 0|app | at readableAddChunkPushByteMode (node:internal/streams/readable:510:3) 0|app | at Readable.push (node:internal/streams/readable:390:5) { 0|app | code: 'ER_DATA_TOO_LONG', 0|app | errno: 1406, 0|app | sqlState: '22001', 0|app | sqlMessage: "Data too long for column 'src' at row 1", 0|app | sql: 'INSERT INTO `images` (`id`,`src`,`createdAt`,`updatedAt`) VALUES (DEFAULT,?,?,?);', 0|app | parameters: [ 0|app | 'https://react-saga-nodebird-s3.s3.ap-northeast-2.amazonaws.com/original/1705984124288_%C3%A1%C2%84%C2%89%C3%A1%C2%85%C2%B3%C3%A1%C2%84%C2%8F%C3%A1%C2%85%C2%B3%C3%A1%C2%84%C2%85%C3%A1%C2%85%C2%B5%C3%A1%C2%86%C2%AB%C3%A1%C2%84%C2%89%C3%A1%C2%85%C2%A3%C3%A1%C2%86%C2%BA%202024-01-23%20%C3%A1%C2%84%C2%8B%C3%A1%C2%85%C2%A9%C3%A1%C2%84%C2%92%C3%A1%C2%85%C2%AE%2012.20.36.png', 0|app | '2024-01-23 04:33:31', 0|app | '2024-01-23 04:33:31' 0|app | ] 0|app | }, 0|app | original: Error: Data too long for column 'src' at row 1 0|app | at Packet.asError (/home/ubuntu/react_nodebird/back/node_modules/mysql2/lib/packets/packet.js:728:17) 0|app | at Execute.execute (/home/ubuntu/react_nodebird/back/node_modules/mysql2/lib/commands/command.js:29:26) 0|app | at Connection.handlePacket (/home/ubuntu/react_nodebird/back/node_modules/mysql2/lib/connection.js:481:34) 0|app | at PacketParser.onPacket (/home/ubuntu/react_nodebird/back/node_modules/mysql2/lib/connection.js:97:12) 0|app | at PacketParser.executeStart (/home/ubuntu/react_nodebird/back/node_modules/mysql2/lib/packet_parser.js:75:16) 0|app | at Socket.<anonymous> (/home/ubuntu/react_nodebird/back/node_modules/mysql2/lib/connection.js:104:25) 0|app | at Socket.emit (node:events:518:28) 0|app | at addChunk (node:internal/streams/readable:559:12) 0|app | at readableAddChunkPushByteMode (node:internal/streams/readable:510:3) 0|app | at Readable.push (node:internal/streams/readable:390:5) { 0|app | code: 'ER_DATA_TOO_LONG', 0|app | errno: 1406, 0|app | sqlState: '22001', 0|app | sqlMessage: "Data too long for column 'src' at row 1", 0|app | sql: 'INSERT INTO `images` (`id`,`src`,`createdAt`,`updatedAt`) VALUES (DEFAULT,?,?,?);', 0|app | parameters: [ 0|app | 'https://react-saga-nodebird-s3.s3.ap-northeast-2.amazonaws.com/original/1705984124288_%C3%A1%C2%84%C2%89%C3%A1%C2%85%C2%B3%C3%A1%C2%84%C2%8F%C3%A1%C2%85%C2%B3%C3%A1%C2%84%C2%85%C3%A1%C2%85%C2%B5%C3%A1%C2%86%C2%AB%C3%A1%C2%84%C2%89%C3%A1%C2%85%C2%A3%C3%A1%C2%86%C2%BA%202024-01-23%20%C3%A1%C2%84%C2%8B%C3%A1%C2%85%C2%A9%C3%A1%C2%84%C2%92%C3%A1%C2%85%C2%AE%2012.20.36.png', 0|app | '2024-01-23 04:33:31', 0|app | '2024-01-23 04:33:31' 0|app | ] 0|app | }, 0|app | sql: 'INSERT INTO `images` (`id`,`src`,`createdAt`,`updatedAt`) VALUES (DEFAULT,?,?,?);', 0|app | parameters: [ 0|app | 'https://react-saga-nodebird-s3.s3.ap-northeast-2.amazonaws.com/original/1705984124288_%C3%A1%C2%84%C2%89%C3%A1%C2%85%C2%B3%C3%A1%C2%84%C2%8F%C3%A1%C2%85%C2%B3%C3%A1%C2%84%C2%85%C3%A1%C2%85%C2%B5%C3%A1%C2%86%C2%AB%C3%A1%C2%84%C2%89%C3%A1%C2%85%C2%A3%C3%A1%C2%86%C2%BA%202024-01-23%20%C3%A1%C2%84%C2%8B%C3%A1%C2%85%C2%A9%C3%A1%C2%84%C2%92%C3%A1%C2%85%C2%AE%2012.20.36.png', 0|app | '2024-01-23 04:33:31', 0|app | '2024-01-23 04:33:31' 0|app | ] 0|app | } models/image -> src컬럼 길이 200에서 1000으로 변경 const DataTypes = require('sequelize'); const {Model} = DataTypes; module.exports = class Image extends Model { static init(sequelize) { return super.init({ //id가 기본적으로 들어있다 src: { type:DataTypes.STRING(1000), allowNull:false }, },{ modelName: 'Image', tableName: 'images', charset: 'utf8', collate: 'utf8_general_ci', sequelize }); } static associate(db) { db.Image.belongsTo(db.Post); } }  

안녕하세요 선생님 도메인 연결을 했는데, 처음에 Front 도메인을 입력한 뒤 ?가 붙는 원인을 어떻게 알 수 있는지 궁급합니다. 도메인 연결 후 login후 Network => Headers-> RequestURL, Access-Control-Allow-Orign, SetCookie, Application->Cookies에는 도메인주소와 쿠키가 있고, 백엔드 도메인 입력시에는 물음표 안생깁니다. 둘다 화면은 잘 나옵니다.백엔드 도메인 입력시)프론트 도메인 입력시)로그인시 network, application) 

안녕하세요! 제로초님[리뉴얼] React로 NodeBird SNS 만들기 강의의섹션 6. AWS에 배포하기: 프론트 서버 배포하기 강의를 진행 중인 수강생 입니다!우분투 프론트 서버는 구동이 되지만 프론트 IP 주소 사이트가 페이지 응답이 되지 않아 질문 올립니다!'로컬 리소스를 로드할 수 없습니다' 에러가 콘솔에 출력 되었지만 새로 고침을 하면서 없어졌습니다!Not allowed to load local resource: chrome-error://chromewebdata/#buttons사전에 아래 사항을 정확히 확인 후 질문을 올립니다!1. EC2 프론트 서버와 백엔드 인스턴스 상태는 잘 실행 중이며,프론트 퍼블릭 IPv4가 틀리지 않았는지 확인하였습니다.2. 로컬 프론트 경로에서 npm run build를 하였습니다.-> 저의 경우 우분투 프론트 서버에서 npm run build를 하면 메모리가 부족해 멈춤 현상이 나타납니다.-> 그래서 .next를 Git LFS로 관리하였고, 로컬 프론트에서 빌드에 성공하였습니다.3. 윈도우 서비스에서 MySQL 서비스를 실행한 상태입니다.4. 우분투 백엔드 서버 실행에 성공한 상태입니다!5. 로컬 프론트 경로에서 node_module과 .next를 삭제했다가 npm i와 build를 통해 다시 만들었습니다.6. about.js는 잠시 바탕 화면으로 옮겼습니다.우분투 프론트 서버에 아래 명령어를 순서대로 입력하였습니다.(우분투 프론트 서버의 경우 sudo를 붙이지 않아도 되었습니다.)sudo git pull>>> 메모리 부족 문제로 npm run build는 로컬 프론트에서 진행하고 아래 작업을 마저 진행했습니다. <<<sudo npx pm2 reload allnpx pm2 start npm -- startsudo npx pm2 monit우분투 프론트 서버가 실행된 상태입니다.우분투 백엔드 서버에 아래 명령어를 순서대로 입력하였습니다.sudo git pullsudo npx pm2 reload allsudo npx pm2 monit우분투 백엔드 서버가 실행된 상태입니다.back/app.js실제 프론트 서버 주소의 CORS 요청을 허용하였습니다.cors 요청 주소들을 변수로 빼서 작성하였습니다. // 로컬 프론트 서버, 노드버드 닷컴, 실제 프론트 서버 URL IP 주소 요청만 허용 const corsOkUrl = ['http://localhost:3000', 'nodebird.com', 'http://52.79.86.100' ]; . . . // 미들웨어 연결 app.use(cors({ /* 특정 url에서 요청했을 때만 cors 허용 */ origin: corsOkUrl, /* 사용자 인증이 필요한 쿠키 전달 허용 */ credentials: true, })); . . . // http://54.180.201.249 : 실제 백엔드 서버 URL IP 주소인 80번 포트로 서버 실행 app.listen(80, () => { console.log('서버 실행 중!'); }); back/config/config.js실제 백엔드 주소가 들어가는 부분 코드에 모두 'backUrl'을 변수로 넣어주었습니다.// 실제 백엔드 서버 URL IP 주소 내보내기 export const backUrl = 'http://54.180.201.249';  front와 back의 package.json이 문제를 해결하기 위해 먼저 노드버드 커뮤니티를 살펴보았습니다.https://www.inflearn.com/course/lecture?courseSlug=%EB%85%B8%EB%93%9C%EB%B2%84%EB%93%9C-%EB%A6%AC%EC%95%A1%ED%8A%B8-%EB%A6%AC%EB%89%B4%EC%96%BC&unitId=49016&category=questionDetail&tab=community&q=164898저와 비슷하게 프론트 서버 구동에 성공하였으나 페이지 응답이 되지 않는 작성자 분이 계셨습니다.글과 똑같이 우분투 프론트 서버 터미널에서 ctrl+c로 sudo npx pm2 monit을 끄고pm2 list를 입력하면 status가 errored 임을 확인할 수 있었습니다.보안 그룹에서 http 80번 포트가 열려있음에도 status는 errored 였습니다.Not allowed to load local resource 에러 해결,우분투 프론트 서버 페이지 응답 등의 키워드로 검색하였으나이미지 외부 경로 지정하기 관련 글들만 있어 방법이 맞는지 의심스럽습니다...프론트 서버 구동 시 어떻게 하면 페이지 응답이 안되는 문제를 해결할 수 있을까요?질문 글이 많이 김에도 끝까지 읽어주셔서 감사합니다제로초님 강의 항상 잘 보고 있습니다!

선생님 안녕하세요도메인 대신 탄력적 ip2개를 front, back인스턴스에 연결해서 사용중인데요, 로그인이 되지 않았습니다.라는 메세지가 뜨며 이미지 업로드가 안되서 안되 상황입니다. isAuthenticated가 false가 되는 원인을 알고 이 문제를 해결하고 싶어 문의드립니다. 사용중인 ip)back13.209.144.99front13.125.122.77현재 화면)monit에 uploadImages관련 상태 결과 falseerrorlog 전체)에러로그 일부)0|npm | cause: Error: socket hang up 0|npm | at connResetException (node:internal/errors:787:14) 0|npm | at Socket.socketOnEnd (node:_http_client:519:23) 0|npm | at Socket.emit (node:events:530:35) 0|npm | at endReadableNT (node:internal/streams/readable:1696:12) 0|npm | at process.processTicksAndRejections (node:internal/process/task_queues:82:21) { 0|npm | code: 'ECONNRESET' 0|npm | } 0|npm | } 0|npm | TypeError: Cannot read properties of undefined (reading 'data') 0|npm | at loadMyInfo (/home/ubuntu/react_nodebird/front/.next/server/pages/_app.js:531:27) 0|npm | at loadMyInfo.throw (<anonymous>) 0|npm | at next (/home/ubuntu/react_nodebird/front/node_modules/@redux-saga/core/dist/redux-saga-core.prod.cjs.js:1070:32) 0|npm | at currCb (/home/ubuntu/react_nodebird/front/node_modules/@redux-saga/core/dist/redux-saga-core.prod.cjs.js:1195:7) 0|npm | at /home/ubuntu/react_nodebird/front/node_modules/@redux-saga/core/dist/redux-saga-core.prod.cjs.js:346:5 0|npm | at process.processTicksAndRejections (node:internal/process/task_queues:95:5) 0|npm | The above error occurred in task loadMyInfo 0|npm | created by takeLatest(LOAD_MY_INFO_REQUEST, loadMyInfo) 0|npm | created by watchLoadMyInfo 0|npm | created by userSaga 0|npm | created by rootSaga 0|npm | Tasks cancelled due to error: 0|npm | postSaga 0|npm | TypeError: Cannot read properties of undefined (reading 'data') 0|npm | at loadMyInfo (/home/ubuntu/react_nodebird/front/.next/server/pages/_app.js:531:27) 0|npm | at loadMyInfo.throw (<anonymous>) 0|npm | at next (/home/ubuntu/react_nodebird/front/node_modules/@redux-saga/core/dist/redux-saga-core.prod.cjs.js:1070:32) 0|npm | at currCb (/home/ubuntu/react_nodebird/front/node_modules/@redux-saga/core/dist/redux-saga-core.prod.cjs.js:1195:7) 0|npm | at /home/ubuntu/react_nodebird/front/node_modules/@redux-saga/core/dist/redux-saga-core.prod.cjs.js:346:5 0|npm | at process.processTicksAndRejections (node:internal/process/task_queues:95:5)질문1)이미지 업로드시 isAuthenticated가 false가 되는 원인이 뭘까요?질문2)도메인 안쓰고 탄력적 ip 2개 연결해서 쓰면 쿠키가 전달이 안되서 이미지 업로드는 못하나요?질문3)이 부분에 문제가 있을까요?if(process.env.NODE_ENV === 'production'){ app.use(morgan('combined')); app.use(hpp()); app.use(helmet()); app.use(cors({ origin: 'http://13.125.122.77', credentials: true, })); } else { app.use(morgan('dev')); } app.use(cors({ origin: ['http://localhost:3060', 'http://13.125.122.77'], credentials:true }));app.use(session({ saveUninitialized: false, resave: false, secret: process.env.COOKIE_SECRET, cookie: { httpOnly: true, //자바스크립트로 접근하지못하게 secure: false, //일단 false로 하고 https적용할 땐 ture // domain: process.env.NODE_ENV = 'production' && '.nodebirdcom' //도메인 사용할 경우 }, }));back/app.js 전체const express = require('express'); const cors = require('cors'); const session = require('express-session'); const cookieParser = require('cookie-parser'); const passport = require('passport'); const dotenv = require('dotenv'); const morgan = require('morgan'); const postRouter = require('./routes/post'); const postsRouter = require('./routes/posts'); const userRouter = require('./routes/user'); const hashtagRouter = require('./routes/hashtag'); const db = require('./models'); const passportConfig = require('./passport'); const path = require('path'); const hpp = require('hpp'); const helmet = require('helmet'); dotenv.config(); const app = express(); db.sequelize.sync() .then(() => { console.log('DB 연결 성공'); }).catch(console.error); passportConfig(); if(process.env.NODE_ENV === 'production'){ app.use(morgan('combined')); app.use(hpp()); app.use(helmet()); app.use(cors({ origin: ['http://nodebird.com', 'http://13.125.122.77'], credentials: true, })); } else { app.use(morgan('dev')); } app.use(cors({ origin: ['http://localhost:3060', 'http://nodebird.com', 'http://13.125.122.77'], credentials:true })); app.use('/', express.static(path.join(__dirname, 'uploads'))); app.use(express.json()); app.use(express.urlencoded({extended:true})); app.use(cookieParser(process.env.COOKIE_SECRET)); app.use(session({ saveUninitialized: false, resave: false, secret: process.env.COOKIE_SECRET, cookie: { httpOnly: true, //자바스크립트로 접근하지못하게 secure: false, //일단 false로 하고 https적용할 땐 ture // domain: process.env.NODE_ENV = 'production' && '.nodebirdcom' //도메인 사용할 경우 }, })); app.use(passport.initialize()); app.use(passport.session()); app.get('/', (req, res) =>{ res.send('hello express'); }); app.use('/posts', postsRouter); app.use('/post', postRouter); app.use('/user', userRouter); app.use('/hashtag', hashtagRouter); app.listen(80, () => { console.log('서버 실행 중'); }); routes/post 일부const express = require('express'); const {Post, Image, Comment, User, Hashtag} = require('../models'); const {isLoggedIn} = require('./middlewares'); const router = express.Router(); const multer = require('multer'); const path = require('path'); const fs = require('fs'); const multerS3 = require('multer-s3'); const AWS = require('aws-sdk'); try { fs.accessSync('uploads'); } catch(error) { console.error('uploads폴더가 없으므로 생성합니다.'); fs.mkdirSync('uploads'); } AWS.config.update({ accessKeyId: process.env.S3_ACCESS_KEY_ID, secretAccessKey: process.env.S3_SECRET_ACCESS_KEY, region: 'ap-northeast-2', }); const upload = multer({ storage: multerS3({ s3: new AWS.S3(), bucket: 'react-saga-nodebird-s3', key(req, file, cb){ cb(null, `original/${Date.now()}_${path.basename(file.originalname)}`) } }), limits: {fileSize: 20 * 1024 * 1024} //20MB }); router.post('/images', isLoggedIn, upload.array('image'),(req, res, next) => { //POST /post/images res.json(req.files.map((v) => v.location)); });middlewares.jsexports.isLoggedIn = (req, res, next) => { if(req.isAuthenticated()) { next(); } else { res.status(401).send('로그인이 필요합니다.'); } }front에 img src에서 backUrl 지워줌시도해본 것)cors리소스 공유에 아래 내용을 넣어서 실행해보기도 하고 없는 상태에서도 실행해보았지만 상태코드는 401에 이미지 업로드 실패back/package.json 일부"scripts": { "test": "echo \"Error: no test specified\" && exit 1", "start": "cross-env NODE_ENV=production pm2 start app.js" },front/package.json 일부"scripts": { "dev": "npx browserslist@latest --update-db && NODE_OPTIONS=--openssl-legacy-provider next -p 3060", "build": "cross-env ANALYZE=true NODE_ENV=production next build", "start": "cross-env NODE_ENV=production next start -p 80", "lint": "eslint ." },

🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!- 서로 예의를 지키며 존중하는 문화를 만들어가요. - 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요.강의를 집에서 또는 사무실에서 들으니 진도가 나간 부분에 대한 코딩을 이어서 나가질 못하는데 혹시 강의에 대한 소스를 어디서 어떻게 쉽게 찾아볼 수 있을까요?답변 부탁드립니다.감사합니다.

콘솔창이 보이지 않는데 어떻게 열어야되는지 궁금합니다!

 안녕하세요, 09-데이터 정규화 1에서 구글 시트를 사용하시는데 이 주소 어디서 접속 가능할까요?

 가입하기 버튼 누르면 에레메세지 출력하게 할때저는 wrapper바깥으로 내용이 빠져 나가는데어떻게 해야 wrapper크기도 같이 늘어나게 하는건가요?

크롬 개발자 도구에서 페이로드 확인을 하면 fetchBoards가 두번 요청을 합니다.시작점을 확인을 해보면 createUploadLink.js에서 빈 값으로 요청을 하고두 번째 요청에서는 제대로 index.tsx에서 값을 넣고 refetch를 진행을 합니다.fetchBoards가 1,3번 이고 fetchBoardsCount가 2번 입니다. 사용하는데 있어 아무런 문제 없이 사용이 가능한데 왜 이런 현상이 있는지 해결을 하고 싶습니다. 첫 마운트가 되거나 API요청을 하면 불필요한 fetchBoards, fetchBoardsCount가 createUploadLink.js에서 요청이 가는데ApolloClient Setting 부분에서 요청이 가는 걸 확인 했습니다.const uploadLink = createUploadLink({ uri: "http://backend-practice.codebootcamp.co.kr/graphql", }); const client = new ApolloClient({ link: ApolloLink.from([uploadLink]), cache: new InMemoryCache(), }); refetch하는 전체 코드입니다.// test - refetch 문제 export default function Hom(): JSX.Element { const { data, refetch } = useQueryFetchBoards(); const { data: dataBoardsCount, refetch: refetchBoardsCount } = useQueryFetchBoardsCount(); const router = useRouter(); const render = useRef(false); useEffect(() => { // 첫 마운트 실행 막음 if (!render.current) { render.current = true; console.log("처음 실행됨"); return; } const search = String(router.query.search); const page = Number(router.query.page) || 1; if (search === "undefined") { void refetch({ page }); console.log("검색X"); } else { void refetch({ page, search }); void refetchBoardsCount({ search }); console.log("검색O"); } console.log("Hom Search: ", search); }, [router.query]); return ( <> <SearchBar /> {data?.fetchBoards.map((el, index) => ( <div key={index}>{el.title}</div> ))} <Pagination count={dataBoardsCount?.fetchBoardsCount} /> </> ); }여기서 <SearchBar /> , <Pagination />는 router.push에서 query로 ?search= , ?page= 쿼리스트링 만드는 역할만 하고 있고 전체 부모 컴포넌트에서 useEffetch로 refetch하고 있습니다."next": "13", "react": "^18.2.0","apollo-upload-client": "^17.0.0", 입니다.

04-05 ODM - mongoDB접속 강의에서 docker-compose build했을 때 > [mybackend 5/6] RUN yarn install:0.132 yarn install v1.22.190.150 [1/4] Resolving packages...0.176 [2/4] Fetching packages...3.678 error mongoose@8.1.0: The engine "node" is incompatible with this module. Expected version ">=16.20.1". Got "14.21.3"3.678 error Found incompatible module.3.678 info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.------failed to solve: process "/bin/sh -c yarn install" did not complete successfully: exit code: 1위와 같이 오류가 떠요. node버전이 mongoose버전과 맞지 않다고 하는데 기존 node를 삭제하고 오류에서 말한 16.20.1버전으로 새로 설치해야하는 건가요? 재 설치하면 기존에 학습했던 코드들에 영향을 받진 않나요?

실무에서는 컨트롤러 없이 라우터 만으로 프로잭트를 진행하는 경우가 많나요?

오류가 뜨지 않고 무한루프에 걸려 있는데 , admin 을 post 로 호출하는 페이지 뿐만 아니라 모든 페이지가 로딩 자체가 안되는데 혹시 무슨 문제가 있는걸까요app. js 에서 아래 코드를 주석 처리하면 다른 페이지도 바로 로딩이 됩니다.app.use(cookieParser); 

안녕하세요! 제가 설치도구들을 다운 받고 강의를 이어 듣는데, 제 플레이터와 선생님이 보여주신 초기 화면이 달라서 어느 부분이 잘못되었는지 확인 받고 싶습니다!