묻고 답해요
161만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결처음 만난 리액트(React)
chapter_04 시계만들기
시간 부분이 안뜨네요.. Clock.jsximport React from "react"; function Clock(props){ return( <div> <h1>안녕, 리액트!</h1> <h2>현재 시간 : {new Date().toLocaleDateString()}</h2> </div> ); } export default Clock; index.jsimport React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; import Clock from './chapter_04/Clock'; const root = ReactDOM.createRoot(document.getElementById('root')); setInterval(() => { root.render( <React.StrictMode> <Clock /> </React.StrictMode> ); },1000); reportWebVitals();
-
해결됨[JS] Phaser 게임 제작 - 뱀파이어 서바이벌 클론
[참고] 33강 캣닢어택 강화시 버그 관련
재현경로게임 시작레벨 4 도달캣닢 범위 강화몬스터 타격현재결과캣닢 범위는 넓어지나 몬스터에게 데미지가 들어가지 않음. (피격판정 O 데미지 X)기대결과캣닢 범위가 넓어지더라도 몬스터에게 데미지가 들어가야 함.재현빈도Always테스트환경강의자료 최종 레포지토리 강의자료 최종 배포본 상황https://paullabworkspace.notion.site/3-23-d2df6742dd0141d6bcad23902b9c3c20현재 강의 자료에서 공격 이벤트를 추가하기 위해 addAttackEvent()선언 시 아래와 같은 로직으로 캣닢을 m_attackEvents에 담고 있습니다.이후 공격 범위를 증가시키는 로직은 아래와같이 정의되어 있습니다.강의 자료 내에서는 레벨 4에 캣닢 공격의 스케일을 확장합니다. 현상강의 자료 내에서는 레벨 4에 캣닢 공격의 스케일을 확장합니다.이때 catnip이라는 class 구성에는 damage 값이 없어서 문제가 발생합니다. 공격 범위 증가 로직 작동 시 아래의 값이 undefined가 되게 됩니다.scene.m_attackEvents.catnip.damage 캣닢에서의 데미지는 m_damage로 선언되어 있기 때문입니다. 이는 오버레이 등 여러 로직과 엮여있는 컨벤션이므로 건들기 난해합니다.다른 공격 액션 또한 m_damage로 class가 구성되어 있으나, 다른 액션들은 이벤트 등록 시 damage가 있는 객체로 전달해서 큰 문제가 없습니다.결국 damage를 undefined 로 받은 캣닢은 레벨 4 이후 범위를 확장시키면서 데미지가 사라지는 현상이 나타나게 됩니다. 아무리 맞춰도 죽지 않습니다. 뼈를 내어주고 살을 얻습니다.JS인지라 damage가 undefined라고 에러는 나타나지 않지만 버그입니다.첫 강의 소개당시 왕까지 어렵게 가신 가장 큰 이유가 아닐까 싶습니다.해결방법이야 많겠지만 일단 무식하게 damage를 포함한 객체로 전달했습니다.(겸사겸사 동일한 에러를 도출할 것으로 보이는 scale과 repeatGap도 포함합니다.)/attackManager.js이 상태에서는 기존 catnip 자체를 저장하던 때와 비교하여 destroy() 메서드를 사용 할 수 없게 되므로 사이드이펙트 해소를 위해 아래와 같이 수정했습니다.객체에 destroy 함수만 넘길지 고민 많이 되더군요./attackManager.js
-
미해결함수형 프로그래밍과 JavaScript ES6+
안녕하세요 강사님!
fxjs로 프로젝트를 해보려하는데 폴더구조를 어떤식으로 짜고 함수명을 관리해주는게 협업에 도움이 될지 고민이라 질문남깁니다...!!
-
해결됨비전공자를 위한 진짜 입문 올인원 개발 부트캠프
섹션1~12 중에 객체지향 개념이 쓰인 적이 있나요?
간단히라도 알려주시면 감사하겠습니다
-
미해결자바스크립트 알고리즘 문제풀이 입문(코딩테스트 대비)
섬나라 아일랜드 문제 (DFS) - 12분 50초 의문
안녕하세요.섬나라 아일랜드 문제 설명 중 12:50 쯤, 브라우저 콘솔에 찍힌 dx,dy 값에 대응되는 좌표를 문제의 보드위에 동그라미 해주셨는데요, 그 순서가 (1,2) 부터 잘못되지 않았나싶어서요.이상입니다. 감사합니다.
-
미해결비전공자를 위한 진짜 입문 올인원 개발 부트캠프
http://localhost:8080/products적용 시 상품목안뜨는분들 참고하세요
.get("http://localhost:8080/products")로 바꾸고 새로고침하면 상품목록이 안 받아오는데이유가server.js에서 app.use(express.json()); app.use(cors());가 지워졌기 때문이네요.노션에 올라와 있는 코드에 조금 안 맞는 부분이 있어서 카피해서 쓸 경우 제대로 처리하지 못하는거같아요깃헙 소스보니까 아래와 같이 되어 있는걸 보고 알았네요app.use(express.json()); app.use(cors()); app.get("/products", (req, res) => { res.send({ products: [ ..... 결론 깃헙소스와 노션소스가 조금 달라서 전부카피하면 안된다는!깃헙소스가 맞고노션소스가 틀리므로 노션 수정하면 좋겠다는 생각!
-
해결됨비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
카카오맵 API, 윈포윈도우 디폴트값 해제 방법
안녕하세요. 재미있게 수업 수강하고 있습니다.현재 [섹션 5. 카카오맵에 여러개의 맛집 위치를 찍는 방법]을 수강하고 있는데요. 카카오맵에서 인포윈도우를 설정하면 기본으로 div를 생성하고 border에 회색 테두리를 생성하는 것 같습니다. 수업에서 만드는 infowindow 뒤쪽으로, 회색 테두리가 하나 더 보여서요.우리가 만드는 infowindow만 표시되도록 할 수 있는 방법이 있을까요? 카카오에서 생성하는 인포윈도우를 제거하거나, 혹은 해당 css를 제어할 수 있는지 궁금합니다.(저는 테두리가 없이 box-shadow로 표현하려고 시도하고 있습니다.)
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청드립니다.
.
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
context, 최적화 관련 질문
안녕하세요. 강사님완강하고 코드 복습하다가 context 관련해서 헷갈리는 점이 생겨서 질문드립니다.!이전에 간단한 일기장 만들기에서는 state를 핸들링하는 함수들(onCreate, onRemove, onEdit)을 전달하는 DispatchContext에 value Props으로 이 함수들을 넘겨줄 때, useMemo를 사용해서 함수들을 감싼 메모이제이션된 객체를 넘겨줘서state가 바껴서 App 컴포넌트가 재랜더링되어도 최적화가 풀리지 않도록 했던 걸로 기억합니다.이번 감정 일기장에서는 DispatchContext의 value Props로 함수들을 넘겨주실 때 함수를 담은 객체를 메모이져이션하지 않고 넘겨주셨습니다. 1) 이 경우, App에서 data state가 바뀌면 결국 onCreate, onRemove, onEdit 함수가 재생성되고 DispatchContext의 value로 넘겨주는 객체도 재생성되어 Context컴포넌트의 하위 컴포넌트(최적화 안한)도 재랜더링되는게 맞나요?2) 감정일기장에서 이 부분은 최적화 안한 것은 이번에는 그냥 간단하게 진행하시려고 해서 그런건가요?
-
해결됨[JS] Phaser 게임 제작 - 뱀파이어 서바이벌 클론
배포 파이프라인
노션에 있는 글 순서따라 했는데 아래 사진 단계에서 계속 멈춰있어서 질문드립니다.(제가 손을 댄 부분이 2군데 있는데 아래에서 말씀드리겠습니다.)용량이 그리 크지 않은 파일인데 배포에 30분이상 걸린다는건 분명히 문제가 있는 것 같아서요별도의 에러 로그가 나오지도 않는 상황이라 이유를 알 수도 없습니다.[변경한 부분]명령어 수정--> -N 옵션 다음에 ""로 명령어를 입력해도 아무 반응이 없어서 " " 로 수정 후 ssh key 생성ssh-keygen -t rsa -b 4096 -C "$(git config user.email)" -f gh-pages -N ""ssh-keygen -t rsa -b 4096 -C "$(git config user.email)" -f gh-pages -N " " deploy.yml 파일에서 branches: [ main ] / branches: [ main ] 를 main에서 master로 변경--> git branch 명령어로 현재 브랜치명을 확인해보니 master로 나와있어 수정 했습니다. cf) 위의 사진 상태에서 Cancel workflow 해보니 아래와 같은 메세지가 나왔습니다.
-
미해결함수형 프로그래밍과 JavaScript ES6+ 응용편
input값이 이터러블 함에도 range를 쓴 이유가 궁금합니다.
_.go( L.range(Infinity), L.map(i => track[i]), L.map(({cars}) => cars), L.takeWhile(({cars:{length:l}}) => l==4), _.each(console.log));강의에서 보여주신 위 코드를 보면, range를 통해서 이터러블한 순서를 만들어, track 배열의 요소를 순회하고 있습니다.하지만 track 자체도 list 이므로 이터러블하기에, 위 방법처럼 range를 써야할 필요를 잘 모르겠습니다. 혹시 의도하신 바가 있을까요?_.go( track, L.map(({cars}) => cars), L.takeWhile(({cars:{length:l}}) => l==4), _.each(console.log));
-
미해결비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지
workbench에서 접속이 안되고있습니다.
안녕하세요. 금일 메일로도 문의드렸던 학생입니다.mail 첨부이미지대로 설정을 다 했는데도 불구하고 인스턴스 규칙 추가bind address 주석처리root도 %로 IP대역 변경또한 sudo를 넣어 관리자권한으로 mysql restart까지 완료했습니다.하지만 여전히 workbench에서 test connection fail팝업창이 나와서 진도가 더이상 진행되지 않고있네요..구글링하여도 답을 찾을 수 없어 문의 다시 드립니다.
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헙 권한 요청
인프런 아이디 : minsun.yun@samsung.com인프런 이메일 : minsun.yun@samsung.com깃헙 아이디 : miinsun깃헙 Username : miinsun
-
미해결[하루 10분|Web Project] HTML/JS/CSS로 나만의 심리테스트 사이트 만들기
이미지버전에서 부트스트랩 이미지하고 텍스트도 이용하고 싶어요
부트스트랩의 그리드 카드 텍스트도 이용하고 싶어서그리드카드의 코드를 복사해서 텍스틀 추가하고나서왼쪽 이미와 오른쪽 이미지의 텍스트를 따로따로 넣고싶어서start.js 에서 function goText(qidx){ var l = document.querySelector('.card-body left'); var r = document.querySelector('.card-body right'); l.innerHTML = qnaList[qIdx].a.answerleft; r.innerHTML = qnaList[qIdx].a.answerright; for(let i in qnaList[qIdx].a.answerleft){ addAnswer(qnaList[qIdx].a[i].answerleft, qIdx, i); } for(let i in qnaList[qIdx].a.answerright){ addAnswer(qnaList[qIdx].a[i].answerright, qIdx, i); } } 이런식으로 추가하고 data.js 에는 q: '1. 질문?', a: [ { answerleft: 'a. 답', type: [1, 2, 4, 9] }, { answerright: 'b. 답', type: [0, 3, 6, 5, 10, 8] }, ] 이런식으로 만들었습니다.모르겠어서 ㅜㅜ 어떻게 풀어가야할까요 settimeout도 만들어야하나요?
-
미해결Vue.js 중급 강좌 - 웹앱 제작으로 배워보는 Vue.js, ES6, Vuex
깃헛 권한 요청 드립니다.
인프런 아이디 : mwkang@ecstel.co.kr인프런 이메일 : mwkang@ecstel.co.kr깃헙 아이디 : mwkang@ecstel.co.kr깃헙 Username : goo1949
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
새일기 작성, 수정 시 두번의 렌더링으로 두개가 생깁니다.
새일기를 작성하거나, 수정하게되면 두개씩 렌더링이 이루어 집니다.https://github.com/Byeong-Gwan/React/tree/main/Emotion-Diary
-
미해결한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
혹시 2번째 프로젝트도 코드좀 제공해주실수 있나요?
요번에 프로젝트 2를 시작했는데 뭐가 문제인지 모르겠는데 계속 오류가 뜨면서 문제가 발생하네요 분명히 아침에 작성했을때는 오류가 없이 잘 작동되었는데 말이죠... 혹시 프로젝트 1 처럼 관련 코들를 codesandbox에 제공이 가능할까요?
-
미해결Vue.js 끝장내기 - 실무에 필요한 모든 것
eslint, prettier 사용 중단하는 방법 없을까요 ??
저같은 경우는 애초에 eslint나 prittier를 사용하고 싶지 않아서 설정을 중단하고 싶은데 어떻게 방법이 없을까요 ?5분짜리 강의를 멈추고 수정하는대만 10분을 쓰고 있습니다
-
해결됨한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지
저는 자꾸 메소드가 두번씩 실행되는데 원인을 모르겠습니다
import { useState, useEffect, useRef, useMemo } from "react"; import "./App.css"; import DiaryEditor from "./DiaryEditor"; import DiaryList from "./DiaryList"; import OptimizeTest from "./OptimizeTest"; const App = () => { const [data, setData] = useState([]); const dataId = useRef(0); const getData = async () => { const res = await fetch( "https://jsonplaceholder.typicode.com/comments" ).then((res) => res.json()); const initData = res.slice(0, 10).map((it) => { return { author: it.email, content: it.body, emotion: Math.floor(Math.random() * 5) + 1, created_date: new Date().getTime(), id: dataId.current++, }; }); setData(initData); console.log(initData); }; useEffect(() => { getData(); }, []); const onCreate = (author, content, emotion) => { const created_date = new Date().getTime(); const newItem = { author, content, emotion, created_date, id: dataId.current, }; dataId.current += 1; setData([newItem, ...data]); }; const onRemove = (targetId) => { const newDiaryList = data.filter((it) => it.id !== targetId); console.log(newDiaryList); setData(newDiaryList); }; const onChange = (targetId, newContent) => { for (let i in data) { if (data[i].id === targetId) { data[i].content = newContent; } } setData([...data]); }; const getAnalysis = useMemo(() => { console.log("일기 분석 시작 "); const goodCount = data.filter((it) => it.emotion >= 3).length; const badCount = data.length - goodCount; const goodRatio = (goodCount / data.length) * 100; return { goodCount, badCount, goodRatio }; }, [data.length]); const { goodCount, badCount, goodRatio } = getAnalysis; return ( <div className="App"> <OptimizeTest /> <DiaryEditor onCreate={onCreate} /> <div>전체 일기 : {data.length}</div> <div>좋은 감정 점수 개수: {goodCount}</div> <div>나쁜 감정 점수 개수: {badCount}</div> <div>좋은 감정 점수 비율: {goodRatio}%</div> <DiaryList onRemove={onRemove} onChange={onChange} diaryList={data} /> </div> ); }; export default App;
-
해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스
mongo 실행 불가
안녕하세요 몽고디비를 다시 복습하고자 공부하던중 저번에 brew update를 통해 해결 된줄 알았지만 또 다시 같은 오류가 발생하였습니다... 이 에러는 어떠한 에러인지 찾아보고 gpt에다가 물어봐도 안나오는데.. 혹시 무엇 때문에 몽고가 brew services start mongodb-community 를하게 되면 이 오류가 발생하게 됩니다.. 도와 주세요..ㅠㅠ