asp.net core 웹/앱, SignalR 강의 모두 들었는데. 한가지 아쉬운 점이 있습니다.학습시 서버를 local로 열거나 현재 컴퓨터 ip로 서버를 여는데 혹시 Azure나 Aws등으로 서버를 세팅하는 강의도 추가를 해주실 수 있으신가요?동영상이 아니라도 ppt 등 있었으면 좋겠습니다.

리액트랑 부트 연결하는 방법 axios까지 코드입력했는데 cmd라던지 연동하는 방법은 안알려주시나요?

builder.WebHost.UseUrls("http://0.0.0.0:8080");로 하는 경우 서버가 열리지 않아요.localhost로 했을 때는 정상적으로 동작이 되었어요...

npx create-react-app mall 명령어 입력시 해당 오류가 발생합니다. log의 내용은 다음과 같습니다.0 verbose cli C:\Program Files\nodejs\node.exe C:\Users\USER\AppData\Roaming\nvm\v10.16.3\node_modules\npm\bin\npm-cli.js1 info using npm@10.7.02 info using node@v20.15.03 silly config:load:file:C:\Users\USER\AppData\Roaming\nvm\v10.16.3\node_modules\npm\npmrc4 silly config:load:file:C:\Users\USER\reactAPI_workSpace\.npmrc5 silly config:load:file:C:\Users\USER\.npmrc6 silly config:load:file:C:\Users\USER\AppData\Roaming\npm\etc\npmrc7 verbose title npm exec create-react-app mall8 verbose argv "exec" "--" "create-react-app" "mall"9 verbose logfile logs-max:10 dir:C:\Users\USER\AppData\Local\npm-cache\_logs\2024-07-01T07_49_17_781Z-10 verbose logfile C:\Users\USER\AppData\Local\npm-cache\_logs\2024-07-01T07_49_17_781Z-debug-0.log11 verbose stack TypeError: LRUCache is not a constructor11 verbose stack at Object.<anonymous> (C:\Users\USER\AppData\Roaming\nvm\v10.16.3\node_modules\npm\node_modules\cacache\lib\memoization.js:5:18)11 verbose stack at Module._compile (node:internal/modules/cjs/loader:1358:14)11 verbose stack at Module._extensions..js (node:internal/modules/cjs/loader:1416:10)11 verbose stack at Module.load (node:internal/modules/cjs/loader:1208:32)11 verbose stack at Module._load (node:internal/modules/cjs/loader:1024:12)11 verbose stack at Module.require (node:internal/modules/cjs/loader:1233:19)11 verbose stack at require (node:internal/modules/helpers:179:18)11 verbose stack at Object.<anonymous> (C:\Users\USER\AppData\Roaming\nvm\v10.16.3\node_modules\npm\node_modules\cacache\lib\get.js:8:14)11 verbose stack at Module._compile (node:internal/modules/cjs/loader:1358:14)11 verbose stack at Module._extensions..js (node:internal/modules/cjs/loader:1416:10)12 verbose cwd C:\Users\USER\reactAPI_workSpace13 verbose Windows_NT 10.0.1904514 verbose node v20.15.015 verbose npm v10.7.016 error LRUCache is not a constructor17 verbose exit 118 verbose code 119 error A complete log of this run can be found in: C:\Users\USER\AppData\Local\npm-cache\_logs\2024-07-01T07_49_17_781Z-debug-0.lognode 와 npm 버전은 이렇게 깔려있습니다. 재설치 해도 여전히 오류가 발생합니다 ㅜㅠ 어떻게 해결해야 할까요?

안녕하세요 강의 잘 듣고있습니다.class 에는 setter 와 getter 를 생성하지 않고data class 에는 var 로 받을경우 setter 와 getter 가 생성되면 이외의 다른 메서들도 자동으로 생성이 된다고 하셨습니다.그러면 class 는 더이상 사용하지 않나요 ?

저는 책이 없이 강의만을 통해 학습중입니다. 강의 중간중간 코드를 복사해서 오시더라구요 ~ js같은 경우는 따라치는것에 대해 어려운 부분이 있는데 혹시 어쩔 수 없는 부분인 걸까요 ?

안녕하세요 강사님, 좋은 강의 잘 듣고 있습니다.따라하던 중 토큰을 잘못 입력했을 경우 403 Forbidden 에러가 발생하는데 이 에러의 경우는 RestControllerAdvice 에서 처리를 할 수 없는건가요??이 경우에도 Response형태를 통일 시키고 싶은데 어떻게 하면 될까요..?

