묻고 답해요
160만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
- 
      
        
    해결됨Do It! 장고+부트스트랩: 파이썬 웹개발의 정석UpdateView - 포스트 수정 페이지 만들기 에서 질문이 있습니다.26:27초 쯤에 tests.py의 test_update_post() 함수에서 카테고리의 pk를 적어줘야하는지 이해가 잘 되지 않습니다.앞서 setUp() 함수에서 post_001과 post_002를 생성할 때는 category를 입력할 때 pk는 사용하지 않고 진행했습니다.하지만 왜 포스트 수정을 핱때는 category를 입력할 때 pk를 사용해야 하는지 잘 모르겠습니다. 
- 
      
        
    미해결Java/Spring 테스트를 추가하고 싶은 개발자들의 오답노트의존성을 분리하는 건 캡슐화를 깼다고 볼 수 없을까요?07:05 부근에서 메서드 내에 내부 알고리즘을 확인한 시점에서 캡슐화가 깨졌다는 언급을 해주셨습니다.개인적으로 생각했을 때는 의존성을 분리했을 때 또한 로직이 외부(인자)로 노출되므로 이것도 캡슐화가 깨졌다고 볼 수 있는 것 아닐까요? 
- 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스15-02 gateway2 docker-compose 에러도커 빌드하고 실행하는 과정에서 에러가 발생하네요.. 답변해주신 다른 글보고 해봐도 잘안되네요.. 일단 빌드시 생기는 에러입니다.yarn install 할때 경고가 엄청 발생하는데 apollo-server-express가 문제인 것 같은데 정확한건 잘 모르겠네요..사용한 버전정보입니다.도커 빌드가 완료되서 실행을 해도 gateway가 다운되고 1번에러라는 메세지만 받네요 .. 어떻게 해야 할 지 답변부탁드립니다 ㅜㅜ 
- 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스섹션2 회원가입 피그마 정답이 있나요회원가입 피그마 정답이 있는지 궁금하네요 열심히 만들었는데 비교를 할 수가 없어서 문제이네요최대한 비슷하게 했는데 미묘하게 달라서 제가 맞게 한건지 모르겠네요 섹션 7에 파이널 정답이 있는건 아는데 섹션2랑은 많이 달라서 문제네요 
- 
      
        
    해결됨Practical Testing: 실용적인 테스트 가이드setup 해야하는 데이터가 대용량인 경우 테스팅 가이드안녕하세요. 우빈님양질의 강의 제공해주셔서 감사의 말씀드립니다. 강의를 듣던 도중 실무에서는 어떻게 해결을 할까? 🤔라는 궁금증이 생겨 질문 드립니다. 만약에 테스트 코드 작성시에 setup해야 할 데이터가 대용량이라면실무에서는 주로 어떤 방식으로 테스트 코드를 작성하여 해결하나요? 감사합니다. 
- 
      
        
    미해결Practical Testing: 실용적인 테스트 가이드테스트 오류org.springframework.dao.InvalidDataAccessApiUsageException: org.hibernate.TransientPropertyValueException: object references an unsaved transient instance - save the transient instance before flushing : example.cafekiosk.spring.domain.orderproduct.OrderProduct.product -> example.cafekiosk.spring.domain.product.Product; nested exception is java.lang.IllegalStateException: org.hibernate.TransientPropertyValueException: object references an unsaved transient instance - save the transient instance before flushing : example.cafekiosk.spring.domain.orderproduct.OrderProduct.product -> example.cafekiosk.spring.domain.product.Product 스프링부트 2.7.12 인데 오류가 납니다.. 강사님 코드를 보니 OrderProduct Entity 쪽엔 cascade 가 설정이 안되어 있는데 설정을 하니 오류가 없어졌습니다..! 
- 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스14-02 프로시저 오류안녕하세요. 프로시저를 만든는 도중 에러가 발생해서 질문드립니다.똑같이 작성했는데도 에러가 나오네요. 세미콜론도 여러번 확인했는데 혹시 오류가 나는 다른 이유가 있을까요?? 
- 
      
        
    해결됨부트캠프에서 알려주지 않는 것들 (리액트) 1편TDD - Green, Red, Refactor안녕하세요. TDD의 Green, Red, Refactor 파트(9:40)에서리팩터링을 진행하시면서 onPageNumberClick 함수를 useCallback으로 감싸서 렌더링이 다시 될때 이 함수가 두번 생성되지 않도록 한다고 하셨는데이 부분이 잘 이해가 가지 않아서요. 설명해주신걸로 유추해보면 useCallback으로 감싸면 함수가 한번만 생성되는 것 같은데 useCallback을 사용했을때와 사용하지 않았을 때 차이에 대해서 조금 더 설명해주실 수 있을까요? 
