Concurrency Reduce와 Strict Reduce의 동작 차이 정리_.reduce 와 C.reduce의 차이는 [...iter]로 제너레이터를 한번에 돌려 프로미스들을 동시에 평가 ( 프로미스의 평가 == 프로미스 객체 반환, 콜백함수 즉시실행 ) 하는데에 있다. _.reduce만약 [... ]형태로 전개하지 않는다면 reduce의 while문에서 next()를 하여 yield 로 반환하는 값을 하나씩 빼 올 것이고,이 과정에서 프로미스는 뽑힌다면 (=평가된다면) 뽑히는 과정에서 비로소 콜백을 실행 할 것이다. 그러나 전개하지 않은 상태에서는 이런 뽑히는 과정이 순차적이므로, '프로미스를 뽑아서 콜백을 실행 시켜준 후, reduce 자체를 return 하여 콜백이 완료될 때 까지 기다리고 다시 recur 재귀함수를 통해 이어서 진행하는 과정' 을 프로미스가 뽑힐 때마다 해주어야 하는 것이다.C.Reduce반면에 [...] 형태로 전개하여 사용하면, yield로 반환될 모든 값이 배열에 담긴다. 이 과정에서 뽑힌 프로미스는 콜백이 바로 실행될 것이고, 만약 제너레이터에 여러 프로미스들이 존재한다면 제너레이터의 next()가 연속적으로 동작함에 따라 콜백도 주르륵 병렬되게 실행 될 것이다.이런 프로미스를 포함한 배열을 받은 reduce는 then()을 통해서 reduce를 종료하고 프로미스를 반환한다. 콜백이 완료되면 then(recur)에 의해 재 실행된다. 여러 프로미스들이 거의 동시에 자신의 콜백을 실행시켰기 때문에, reduce 입장에서는 전체 시간이 가장 오래걸리는 놈 만큼만 소요다는 것이다. 마치 Promise.all() 이 동작하는것 처럼 말이다

.

안녕하세요 !! 다름이 아니라 현재 제가 일반 브라우저가 아닌 C#기반으로 돌아가는 웹을 작업중인데요input 태그에 한글 작성시 '마지막 글자 밀림'오류와 '문자열 마무리'오류가 발생되어 혹시 해결 방법을 아시는 분이 있을까 하여 글 남깁니다..! 제발 도와주세요 감사합니다 !

강의부분에const weatherDataActive = function({location, weather}){ const locationNameTag = document.querySelector('#location-name-tag'); locationNameTag.textContent = location; console.log(weather); document.body.style.backgroundImage = `url('./images/${weather}.jpg')` };이 부분을 제가 똑같이 따라했는데요 노션에 있는 사진 자료 그대로 다운받았고선생님이 말씀하신 경로에 똑같이 담았는데document.body.style.backgroundImage = `url('./images/${weather}.jpg')`이걸 치니까 직전에 선생님이랑 같이 적용했던 css 백그라운드 이미지(햇빛)도 안나오고 404오류가 떠요ㅠㅠ왜일까요?

마지막 Array(9).fill(0).map 을 return 하셨을때,야구게임에 적용하려면 number 에 담으면 되는게 맞나요?const numbers = []; Array(9).fill(0).map((element, idx) => { return numbers.push(idx + 1); })이런식으로 number 배열에 넘겨주면 되는게 맞나요?작동은 되는것 같은데, 이런식으로 하면 되는건지 알수 있을까 해 질문드립니다! 

디데이 강의를 보고 있는데요.저는 아래와 같이 점표기법으로 짜봤는데 안되더라구여?  for(let i = 0; i < timeKeys.length; i++){ console.log(documentObj.docKeys[i]); }그래서 찾아보니 []표기법을 쓰라고해서  for(let i = 0; i < timeKeys.length; i++){ console.log(documentObj[docKeys[i]]); }이렇게 써서 작동이 됐긴 하는데 왜 여기서점 표기법은 안되고 []표기법만 되는 이유를 알고 싶습니다.

 안녕하세요. 마지막 강의까지 잘 듣고 있습니다.강의 중 조건문에서 savedWeatherData 사용하셨는데, 그 전에 변수로 선언해준적이 없어서 에러가 나고 있어요어디부분에 선언을 하면 되는건지 궁금합니다.