제목 그대로 tno값은 어떻게 초기화 시키나요? testDelete 함수를 이용해서 삭제후 다시 testInsert 함수를 이용해서 1 ~ 100까지 만들고 싶은데, tno값은 1부터 시작하는게 아닌, 기존의 tno값부터 1씩 증가됩니다.

안녕하세요 Section2-5 강의 "Querydsl설정하기" 강의에서는 분명repository 폴더 안에 search 폴더가 있었는데 강의를 듣다보니 강사님 화면에서는 search 폴더가 어느새 사라져있습니다.. 강의화면만 보고 어디있는지 알수가 없어서요ㅠ 어느 폴더로 이동해갔는지 알려주시면 감사하겠습니다. 그리고 강사님 화면을 보다가 발견했는데 config 폴더 아래에 RootConfig 파일이 새로 생겨있고,깃 파일을 확인해보니 modelMapper를 사용하여 DTO 와 entity를 변환해주고 있는데,앞에 강의에서 제가 듣기론 funciton을 이용해서 변환해주고RootConfig 파일을 따로 만든 기억이 없습니다ㅠ교육 뒷 부분에 새로 생기는 건가요?

안녕하세요  SpringSecurity를 이용해서 유저 , 관리자 로그인의 대한 로직을 따로 두고싶습니다.SecurityFilter내에서 유저 로그인 URL과 로직을 관리자 로그인 URL과 로직을 어떻게 나눌 수 있을까욤 ㅠㅠ?

안녕하세요멋진 강의 잘 듣고 있습니다. Todo에서 ReadComponent.js 안에서 read 할때 const makeDiv = () => () 와 같이 Arrow Function을 사용해서 간단하게 표현해주셨는데요, 수정할때도 간단하게 사용해보고 싶어서Product의 ModifyComponent.js 에서 아래와 같이 만들어 사용해봤습니다.{makeDiv("name", product.pname, "text", handleChangeProduct)} {makeDiv("description", product.pdesc, "text", handleChangeProduct)} {makeDiv("price", product.price, "number", handleChangeProduct)}const makeDiv = (title, value, type, handleChangeProduct) => ( <div className="flex justify-center"> <div className="relative mb-4 flex w-full flex-wrap items-stretch"> <div className="w-1/5 p-6 text-right font-bold">{title}</div> <input className="w-4/5 p-6 rounded-r border border-solid border-neutral-300 shadow-md" name={title} type={type} value={value} onChange={handleChangeProduct} ></input> </div> </div> );만들어보니까,price(넘버)는 수정이 되는데,pname과 pdesc는 수정이 안되더라구요, readOnly가 먹혀있었습니다.text와 number가 다른걸까요...수정이 안되는 이유가 뭔지 궁금합니다ㅠ 추가로, const makeDiv 는 return 아래에 추가를 해주셨는데,return 위에가 아니라 return 아래에 추가한 이유도 궁금합니다. 확인 부탁드립니다.감사합니다.   

button onClick () => moveToList()호출 시 파라미터가 없기 때문에if 절 타지 않고(undefined)else로 빠지는데, 동작이 잘 되는 이유는moveToList() 함수 밖에서 선언한const queryDefault = createSearchParams({ page, size }).toString();덕분에 동작이 잘 되는것입니다. 

수업을 듣다가 궁금한 점이 생겨 문의 드립니다. 현재 React를 사용하여 API 서버와 작업할 때는 JWT 토큰을 자주 사용하는데, 타임리프(Thymeleaf)와 같은 서버 사이드 렌더링을 사용할 때도 JWT 토큰을 사용해도 되는지, 혹은 사용하면 안 되는지 궁금합니다!

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. github에 올려주신 version2, 3 둘 다 빨간줄뜨고 6.1 이후로 deprecated 되었다고 나오는데설정 어떻게 해야 할까요? ㅜㅜ 스프링부트 시큐리티2강 - 시큐리티 설정 듣고있습니다.

지난 강의에서 LIST, ADD 클릭 할때와 const handleClickList = useCallback(() => { navigate({ pathname: 'list' }); }, []); const handleClickAdd = useCallback(() => { navigate({ pathname: 'add' }); }, []);지금 강의에서 moveToModify 클릭할 때 const moveToModify = () => { navigate({ pathname: `/todo/modify/${tno}`, search: queryStr }); };useCallback() 사용 여부 차이가동적으로 변할 여지가 있는 함수를 새로 호출하는게 맞아서 그런걸까요?(=${tno}의 변경 가능성?)props로 써야할 것과 router로 써야할 것을 구분하라고 하셨습니다. 혹시 이것과 관련된 말씀이셨나요?검색해도 명쾌히 이해가 가지 않습니다!!  