- 
      
        
    미해결따라하며 배우는 리액트 A-Z[19버전 반영]클래스형과 함수형 컴포넌트안녕하세요 선생님현재 섹션2까지 수강하였는데요 이후에는 전부 함수형 컴포넌트로 강의 해주시는 건가요?클래스형 컴포넌트 기초적인 내용 학습 병행해야 할지 고민이되서 질문드립니다! 
- 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스프론트에서 credentials: include로 설정한경우 cors 문제안녕하세요.프론트와 백엔드 통신 중에 문제가 있어 질문드립니다.restoreAcessToken 기능을 사용하기 위해서 쿠키를 사용해야 합니다.서버측과 프론트측 주소가 다른 경우 쿠키 정보를 전송하기 위해서는credentials: 'include'로 설정해야 하잖아요?그러면 브라우저에 다음과 같은 오류가 발생합니다.Access to fetch at 'http://localhost:3000/graphql' from origin 'http://localhost:8080' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.프론트 주소: localhost:8080백엔드 주소: localhost:3000서버측에서 cors 문제를 해결하기 위해 사용한 코드는 아래와 같습니다.app.enableCors({ origin: "http://localhost:8080", // 요청을 보내는 클라이언트의 주소를 명시 credentials: true, });오류 해결을 위해서 어떻게 해야하는 걸까요? 그리고 새 토큰을 발급 받는 아래 setRefreshToken의 코드도 수정돼야 하는지요? network 탭에서는 쿠키가 들어온게 확인이 되는데 application 탭에서는 확인이 됐다 안됐다 합니다..setRefreshToken({ user, res }: IAuthServiceSetRefreshToken): void { const refreshToken = this.jwtService.sign({ email: user.email, sub: user.userId }, { secret: process.env.JWT_REFRESH_KEY, expiresIn: "2w" }); res.setHeader("Set-Cookie", `refreshToken=${refreshToken}; path=/;`); } 답변 부탁드립니다.감사합니다. 
- 
      
        
    미해결따라하며 배우는 리액트 A-Z[19버전 반영]수정 시 전체 수정되는 오류 OTL복습하면서 강의를 보지 않고 저 혼자 다시 만들어보고 있는 중입니다. 그래서 드래그 라이브러리나 React.memo 같은 기능은 우선 차치하고 CRUD 기능만 해보려고 하는데요.edit을 위한 💬 버튼을 누를 경우 다른 할 일들도 editing... 으로 전체 수정되는 오류가 있습니다 ㅠㅠ 어디가 꼬였는지 알 수 없어 몇 시간 째 헤매고 있는데, 어느 부분이 문제인지 알 수 있을까요? Lists 컴포넌트에서 문제가 발생하고 있습니다. App.jsimport React, { useState } from "react"; import Form from "./components/Form"; import Lists from "./components/Lists"; function App() { const today = new Date(); const month = today.getMonth() + 1; const day = today.getDate(); const [value, setValue] = useState(""); const [todoData, setTodoData] = useState([]); const handleSubmit = (event) => { event.preventDefault(); let newTodo = { id: Date.now(), title: value, done: false, }; setTodoData([...todoData, newTodo]); setValue(""); }; const handleClear = () => { setTodoData([]); }; return ( <div className="flex justify-center items-center min-h-screen w-screen bg-purple-100"> <div className="w-full lg:max-w-lg lg:max-w-3/4 p-6 m-4 bg-white rounded shadow"> <div className="flex justify-between pb-2"> <h1> 📌 {month}월 {day}일 오늘의 할 일 </h1> <button onClick={handleClear}>🧹 전체 삭제</button> </div> <Lists todoData={todoData} setTodoData={setTodoData} /> <Form handleSubmit={handleSubmit} value={value} setValue={setValue} /> </div> </div> ); } export default App; Lists.jsimport React, { useState } from "react"; const Lists = ({ todoData, setTodoData, title, id }) => { const [isEditing, setIsEditing] = useState(false); const [editedTitle, setEditedTitle] = useState(title); const handleDelete = (id) => { let newTodoData = todoData.filter((data) => data.id !== id); setTodoData(newTodoData); }; const handleDone = (id) => { let newTodoData = todoData.map((data) => { if (data.id === id) { data.done = !data.done; } return data; }); setTodoData(newTodoData); }; if (isEditing) { return <div>Editing...</div>; } else { return ( <div> {todoData.map((data) => ( <div className="flex py-2 my-2 justify-between items-center border rounded bg-purple-50" key={data.id} > <div className="mr-2 p-2"> <input className="mr-2" type="checkbox" defaultChecked={data.done} onChange={() => handleDone(data.id)} ></input> <span className={data.done ? "line-through" : undefined}> {data.title} </span> </div> <div className="pr-2"> <button className="mr-2" onClick={() => setIsEditing(true)}> 💬 //오류 발생 </button> <button className="mr-2" onClick={() => handleDelete(id)}> ❌ </button> </div> </div> ))} </div> ); } }; export default Lists; Form.jsimport React from "react"; const Form = ({ handleSubmit, value, setValue }) => { const handleChange = (event) => { setValue(event.target.value); }; return ( <div> <form className="flex justify-between pt-2" onSubmit={handleSubmit}> <input className="p-2 mr-2 border-2 rounded shadow w-full" type="text" placeholder="할 일을 입력하세요" value={value} onChange={handleChange} /> <input className="p-2 border-2 rounded bg-purple-200 text-white hover:bg-purple-300" type="submit" value="입력" /> </form> </div> ); }; export default Form; 
- 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스각 세션을 시작하기 위한 소스코드안녕하세요.강의를 통해 많은 도움 받고 있습니다.일하면서 배우는 중이라 필요한 내용들을 그때마다 찾아서 공부하고 있습니다. 그런데 강의 특성상 각 단계를 차례대로 따라가지 않으면 새로운 세션을 공부하기 위한 베이스 코드가 없기 때문에 어려움을 겪고 있습니다. 혹시 version2의 각 세션을 시작하기 위한 베이스 코드를 제공해주시기는 어려울까요?감사합니다. 
- 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스섹션29 10-08 강의 숙제 해설 질문안녕하세요.섹션29 10-08 강의 약 5:30 부분에서 타입스크립트 에러에 관한 숙제를 내주셨는데요. 해당 숙제와 관련된 해설 및 코드가 있는지 궁금합니다. 
- 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스섹션22 서버개념에 대한 질문입니다.안녕하세요? 강의 잘 듣고 있습니다.서버관련해서 몇가지 헷갈리는 개념이 있어서 질문드립니다. 서버가 백엔드만 지칭하는 용어인 줄 알았는데 프론트나 DB에도 서버개념이 있다는 것이 신기했습니다. 단순히 데이터를 제공하는 입장이면 전부 서버라는 용어를 사용해도 되는 것인가요?브라우저와 클라이언트를 같은 개념으로 생각해도 되는지요? 더 나아가 프론트까지? (저는 백엔드 개발을 공부하고 있어서 백엔드입장에서는 브라우저, 클라이언트, 프론트가 전부 같은 포지션으로 생각됩니다.)백엔드서버가 브라우저의 접속도 기다린다고 하셨는데 백엔드서버는 프론트엔드서버하고만 통신하는 것이 아닌가요?예를들어 브라우저(클라이언트?)에서 회원가입창을 클릭하고 프론트서버에서 화면을 보여줍니다.그리고 휴대폰인증번호를 입력한다고 하면, 프론트서버가 그 번호을 받아 백엔드서버로 넘겨줘서 백엔드에서 검증뒤 프론트로 보내주고, 프론트는 인증결과를 브라우저에 표시해줍니다.보통 이런 경우 백엔드는 브라우저가 아니라 프론트하고 교류를 하는 것이 아닌가 생각합니다. 근본적으로 궁금한 것은 클라이언트가 브라우저에서 이런 저런 작업(클릭, 입력)을 했을 때 브라우저, 프론트, 백엔드, DB에서 서로 어떻게 통신을 하는지 내부에서 어떤 작업들이 일어나는지등의 큰 흐름을 알고 싶은데 이건 지금 질문하기보단 강의를 끝까지 들어봐야될것 같네요 ^^;; 
- 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스모듈 의존성 문제@Module({ imports: [ TypeOrmModule.forFeature([Product, ProductTag, ProductCategory]), UserModule, ProductTagModule, ProductCategoryModule, ], providers: [ ProductResolver, ProductService, ], }) export class ProductModule {}위와 같은 코드에서 ProductService의 실행에 필요한 ProductTagModule과 ProductCategoryModule를 다 import 해주었는데 계속 아래와 같은 의존성 오류가 나왔습니다.Nest can't resolve dependencies of the ProductService (ProductRepository, ?, UserService, ProductCategoryService). Please make sure that the argument ProductTagService at index [1] is available in the ProductModule context.Potential solutions:- Is ProductModule a valid NestJS module?- If ProductTagService is a provider, is it part of the current ProductModule?- If ProductTagService is exported from a separate @Module, is that module imported within ProductModule? @Module({ imports: [ /* the Module containing ProductTagService */ ] }) 그래서 아래와 같이 ProductTagService, ProductCategoryService를 임의로 providers에 넣어주면 또 실행이 됩니다. 해당 모듈을 이미 임포트 해주었는데 왜 서비스를 따로 또 주입해주어야 할까요?@Module({ imports: [ TypeOrmModule.forFeature([Product, ProductTag, ProductCategory]), UserModule, ProductTagModule, ProductCategoryModule, ], providers: [ ProductResolver, ProductService, ProductTagService, ProductCategoryService, ], }) export class ProductModule {} 아래는 ProductTagModule과 ProductCategoryModule 코드입니다.@Module({ imports: [TypeOrmModule.forFeature([ProductTag])], providers: [ProductTagResolver, ProductTagService], }) export class ProductTagModule {} @Module({ imports: [TypeOrmModule.forFeature([ProductCategory])], providers: [ProductsCategoriesResolver, ProductCategoryService], }) export class ProductCategoryModule {} 
- 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스15-02 API-GateWay 2안녕하세요 수업을 잘 따라가고 있던 중 오류가 발생하였습니다... docker을 작동 하였고 아래와 같이 나와 도커를 확인 하였습니다.gatway제외한 나머지는 작동이 되는 걸 확인 하였고 gateway만 따로 작동을 하자 아래와 같이 에러가 발생하였습니다... 버전문제 때문에 그런건가요...?? 
- 
      
        
    미해결따라하며 배우는 리액트 A-Z[19버전 반영]git 배포!!!!!!동일한 질문이 있는데 답변을 이해하지 못해서 질문합니다. 저는 [깃허브아이디]/상위폴더/하위폴더/하위폴더2 에 지금까지 만든 넷플릭스 파일들이 있습니다.이 경우에 package.json의 homepage 부분과 index.js의 basename은 어떻게 설정해야 하는 것인지요? 아까까지 전체 주소(하위폴더2까지) homepage, basename을 작성하여 배포했는데 완성된 주소는 상위폴더까지만 적혀 있습니다.지금은 [깃허브아이디].github.io/[상위폴더]/로 다시 배포했는데 상위폴더 안의 Read.me만 나오고 있습니다. (캐시 삭제 및 20분 정도 기다림)ㅠㅠ 왜 이러는지 알고 싶습니다. 
- 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스안녕하세요 버전1과 버전2의 차이에서cs적인 부분이 더 강화되고 장점이 더 많아 졌다는 것을 알게되었는데,혹시 ver1부분과 ver2부분에서 elk스택에 대해서는 없는거 같은데 빠졌나요? 
- 
      
        
    미해결따라하며 배우는 리액트 A-Z[19버전 반영]배너 Iframe 디자인 시 가상 요소여기서 &를 써서 스타일을 추가하는 이유가 무엇인가요?그냥 위에 있는 Iframe에 적용하면 안되는 건가요?이 부분을 Iframe에 포함시키니 오류가 나서 왜인지 궁금합니다.const Iframe = styled.iframe` width: 100%; height: 100%; z-index: -1; opacity: 0.65; border: none; &: :after { content: ""; position: absolute; top: 0; left: 0; width: 100% height: 100% } `; 
- 
      
        
    해결됨[코드캠프] 부트캠프에서 만든 고농축 백엔드 코스수업과는 상관없지만 개발 순서와 완성도에 대해 질문드립니다!안녕하세요!저는 프론트수업과 백엔드 수업을 듣고 하나의 웹을 혼자서 만들어보려고 하는데요.프론트부분과 백엔드 부분 중 어느 부분을 먼저 만들어야하는지 궁금합니다.그리고 백엔드 개발자를 준비한다면 프론트 부분의 완성도가 어느정도여야 하는지도 궁금합니다.( 포트폴리오 제출시 어필하기 위해서 )질문이 많이 모호해서 답변해주시기 어려울 것 같다는 생각이 드는데요, 혼자서 포트폴리오를 위해 웹을 제작하는 경우 어느정도까지 완성해야하는지가 궁금합니다. 