안녕하세요. 11분 15초 쯤부터 Javascript의 람다식을 사용하면 된다고 말씀해주셨습니다. $(document).ready(function() { $("#regBtn").click(()=> { location.href="<c:out value='/register.do'/>"; }); });이클립스에서 ES6 문법 사용이 가능한가요???람다식은 ES6부터 나온 기능으로 알고 있습니다. 이와 같은 버전에 나온 백틱(`)을 사용하려고 했는데, 이클립스에서 에러 표시를 내서 사용을 안 하고 있었습니다.19년 3월 버전의 이클립스 환경에서 보면, Legacy 프로젝트를 생성했는데 ECMA 3 Browser Support Library라고 되어있길래 ES6은 지원이 안 되나 싶었습니다.(다시 보니 ECMA Script가 아니라 ECMA 3 Browser네요 ㅎㅎ; 제가 잘못 예측한 것일 수도 있겠네요)이클립스에서 ES6 버전의 JS를 쓰면 Ajax 결과로 나오는 흔한 JSON 데이터를 편하게 불러올 수 있을텐데 말이죠 ㅠㅠ항상 친절한 답변 감사합니다. 강의 잘 보고 있습니다.

안녕하세요채팅을 구현하기위해 socket.io를 썼는데 통신이 안되는 것같습니다 io에 주소를 제대로 넣었고 서버 on 마다 클라이언트에서 emit으로 작성했는데 작동하지 않습니다 이유가 무엇일까요? // server 파일의 코드입니다 require('dotenv').config(); const { createApp } = require('./app'); const { appDataSource } = require('./models/index'); const startServer = async () => { const app = createApp(); const PORT = process.env.PORT; await appDataSource .initialize() .then(() => { const server = app.listen(PORT, () => { console.log(`🟢server is listening on ${PORT}🟢`); }); const io = require('socket.io')(server, { cors: { origin: true, credentials: true, }, }); const { socketMessage } = require('./middlewares/socket.io'); socketMessage(io); }) .catch((err) => { console.log(`❌Failed server connect❌`); appDataSource.destroy(); }); }; startServer(); // server의 socket 파일의 코드입니다 const jwt = require('jsonwebtoken'); const chatDao = require('../models/chatDao'); const { catchAsync } = require('../utils/error'); const socketMessage = (io) => { io.use((socket, next) => { const token = socket.handshake.headers.authorization; if (!token) { return next(new Error('Authentication error')); } jwt.verify(token, process.env.SECRET_KEY, async (err, decoded) => { if (err) { return next(new Error('Authentication error')); } userId = decoded.userId; next(); }); }); io.on('connection', (socket) => { console.log('A User Connected.'); socket.on( 'create_room', catchAsync(async (postId, callback) => { const room = await chatDao.createRoom(userId, postId); socket.join(room.raw.insertId); callback(room.raw.insertId); }) ); socket.on( 'enter_room', catchAsync(async (roomId, callback) => { socket.join(roomId); callback(roomId); }) ); socket.on('new_text', async (content, roomId, callback) => { await chatDao.createChat(userId, content, roomId); socket.to(roomId).emit('new_text', content); callback(content); }); socket.on('disconnect', () => { console.log('접속이 해제되었습니다', socket.id); clearInterval(socket.interval); }); socket.on('error', (error) => { console.error(error); }); ​ socket.on('send', (data) => { console.log(data); socket.emit('reply', { data, }); }); socket.interval = setInterval(() => { socket.emit('news', 'Hello Socket.IO'); }, process.env.SOCKET_INTERVAL || 1000); }); }; module.exports = { socketMessage }; ​  // client 코드입니다import React, { useState, useContext } from 'react'; import io from 'socket.io-client'; import './chat.css'; import { MenuContext } from '../../components/Nav/MenuProvider'; const Token = localStorage.getItem('accessToken'); const socket = io.connect('http://192.168.0.194:4000', { withCredentials: true, extraHeaders: {Authorization: `Bearer ${Token}` } appDataSource.destroy(); }), }); socket.on('connection', () => { console.log('Connected to server'); }); const Chat = () => { const [roomId, setRoomId] = useState([]); const [searchData, setSearchData] = useContext(MenuContext); const handleCreateRoom = event => { event.preventDefault(); socket.emit('create_room', searchData, ({ searchData, roomId }) => { console.log(`Joined room ${roomId}`); setRoomId(roomId); }); }; const handleJoinRoom = roomId => { socket.emit('enter_room', roomId, roomId => { console.log(`Joined room ${roomId}`); setRoomId(roomId); }); }; const handleNewText = content => { socket.emit('new_text', content, roomId, content => { console.log(`Sent message: ${content}`); }); }; const handleNewText = content => { socket.emit('new_text', content, roomId, content => { console.log(`Sent message: ${content}`); }); }; const onCheckEnter = e => {if (e.key === 'Enter') { handleNewText(); } }; return ( <div className="h-screen pt-36"> <button onClick={handleCreateRoom}>테스트</button> <button onClick={() => handleJoinRoom(roomId)}>테스트2</button> <input id="input-text" type="text" onKeyDown={onCheckEnter} /> <button onClick={handleCreateRoom}>제출</button> </div> ); }; export default Chat;

 안녕하세요! 강의 정말 잘보고있습니다!!프리캠프 섹션5 | Javascript 응용과 싸이월드 실습 4탄 복습 학습자료 상에서 질문이 있어서 여쭤봅니다. else if에서 조건에 만족하는 경우 alert가 뜨게끔 되어 있는 것 같아서,여기 부분에서 else if~ 부분을 아래와 같이 바꿔야하는 것이 아닌지 검토 부탁드릴게요.} else if(8>password.length || password.length>16){ alert("8~16자의 영문, 숫자, 특수문자만 사용 가능합니다.") return false

여기서 와일문을 돌리면 점점 큰 범위로 menu-btn이라는 클래스가 있는지 찾아가는 게 되는건가요?예를 들어 버튼안에 버튼, 그안에 버튼이렇게 있다면 내가 제일 안쪽에 있는 버튼을 클릭했을 때에, 제일 안쪽의 버튼, 중간버튼, 제일 겉에 있는 버튼 이런 순서로 찾아가게 되는 건지가 궁금합니다 영상 너무 잘보고 있습니다 ㅠ 좋은 강의 감사해요!!

html에 상단에 일시정지 새로고침 아이콘들 나오게 하는것은 어떻게 하나요??

 원하는 키워드의 값을 담은 상수를 console.log(key,value) 하면 줄바꿈되면서 안에 있는 전체 값들이 나오더라구요  ( const key = $(el).attr("property").split(":")[1]; const value = $(el).attr("content"); 부분입니다)근데 이 값들을 db에 저장하려 for문을 이용해 배열에 넣어봤더니 console.log(key,value)해서 나온 값들이 아닌 마지막 값만 들어갑니다 key와 value에 어떤 형태로 값이 스크랩핑되어 들어가있는건가요..?상수에 배열형태로 들어간 것도 아니고 한줄로 값이 들어간 것도 아니고 .. console.log하면 전체가 나오기는 하나줄바꿈이 되어 나와서 갈피를 못잡겠습니다..스크래핑한 값을 어떻게 저장을하고 넘겨야할지 db로 넘겨야할지 전혀 모르겠습니다................................. 이틀동안 찾아봐도 해결이 안되어서 질문 남깁니다..

윈터로드님 알려주신 덕분에 완강할수잇었습니다ㅠㅠ 인프런 강의 첫 수강완료증을 받앗네요제 프로젝트에 큰오류를 발견했습니다,,,, 새일기쓰면 똑같은게 2개가 만들어지는데 이거 어디서 오류를 수정해야 하는지알수잇을까요?

tfjs-node 안깔려서 해보라고 하는거 해보다가잘 되던 nodemon server.js 도 안되고 뭐가 잘못됐는지 모르겠습니다.빨리 마무리하고 싶은데 답답하네요강의 업데이트 좀 해주셨으면 좋겠는데 생각 없으신가요 

안녕하세요 혹시 코드파일은 지원안하시는건가요?,,

 삽입시 address 값을 입력했는데도 default 값이 설정되어있지 않다고 에러가 뜹니다.

flyctl deploy가 진행이 안돼서제 컴퓨터에 있는 도커를 삭제하고 다시 실행했더니아래와 같은 상태에서 멈췄습니다.구글링 해봐도 잘 모르겠어요 ㅠㅠ어떻게 해결하면 될까요?   C:\Users\dahye\Documents\react-project\d-market-server>flyctl deploy ==> Verifying app config--> Verified app config==> Building imageRemote builder fly-builder-quiet-sunset-984 ready==> Building image with Buildpacks--> docker host: 20.10.12 linux x86_6420: Pulling from heroku/buildpacksDigest: sha256:1dd1a9c5f291b47fed1aed3f4c348fdc878380319c15f0e09753a5898482554eStatus: Image is up to date for heroku/buildpacks:2020-cnb: Pulling from heroku/herokuDigest: sha256:c9d053a463c7cd81672a3b0d5d5e26bdcbdffe2782565ccbedc15867b8cddfb9Status: Image is up to date for heroku/heroku:20-cnbWarning: Platform requested deprecated API '0.6'===> DETECTINGWarning: Buildpack 'heroku/ruby@0.0.0' requests deprecated API '0.4'Warning: Buildpack 'heroku/python@0.0.0' requests deprecated API '0.4'Warning: Buildpack 'heroku/scala@0.0.0' requests deprecated API '0.4'Warning: Buildpack 'heroku/php@0.0.0' requests deprecated API '0.4'Warning: Buildpack 'heroku/go@0.0.0' requests deprecated API '0.4'Warning: Buildpack 'heroku/gradle@0.0.0' requests deprecated API '0.4'2 of 3 buildpacks participatingheroku/nodejs-engine 0.8.16heroku/nodejs-npm 0.5.2===> ANALYZINGPrevious image with name "registry.fly.io/d-market-server:cache" not found===> RESTORING===> BUILDING[Heroku Node.js Engine Buildpack][Checking Node.js version]Detected Node.js version range: *Resolved Node.js version: 19.7.0[Installing Node.js distribution]Downloading Node.js 19.7.0Extracting Node.js 19.7.0Installing Node.js 19.7.0[INFO] Installing toolbox[INFO] - yj[INFO] Using npm v9.5.0 from Node[INFO] Installing node modules from ./package-lock.jsonnpm WARN config production Use --omit=dev instead.WARN failed to finish build in graphql: Post "https://api.fly.io/graphql": context canceledOops, something went wrong! Could you try that again?

DiaryStateContext.provider 2중으로 넣는 부분 질문드립니다 .<DiaryStateContext.provider value={data} > 만 써야 되는 이유로 onCreate,onEdit,onRemove 등은 data의 상태가 변경될떄(c,u,d) 마다 리렌더링이 생겨서 최적화가 풀린다고 하셨는데 상태가 변경된다는 말이 onCreate 할떄 data에 실제 생성 ,변경, 삭제 되는 그 로직으로 인한 배열데이터가 변경된다는 말인건가요 ? 그리고. context가 App.js로 부터 data만 받을떄 어차피 onCreate,onEdit,onRemove 함수호출당시에도 data가 변경되고 setData로 변경이 된후에는 어쩃든 data가 추가든 삭제든 수정이든 변경이 될텐데 그러면 app 컴포넌트에서 바뀐 data로 DiaryStateContext 로 데이터를 다시 내려 줄꺼고 그러면 그 하위에 있던 컴포넌트 들은 다시 리렌더링 되지 않을까요 ?  

typescript 기초 강의에서 nest를 처음 실행했는데 실행 시 너무 오래 걸립니다..(약 20~30분 정도) windows os에서 실행 햇는데 이유가 있을까요?현재 컴퓨터 사양은 Memory 32G 에 RAM 16 Core 입니다.매번 이렇게 시간이 걸리면 현실적으로 test가 불가능해서 방법을 구하고자 합니다. +추가yarn으로 실행해봐도 비슷하네요..Windows OS에서 WSL 통해서 Ubuntu 환경에서 실행하고 있습니다.