혹시 unity에서는 signalR을 사용 할 수 있는 방법이 있을까요?unity에 maui를 붙이는 건 힘들 거 같습니다. 

실시간 채팅방 강좌 코드를 작성하여 작동 시켜 본 결과 메시지 전송 까지는 잘 되는 것을 확인 하였는데 GIF 업로드 시 다음 그림과 같은 현상이 발생하고 있습니다그림 하단에 표시한 부분 처럼 처음에 GIF 올리기를 하면 그림이 보이지 않다가 새로 고침을 하면 위의 다른 GIF 처럼 잘 보이긴 하는데 무슨 문제 일까요?참고로 관련 코드를 같이 올립니다chat.html {% extends 'layout.html' %} {% block content %} <h1>{{title}}</h1> <a href="/" id="exit-btn">방 나가기</a> <fieldset> <legend>채팅 내용</legend> <div id="chat-list"> {% for chat in chats %} {% if chat.user === user %} <div class="mine" style="color: {{chat.user}}"> <div>{{chat.user}}</div> {% if chat.gif %}} <img src="/gif/{{chat.gif}}"> {% else %} <div>{{chat.chat}}</div> {% endif %} </div> {% elif chat.user === 'system' %} <div class="system"> <div>{{chat.chat}}</div> </div> {% else %} <div class="other" style="color: {{chat.user}}"> <div>{{chat.user}}</div> {% if chat.gif %} <img src="/gif/{{chat.gif}}"> {% else %} <div>{{chat.chat}}</div> {% endif %} </div> {% endif %} {% endfor %} </div> </fieldset> <form action="/chat" id="chat-form" method="post" enctype="multipart/form-data"> <label for="gif">GIF 올리기</label> <input type="file" id="gif" name="gif" accept="image/gif"> <input type="text" id="chat" name="chat"> <button type="submit">전송</button> </form> <script src="https://unpkg.com/axios/dist/axios.min.js"></script> <script src="/socket.io/socket.io.js"></script> <script> const socket = io.connect('http://localhost:8005/chat', { path: '/socket.io', }); socket.emit('join', new URL(location).pathname.split('/').at(-1)); socket.on('join', function (data) { const div = document.createElement('div'); div.classList.add('system'); const chat = document.createElement('div'); div.textContent = data.chat; div.appendChild(chat); document.querySelector('#chat-list').appendChild(div); }); socket.on('exit', function (data) { const div = document.createElement('div'); div.classList.add('system'); const chat = document.createElement('div'); div.textContent = data.chat; div.appendChild(chat); document.querySelector('#chat-list').appendChild(div); }); socket.on('chat', function (data) { const div = document.createElement('div'); if (data.user === '{{user}}') { div.classList.add('mine'); } else { div.classList.add('other'); } const name = document.createElement('div'); name.textContent = data.user; div.appendChild(name); if (data.chat){ const chat = document.createElement('div'); chat.textContent = data.chat; div.appendChild(chat); } else { const gif = document.createElement('img'); gif.sr = '/gif/' + data.gif; div.appendChild(gif); } div.style.color = data.user; document.querySelector('#chat-list').appendChild(div); }); document.querySelector('#chat-form').addEventListener('submit', function (e) { e.preventDefault(); if (e.target.chat.value) { axios.post('/room/{{room._id}}/chat', { chat: this.chat.value, }) .then( () => { e.target.chat.value = ''; }) .catch( (err) => { console.error(err); }); } }); document.querySelector('#gif').addEventListener('change', function (e) { console.log('******',e.target.files); const formData = new FormData(); formData.append('gif', e.target.files[0]); axios.post('/room/{{room._id}}/gif', formData) .then( () => { e.target.file = null; }) .catch( (err) => { console.error(err); }); }); </script> {% endblock %} routes/index.jsconst express = require('express'); const { renderMain, renderRoom, createRoom, enterRoom, removeRoom, sendChat, sendGif } = require('../controllers'); const multer = require('multer'); const fs = require('fs'); const path = require('path'); const router = express.Router(); router.get('/', renderMain); router.get('/room', renderRoom); router.post('/room', createRoom); router.get('/room/:id', enterRoom); router.delete('/room/:id', removeRoom); router.post('/room/:id/chat', sendChat); try {fs.readdirSync('uploads'); } catch (err) { console.error('uploads 폴더가 없어 uploads 폴더를 생성합니다.'); fs.mkdirSync('uploads'); } const upload = multer({ storage: multer.diskStorage({ destination(req, file, done) { done(null, 'uploads/'); }, filename(req, file, done ) { const ext = path.extname(file.originalname); done(null, path.basename(file.originalname, ext) + Date.now() + ext); }, }), limits: {fileSize: 5 * 1024 *1024 }, }) router.post('/room/:id/gif', upload.single('gif'), sendGif); module.exports = router;controllers/index.jsconst Room = require('../schemas/room'); const Chat = require('../schemas/chat'); const { removeRoom: removeRoomService } = require('../services'); exports.renderMain = async ( req, res, next ) => { try{ const rooms = await Room.find({}); res.render('main', {rooms, title: 'GIF 채팅방'}); } catch (error) { console.error(error); next(error); } }; exports.renderRoom = ( req, res, next ) => { res.render('room', { title: 'GIF 채팅방 생성'}); }; exports.createRoom = async ( req, res, next ) => { try{ const newRoom = await Room.create({ title: req.body.title, max: req.body.max, owner: req.session.color, password: req.body.password, //session data 에서 옮 }); const io = req.app.get('io'); io.of('/room').emit('newRoom', newRoom); // 방에 들어가는 부분 if (req.body.password ) { res.redirect(`/room/${newRoom._id}?password=${req.body.password}`); } else { res.redirect(`/room/${newRoom._id}`); } } catch (error) { console.error(error); next(error); } }; exports.enterRoom = async( req, res, next ) => { try{ const room = await Room.findOne({_id: req.params.id}); if (!room){ return res.redirect('/?error=존재하지 않는 방입니다.'); } if (room.password && room.password !== req.query.password ){ return res.redirect('/?error=비밀번호가 틀렸습니다.'); } const io = req.app.get('io'); const { rooms } = io.of('/chat').adapter; if (room.max <= rooms.get(req.params.id)?.size) { return res.redirect('/?error=허용 인원을 초과하였습니다.'); } const chats = await Chat.find({room: room._id }).sort('createdAt'); res.render('chat', { title: 'GIF 채팅방 생성', chats , room, user: req.session.color }); } catch (error) { console.error(error); next(error); } }; exports.removeRoom = async ( req, res, next ) => { try { await removeRoomService(req.params.id ); res.send('ok'); setTimeout(() => { req.app.get('io').of('/room').emit('removeRoom', req.params.id); }, 2000) } catch (error) { console.error(error); next(error); } }; exports.sendChat = async (req, res, next ) =>{ try { const chat = await Chat.create({ room: req.params.id, user: req.session.color, chat: req.body.chat, }); req.app.get('io').of('/chat').to(req.params.id).emit('chat', chat); res.send('ok'); } catch( error ){ console.error(error); next(error); } } exports.sendGif = async (req, res, next ) => { try { const chat = await Chat.create({ room : req.params.id, user: req.session.color, gif: req.file.filename, }) setTimeout(() => { req.app.get('io').of('/chat').to(req.params.id).emit('chat',chat); }, 1000); res.send('ok'); } catch (error) { console.error(error); next(error); } } [제로초 강좌 질문 필독 사항입니다]질문에는 여러분에게 도움이 되는 질문과 도움이 되지 않는 질문이 있습니다.도움이 되는 질문을 하는 방법을 알려드립니다.https://www.youtube.com/watch?v=PUKOWrOuC0c0. 숫자 0부터 시작한 이유는 1보다 더 중요한 것이기 때문입니다. 에러가 났을 때 해결을 하는 게 중요한 게 아닙니다. 왜 여러분은 해결을 못 하고 저는 해결을 하는지, 어디서 힌트를 얻은 것이고 어떻게 해결한 건지 그걸 알아가셔야 합니다. 그렇지 못한 질문은 무의미한 질문입니다.1. 에러 메시지를 올리기 전에 반드시 스스로 번역을 해야 합니다. 번역기 요즘 잘 되어 있습니다. 에러 메시지가 에러 해결 단서의 90%를 차지합니다. 한글로 번역만 해도 대부분 풀립니다. 그냥 에러메시지를 올리고(심지어 안 올리는 분도 있습니다. 저는 독심술사가 아닙니다) 해결해달라고 하시면 아무런 도움이 안 됩니다.2. 에러 메시지를 잘라서 올리지 않아야 합니다. 입문자일수록 에러메시지에서 어떤 부분이 가장 중요한 부분인지 모르실 겁니다. 그러니 통째로 올리셔야 합니다.3. 코드도 같이 올려주세요. 다만 코드 전체를 다 올리거나, 깃헙 주소만 띡 던지지는 마세요. 여러분이 "가장" 의심스럽다고 생각하는 코드를 올려주세요.4. 이 강좌를 바탕으로 여러분이 응용을 해보다가 막히는 부분, 여러 개의 선택지 중에서 조언이 필요한 부분, 제 경험이 궁금한 부분에 대한 질문은 대환영입니다. 다만 여러분의 회사 일은 질문하지 마세요.5. 강좌 하나 끝날 때마다 남의 질문들을 읽어보세요. 여러분이 곧 만나게 될 에러들입니다.6. 위에 적은 내용을 명심하지 않으시면 백날 강좌를 봐도(제 강좌가 아니더라도) 실력이 늘지 않고 그냥 코딩쇼 관람 및 한컴타자연습을 한 셈이 될 겁니다.

spring 3.3.0, java 17에 적용 중인데 deprecated된 것들 거의다 고쳐놨고거의다 왔는데 아주 아쉽게 막바지에서 안되고 있어요 ㅎㅎ 전체 코드만 볼 수 있으면 바로 해결 할 수 있을 것 같아서요 전체 소스코드를 볼수 있는지 확인 부탁드립니다.

configuration.setAllowedHeaders(Arrays.asList("Authorization", "Cache-Control", "Content-Type"));이걸 어디에 추가해야 하는지 알 수 있을까요??if(path.startsWith("/api/member/")) { return true; } if(path.startsWith("/api/todo/")) { return true; }이건 이렇게 입력했지만 저 부분이 어딘지 몰라서 작동이 안되네요 ㅠㅠ

before request.............jwtUtil.js:34 -----------------------------eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzb2NpYWwiOmZhbHNlLCJwdyI6IiQyYSQxMCRWQ1dGY0ZhWC9aTzF2TGhpU0VpY3NlY0hGWmdIV2dZV0RNa0JMRmlCZk5yYTQvVVgvMERORyIsIm5pY2tuYW1lIjoiVXNlcjUiLCJyb2xlTmFtZXMiOlsiVVNFUiIsIk1BTkFHRVIiXSwiZW1haWwiOiJ1c2VyNUBhYWEuY29tIiwiaWF0IjoxNzE2OTc2NTc5LCJleHAiOjE3MTY5NzcxNzl9.r_619xyQq9zGhf5YG4-Sprtiz4W9rNNhf5ml4XyAQ3M:3000/todo/list:1 Access to XMLHttpRequest at 'http://localhost:8080/api/todo/list?page=1&size=10' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.jwtUtil.js:56 response fail error.............:3000/todo/list:1 Uncaught (in promise)AxiosError {message: 'Network Error', name: 'AxiosError', code: 'ERR_NETWORK', config: {…}, request: XMLHttpRequest, …}code: "ERR_NETWORK"config: {transitional: {…}, adapter: Array(2), transformRequest: Array(1), transformResponse: Array(1), timeout: 0, …}message: "Network Error"name: "AxiosError"request: XMLHttpRequest {onreadystatechange: null, readyState: 4, timeout: 0, withCredentials: false, upload: XMLHttpRequestUpload, …}stack: "AxiosError: Network Error\n at XMLHttpRequest.handleError (http://localhost:3000/static/js/bundle.js:54389:14)\n at Axios.request (http://localhost:3000/static/js/bundle.js:54841:41)\n at async getList (http://localhost:3000/static/js/bundle.js:184:15)"[[Prototype]]: ErrorPromise.then(비동기)(익명)@ListComponent.js:29프레임 11개 더 표시 jwtUtil.js를 강의에서 알려주신대로 틀린거 없이 따라하고 todoApi.js에 Axios에서 jwtAxios로 변경하고 로그인 하고 todo를 클릭했는데 위에 메세지 처럼 에러가 발생합니다 그래서 오류메세지를 검색해 보니 이 에러는 CORS(Cross-Origin Resource Sharing) 정책 위반 이 에러는 주로 프론트엔드 애플리케이션(React 등)이 백엔드 API에 요청을 보낼 때 발생한다고 하는데요 어떻게 해야할지 모르겠습니다 ㅠㅠ