inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

묻고 답해요

173만명의 커뮤니티!! 함께 토론해봐요.

세션5 상품 목록 컴포넌트 처리

미해결

코드로 배우는 React 19 with 스프링부트 API서버

import axios from "axios" import { API_SERVER_HOST } from "./todoApi" // api server host const host = `${API_SERVER_HOST}/api/products` // 외부 보낼것 만들기 비동기 통신 export const postAdd = async (product) => { // 객체지정 const header = {headers: {'Content-Type':'multipart/form-data'}} // product와 header 같이 보내기 const res = await axios.post(`${host}/`, product, header) return res.data } export const getList = async (pageParam) => { try{ const {page, size} = pageParam const res = await axios.get(`${host}/list`, {params: {page:page, size:size}}) return res.data } catch (error) { console.error('Error in getList:', error); throw error; } } productsApi.js 위 코드이고 import React, { useState, useEffect } from 'react'; import useCustomMove from '../../hooks/useCustomMove'; import { API_SERVER_HOST } from '../../api/todoApi'; import { getList } from '../../api/productsApi'; const initState = { dtoList: [], pageNumList: [], pageRequestDTO: null, prev: false, next: false, prevPage: 0, nextPage: 0, current: 0 } // 서버에 주소가 바뀌면 상수값만 바꿔줄려고 선언한것 const host = API_SERVER_HOST function ListComponent(props) { // 커스텀 훅 사용해서 이동 refresh: 갱신 const {moveToList, moveToRead, page, size, refresh} = useCustomMove() // 목록 데이터 가져오기 const [serverData, setServerData] = useState(initState) // 데이터 가져오기 const [fetching, setFetching] = useState(false) useEffect(() => { setFetching(true) // 데이터 가져오는 중 자동으로 처리되기 때문에 // 서버데이터가 처리가 되면 getList({page,size}).then(data => { console.log("data>>>>>>>", data); setFetching(false) setServerData(data) }) }, [page,size,refresh]); return ( <div className="border-2 border-blue-100 mt-10 mr-2 ml-2"> {/* fetching일때는 FetchingModal 호출하고 그렇지 않으면 아무것도 안보여준다. */} {fetching? <FetchingModal/> :<></>} <div className="flex flex-wrap mx-auto p-6"> {serverData.dtoList.map(product => <div key= {product.pno} className="w-1/2 p-1 rounded shadow-md border-2" onClick={() => moveToRead(product.pno)} /* 링크 만들어주고 썸네일 이미지 만들어서 보여주는 기능 */ > <div className="flex flex-col h-full"> <div className="font-extrabold text-2xl p-2 w-full ">{product.pno}</div> <div className="text-1xl m-1 p-2 w-full flex flex-col"> <div className="w-full overflow-hidden "> <img alt="product" className="m-auto rounded-md w-60" src={`${host}/api/products/view/s_${product.uploadFileNames[0]}`} /> </div> <div className="bottom-0 font-extrabold bg-white"> <div className="text-center p-1"> 이름: {product.pname} </div> <div className="text-center p-1"> 가격: {product.price} </div> </div> </div> </div> </div> )} </div> </div> ); } export default ListComponent; ListComponent.js 파일인데 import React from 'react'; import ListComponent from '../../components/products/ListComponent'; function ListPage(props) { return ( <div className="p-4 w-full bg-white"> <div className="text-3xl font-extrabold"> Products List Page </div> <ListComponent/> </div> ); } export default ListPage; ListPage.js 파일입니다 터미널에 에러도 뜨지 않고 서버에서 데이터를 못가져오는데 postman으로 서버 테스트를 했을때는 잘 되는데요 서버에서 클라이언트로 연동되는 부분에서 문제가 생긴건지 list를 가져오지를 못하고 있습니다 ㅠ 왜 그런건지 알 수 있을까요 ㅠ 오타도 아닌거 같고..

  • react
  • spring-boot
  • jpa
  • jwt
  • redux-toolkit
jkshin 댓글 3 좋아요 0 조회수 319

DI 와 전반적인 구조 질문

미해결

스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술

[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 네 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 네 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) 네 [질문 내용] 1. 회원 서비스를 테스트할 때, DI를 하는 이유를 저는 아래처럼 이해했는데 이것이 맞는 이해인지 궁금합니다. MemberService() 를 실행하는 순간 MemoryMemberRepository 가 new로 생성되고, 그 다음줄에서 MemoryMemberRepository 를 새롭개 new로 생성한다. 현재의 코드에서는 Store 가 static 하게 선언되었으므로 그런 문제가 발생하지 않겠지만, 그렇지 않다면 MemberService 와 MemoryMemberRepository 가 서로 다른 레포지토리 인스턴스를 가지게된다. 위 내용이 맞다면, 모듈 테스트를 하지 않는다는 가정하에 해당 부분 뒤에 나오는 스프링 통합 테스트를 할 때는 이미 스프링 컨테이너에 레포지토리가 등록되어 있으므로 생성자를 활용한 의존성 주입이 필요없는 것이 맞나요? 아래 그림은 최종적으로 제가 구조를 이해한 것을 구조화 한 것인데 혹시 틀린 부분이 있는지 궁금합니다.

  • java
  • spring
  • mvc
  • spring-boot
손 훈서 댓글 1 좋아요 0 조회수 369

이번 final 과제 피드백 부탁드립니다!

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

안녕하세요! 강의 잘 듣고 있습니다! 이번 과제 코드 피드백 부탁드립니다! 고맙습니다. <화면> <html> <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>SignUp</title> <link rel="stylesheet" href="./final.css"> <script defer src="./final.js"></script> </head> <body> <div class="wrapper"> <div class="wrapper__header"> <span id="header__title">코드캠프 회원가입</span> </div> <div class="wrapper__body"> <div class="wrapper__text"> <input type="text" id="email" placeholder="이메일을 입력해 주세요."> <span class="errorMsg email">이메일이 올바르지 않습니다.</span> <input type="text" id="name" placeholder="이름을 입력해 주세요."> <span class="errorMsg name">이름이 올바르지 않습니다.</span> <input type="text" id="pw1" placeholder="비밀번호를 입력해 주세요."> <span class="errorMsg pw1">비밀번호를 입력해주세요.</span> <input type="text" id="pw2" placeholder="비밀번호를 다시 입력해 주세요."> <span class="errorMsg pw2">비밀번호를 입력해주세요.</span> </div> <div class="wrapper__phone" oninput="phone()"> <input type="text" id="num1" maxlength="3"> - <input type="text" id="num2" maxlength="4"> - <input type="text" id="num3" maxlength="4"> </div> <div class="wrapper__certification"> <div class="cert__number"> <span id="certNum">000000</span> <button class="chkBtn" disabled="true">인증번호 전송</button> </div> <div class="cert__time"> <span id="certTimer">3:00</span> <button class="chkBtn" disabled="true">인증완료</button> </div> </div> <div class="wrapper__select"> <div class="select__locale"> <select id="locale"> <option selected disabled>지역을 선택하세요</option> <option value="서울">서울</option> <option value="경기">경기</option> <option value="인천">인천</option> </select> <span class="errorMsg locale">지역을 선택해주세요.</span> </div> <div class="select__gender"> <label for="woman"> <input type="radio" name="gender" id="woman"> 여성 </label> <label for="man"> <input type="radio" name="gender" id="man"> 남성 </label> </div> <span class="errorMsg gender">성별을 선택해주세요.</span> </div> </div> <div class="divideLine"></div> <div class="wrapper__check"> <!-- <button class="submit" disabled="true">가입하기</button> --> <button class="submit">가입하기</button> </div> </div> </body> </html> <css> *{ box-sizing: border-box; margin: 0; } html, body{ width: 540px; } .chkBtn{ width: 120px; height: 40px; border: 1px solid #D2D2D2; border-radius: 7px; font-size: 16px; font-weight: 400; color: #0068FF; background-color: #FFF; cursor: pointer; } .chkBtn.active { width: 120px; height: 40px; border: 1px solid #D2D2D2; border-radius: 7px; font-size: 16px; font-weight: 400; background-color: #0068FF; color: #FFF; cursor: pointer; } .errorMsg{ width: 100%; color: red; font-size: 10px; display: flex; flex-direction: column; align-items: center; visibility: hidden; } .wrapper{ width: 100%; height: 100%; padding: 60px 80px; border: 1px solid #AACDFF; border-radius: 20px; box-shadow: 7px 7px 39px rgba(0, 104, 255, .25); } .wrapper__header{ width: 100%; font-size: 32px; font-weight: 700; color: #0068FF; padding-bottom: 60px; } .wrapper__body{ width: 100%; } .wrapper__text > input{ width: 100%; height: 60px; margin-top: 20px; font-size: 16px; font-weight: 400; border: 1px solid #D2D2D2; border-radius: 7px; padding: 18px; } .wrapper__phone{ width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 20px 0; } .wrapper__phone > input{ width: 100px; height: 40px; border: 1px solid #D2D2D2; border-radius: 7px; } .wrapper__certification { width: 100%; display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; } #certNum, #certTimer{ color: #0068FF; font-size: 18px; padding-right: 20px; } .cert__time{ padding: 20px 0; } .wrapper__select{ width: 100%; display: flex; flex-direction: column; align-items: center; } .select__locale{ width: 100%; display: flex; flex-direction: column; justify-content: center; } #locale{ width: 100%; height: 60px; border: 1px solid #D2D2D2; border-radius: 7px; color: #797979; font-size: 16px; font-weight: 400; padding: 18px; } .select__gender{ width: 140px; display: flex; justify-content: space-between; padding-top: 30px; } .divideLine{ width: 100%; border: 1px solid #E6E6E6; margin: 20px 0; } .wrapper__check{ width: 100%; display: flex; justify-content: center; } .submit { width: 100%; height: 60px; font-size: 18px; font-weight: 400; color: #0068FF; background-color: #FFF; border: 1px solid #0068FF; border-radius: 7px; } <js> const submit = document.querySelector('.submit'); // 가입하기 const numberChk = document.querySelector('.cert__number .chkBtn'); // 인증번호 전송 const timeChk = document.querySelector('.cert__time .chkBtn'); // 인증완료 let time = 180; // 180초, 인증 시간 let isStarted = false; // email const emailChk = () => { let email = document.getElementById('email').value; if(email.includes('@') === true){ let isEmail = email.split('@')[1].includes('.'); if(isEmail === false){ document.querySelector('.errorMsg.email').style.visibility = 'visible'; document.querySelector('.errorMsg.email').value = ''; return false; } else { document.querySelector('.errorMsg.email').style.visibility = 'hidden'; return true; } } else { document.querySelector('.errorMsg.email').style.visibility = 'visible'; document.getElementById('email').value = ''; return false; } } // name const nameChk = () => { let name = document.getElementById('name').value; if(name.length === 0){ document.querySelector('.errorMsg.name').style.visibility = 'visible'; return false; } else { document.querySelector('.errorMsg.name').style.visibility = 'hidden'; return true; } } // pw const pwChk = () => { let pw1 = document.getElementById('pw1').value; let pw2 = document.getElementById('pw2').value; if(pw1 && pw2){ if(pw1 === pw2){ document.querySelector('.errorMsg.pw1').style.visibility = 'hidden'; document.querySelector('.errorMsg.pw2').style.visibility = 'hidden'; return true; } else { document.querySelector('.errorMsg.pw1').style.visibility = 'visible'; document.querySelector('.errorMsg.pw2').style.visibility = 'visible'; document.querySelector('.errorMsg.pw1').innerHTML = '비밀번호가 일치하지 않습니다.' document.querySelector('.errorMsg.pw2').innerHTML = '비밀번호가 일치하지 않습니다.' return false; } } else { document.querySelector('.errorMsg.pw1').style.visibility = 'visible'; document.querySelector('.errorMsg.pw2').style.visibility = 'visible'; return false; } } // phone const phone = () => { let num1 = document.getElementById('num1').value; let num2 = document.getElementById('num2').value; let num3 = document.getElementById('num3').value; if(num1.length === 3) { document.getElementById('num2').focus(); if(num2.length === 4) { document.getElementById('num3').focus(); } } if(num1.length === 3 && num2.length === 4 && num3.length === 4){ numberChk.classList.add('active'); certification(); } } const certification = () => { // 인증번호 numberChk.disabled = false; numberChk.addEventListener('click', e => { let randomNumber = String(Math.trunc(Math.random() * 1000000)).padStart(6, '0') document.getElementById('certNum').innerText = randomNumber; // 타이머 if(isStarted === false){ isStarted = true; timeChk.disabled = false; let timer = setInterval(() => { if(time >= 0){ let min = Math.trunc(time / 60); let sec = String(time % 60).padStart(2,'0'); document.getElementById('certTimer').innerText = `${min}:${sec}`; time--; } else { clearTime(timer); } }, 100) timeChk.addEventListener('click', e => { if(time >= 0){ alert('인증이 완료 되었습니다.'); clearTime(timer); submit.disabled = false; } }) } }) } const clearTime = (timer) => { timeChk.classList.remove('active'); numberChk.classList.remove('active'); document.getElementById('certNum').innerText = '000000'; document.getElementById('certTimer').innerText = '0:00'; timeChk.disabled = true; numberChk.disabled = true; isStarted = false; clearInterval(timer); } const checkValidation = () => { emailChk(); nameChk(); pwChk(); if(emailChk() && nameChk() && pwChk()) { return true; } else { return false; } } // 검증 submit.addEventListener('click', e => { checkValidation(); if(checkValidation()){ alert('코드캠프 가입을 축하합니다.'); } });

  • react
  • node.js
  • seo
  • graphql
  • next.js
개발하는 알파카 댓글 1 좋아요 0 조회수 222

더 큰 숫자 찾기 문제 질문입니다

미해결

김영한의 자바 입문 - 코드로 시작하는 자바 첫걸음

[질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 예 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) 예 [질문 내용] 더 큰 숫자 찾기문제에 int max = (a > b) ? a : b;가 아닌 String status = (a > b) ? "10" : "20";는 틀린 답인가요? 이유도 궁금합니다

  • java
  • 객체지향
cye7066 댓글 1 좋아요 0 조회수 258

익명클래스 지역클래스 질문

미해결

김영한의 실전 자바 - 중급 1편

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 익명 클래스는 이름이 없는 지역 클래스라고 하셨는데 익명 클래스를 메소드 파라미터로 넘기는 부분에서 사용하기 때문에 지역 클래스라고 하는건가요??

  • java
  • 객체지향
도토리묵 댓글 1 좋아요 0 조회수 255

변경 감지 메커니즘에서 4. flush, 5. commit 의미

해결됨

자바 ORM 표준 JPA 프로그래밍 - 기본편

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 예 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 예 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) 예 [질문 내용] 여기에 질문 내용을 남겨주세요. 사진에서 4. flush, 5. commit은 무엇을 의미하는 것인지 궁금합니다.

  • java
  • jpa
박호정 댓글 1 좋아요 0 조회수 317

Transactional 과 Lazy Loading

미해결

자바 ORM 표준 JPA 프로그래밍 - 기본편

안녕하세요 강의 잘 듣고 있습니다. 다름이 아니라 프로젝트를 업그레이드 하는 과정에서 오류가 생겨 질문 드립니다. package ShopProject.myShopProject.Domain; import ShopProject.myShopProject.Domain.Item.Item; import ShopProject.myShopProject.Domain.Order.Order; import jakarta.persistence.*; import jakarta.validation.constraints.NotEmpty; import jakarta.validation.constraints.NotNull; import lombok.Data; import lombok.Getter; import lombok.Setter; import java.util.ArrayList; import java.util.List; @Entity @Getter @Setter public class Member { @Id @GeneratedValue @Column(name = "member_id") private Long id; private String name; @Embedded private Address address; @OneToMany(mappedBy = "member",cascade = CascadeType.REMOVE) private List<Order> orders = new ArrayList<>(); private String loginId; private String password; @OneToMany(mappedBy = "member") private List<LikedItem> likedItems = new ArrayList<>(); } package ShopProject.myShopProject.Domain; import ShopProject.myShopProject.Domain.Item.Item; import jakarta.persistence.*; import lombok.Getter; import lombok.Setter; @Entity @Getter @Setter public class LikedItem { @Id @GeneratedValue @Column(name = "likedItem_id") private Long id; @ManyToOne(fetch = FetchType.LAZY) @JoinColumn(name = "member_id") private Member member; @ManyToOne(fetch = FetchType.LAZY) @JoinColumn(name = "item_id") private Item item; } 보시는 것처럼 멤버와 좋아요 상품은 Lazy 관계에 있습니다. OneToMany는 기본이 Lazy이므로 명시하지 않았습니다. 따라서 좋아요 상품은 직접 조회될 때만 DB에서 조회되고, 다른 경우는 프록시 형태로 존재합니다. //아이템 상세 정보 @GetMapping("item") public String itemDetail(@RequestParam("itemId") Long itemId, @SessionAttribute(name = "loginMember") Member loginMember, Model model) { log.info("item 호출"); Item item = itemService.findOne(itemId); log.info(loginMember.getLoginId() + " " + loginMember.getName()); // 좋아요 여부 추가 model.addAttribute("isLiked", memberService.isliked(loginMember, item)); //이 부분입니다!! model.addAttribute("item", item); model.addAttribute("member", loginMember); if (item.getCategory().equals("Book")) { return "items/item/book"; } if (item.getCategory().equals("Album")) { return "items/item/album"; } if (item.getCategory().equals("Movie")) { return "items/item/movie"; } return "items/item"; } 위 컨트롤러를 호출하면, isliked라는 매소드를 실행하게 됩니다. 좋아요 여부를 확인하는 메소드입니다. //좋아요 아이템이 아니면 false 반환 @Transactional public Boolean isliked(Member member, Item item) { log.info("좋아요 확인 메서드 실행"); // log.info("멤버 정보" + member.getName() + " " + member.getLoginId()); for (LikedItem likeditem: member.getLikedItems()) { //여기에서 lazyinitializationError 발생 if (likeditem.getItem().getName().equals(item.getName())) { log.info("좋아요인 경우"); return true; } } log.info("좋아요 아닌 경우"); return false; } 그런데 여기에서 맴버의 좋아요 목록을 불러오면 lazyinitialization 에러가 발생합니다... 정말 많이 원인도 구글링해보았는데, 영속성 컨텍스트가 종료 된 후 접근할 때 발생하는 것을 알았습니다. 영속성 컨텍스트의 생명주기는 트렌잭션과 거의 동일하다고 알고 있습니다. 만약 위 메소드에 트렌젝션 어노테이션이 없다면 member.getLikedItems() 의 결과를 초기화해주지 않으면 오류가 발생할 것입니다. 따라서 트렌젝션 어노테이션을 넣으므로서, member.getLikedItems()를 가져오고, 직접 DB에서 불러오는 과정을 한 트랜젝션 안에서 수행하도록 했습니다. 그런데 이 메서드에서 계속 LazyinitializatoinError가 발생합니다. 이 부분의 원인을 전혀 못 찾겠습니다.. 해결책으로는 DTO를 사용하거나, fetch Join을 사용해서 멤버와 같이 조인하여 한번에 가져옴으로 해결할 수있을 거라 생각합니다. 하지만 해결책은 알았지만, 위 코드의 무슨 오류가 있는지 정말 궁금합니다. 따라서 이 코드의 오류를 알고 싶습니다. 또한 저의 이해에 오류가 있다면 그 부분도 알려주시면 감사하겠습니다.

  • java
  • jpa
ml505050 댓글 1 좋아요 0 조회수 180

이런 문제가 발생합니다

미해결

스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술

애초에 없는 파일이라 뜨는데 뭐가 잘못된건가요??

  • java
  • spring
  • mvc
  • spring-boot
댓글 1 좋아요 0 조회수 209

117번 동영상이 안올라온거 같아요

미해결

PZM기반 실무중심 백엔드 부트캠프(프리트레이닝)

그런거 같아요

  • java
  • spring
  • spring-boot
  • jpa
  • backend
김재원 댓글 1 좋아요 0 조회수 250

함수에 대해 질문있습니다.

해결됨

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

자바스크립트 함수가 조금 어려운데 함수는 그냥 관련된 코드들을 작성할 때 사용하나요? 예를 들어 input으로 어떠한걸 한다면 input 함수를 만들어서 이 함수안에는 input과 관련된 코드들을 작성한다고 보면되는건가요?

  • react
  • node.js
  • seo
  • graphql
  • next.js
부드러운 족제비 댓글 1 좋아요 0 조회수 178

단건 조회 시 Optional

미해결

실전! 스프링 데이터 JPA

<순수 JPA 기반 리포지토리 만들기>에서 단건 조회 시 Optional로 반환하는데, repository layer에서 orElseThrow를 던지는 방법은 별로인가요?

  • java
  • spring
  • spring-boot
  • jpa
ckdgus1713 댓글 2 좋아요 0 조회수 305

Time클래스 Period의 값을 LocalDate에 넣기

해결됨

김영한의 실전 자바 - 중급 1편

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 안녕하세요. 궁금중이 생겨서 질문을 남깁니다. Period클래스를 이용해서 지정 범위 의 시간을 구한 것을, 다시 LocaDate로 값을 바꾸고 싶을때, 아래의 코드처럼 코딩을 하였는데요, LocalDate startDate = LocalDate.of(2024, 1, 1); LocalDate endDate = LocalDate.of(2024, 11, 21); Period period = period.between(startDate, endDate); LocalDate localDate = LocalDate.of(period.getYears(),period.getMonths(),period.getDays()); 이런 코드 스타일이라고 할까요? 이렇게 코드 짜는게 맞나요? (TestBetween클래스 코드를 좀 수정 한 것입니다.) 답변 부탁 드립니다. (추가) - 코드 변경 + 내용 수정 글을 다시 보니 글이 너무 이상하네요. 좀 죄송합니다. 저가 너무 서포터즈님 들의 도움만 바라는 것인가? 라는 생각도 좀 드는데.. 이것도 지적해주시면 감사하겠습니다.

  • java
  • 객체지향
생각하는자 댓글 1 좋아요 0 조회수 272

animator안의 animatorcontroller를 불러올수없어요

미해결

유니티 Addressable 을 이용한 패치 시스템 구현

상황은 이렇습니다. 어떤 캐릭터 프립펩이 있고 그 프리펩안에 animator 컴포넌트를 넣어두었습니다. 그리고 그 animator컴포넌트안에 animatorcontroller를 만들어서 넣어놓은 상황입니다. animatorcontroller안에는 여러가지 애니메이션을 넣어둔상태입니다. 이상태에서 캐릭터 프리펩을 addressable에 할당했습니다. animatorcontroller파일도 addressable에 할당했습니다. 두개를 같은 어드레서블 그룹에 넣은후에 어드레서블을 빌드한후에 서버에 올렸고 using System.Collections; using System.Collections.Generic; using System.Linq; using UnityEngine; using UnityEngine.AddressableAssets; using UnityEngine.UI; public class DownManager : MonoBehaviour { [Header("UI")] public GameObject waitMessage; public GameObject downMessage; public Slider downSlider; public Text sizeInfoText; public Text downValText; [Header("Label")] public AssetLabelReference prefabLabel; public AssetLabelReference materialLabel; public AssetLabelReference animationLabel; public AssetLabelReference textureLabel; private long patchSize; private Dictionary<string, long> patchMap = new Dictionary<string, long>(); void Start() { waitMessage.SetActive(true); downMessage.SetActive(false); StartCoroutine(InitAddressable()); StartCoroutine(CheckUpdateFiles()); } IEnumerator InitAddressable() { var init = Addressables.InitializeAsync(); yield return init; } #region Chek Down IEnumerator CheckUpdateFiles() { var labels = new List<string>() { prefabLabel.labelString, materialLabel.labelString, animationLabel.labelString, textureLabel.labelString}; patchSize = default; foreach (var label in labels) { var handle = Addressables.GetDownloadSizeAsync(label); yield return handle; patchSize += handle.Result; } if (patchSize > decimal.Zero) { //Down waitMessage.SetActive(false); downMessage.SetActive(true); sizeInfoText.text = GetFileSize(patchSize); } else { downValText.text = " 100 % "; downSlider.value = 1f; yield return new WaitForSeconds(2f); LoadingManager.LoadScene("MainLobby"); } } private string GetFileSize(long byteCnt) { string size = "0 Bytes"; if (byteCnt >= 1073741824.0) { size = string.Format("{0:##.##}", byteCnt / 1073741824.0) + " GB"; } else if (byteCnt >= 1048576.0) { size = string.Format("{0:##.##}", byteCnt / 1048576.0) + " MB"; } else if (byteCnt >= 1024.0) { size = string.Format("{0:##.##}", byteCnt / 1024.0) + " KB"; } else if (byteCnt > 0 && byteCnt < 1024.0) { size = byteCnt.ToString() + " Bytes"; } return size; } #endregion #region DownLoad public void Button_DownLoad() { StartCoroutine(PatchFiles()); } IEnumerator PatchFiles() { var labels = new List<string>() { prefabLabel.labelString, materialLabel.labelString, animationLabel.labelString, textureLabel.labelString}; foreach (var label in labels) { var handle = Addressables.GetDownloadSizeAsync(label); yield return handle; if (handle.Result != decimal.Zero) { StartCoroutine(DownLoadLabel(label)); } } yield return CheckDownLoad(); } IEnumerator DownLoadLabel(string label) { patchMap.Add(label, 0); var handle = Addressables.DownloadDependenciesAsync(label, false); while (!handle.IsDone) { patchMap[label] = handle.GetDownloadStatus().DownloadedBytes; yield return new WaitForEndOfFrame(); } patchMap[label] = handle.GetDownloadStatus().TotalBytes; Addressables.Release(handle); } IEnumerator CheckDownLoad() { var total = 0f; downValText.text = "0 %"; while (true) { total += patchMap.Sum(tmp => tmp.Value); downSlider.value = total / patchSize; downValText.text = (int)(downSlider.value * 100) + " %"; if (total == patchSize) { yield return new WaitForSeconds(1f); // 지연 시간 추가 LoadingManager.LoadScene("MainLobby"); break; } total = 0f; yield return new WaitForEndOfFrame(); } } #endregion } 이렇게 다운로드를 받았습니다. 그리고나서 using System.Collections; using System.Collections.Generic; using System.IO; using UnityEngine; using UnityEngine.AddressableAssets; using UnityEngine.ResourceManagement.AsyncOperations; public class GameManager : MonoBehaviour { public GameObject _player; public Dictionary<string, string> stateNameMap = new Dictionary<string, string>(); private IEnumerator CreateCharacter() { var initializeOperation = Addressables.InitializeAsync(); yield return initializeOperation; if (initializeOperation.Status == AsyncOperationStatus.Succeeded) { Debug.Log("Addressables initialized successfully"); LocalPlayerLoad(); } } private void Start() { StartCoroutine(CreateCharacter()); } public void LocalPlayerLoad() { Addressables.InstantiateAsync("Assets/Project/Asset/Prefab/Human.prefab", new Vector3(0, 0, 0), Quaternion.identity).Completed += callback => { if (callback.Status == AsyncOperationStatus.Succeeded) { _player = callback.Result; } }; } } 이렇게 Human이라는 프리펩을 불러왔는데 animator창을 열고 불러와진 Human캐릭터를 하이어라키에서 선택을하면 현재 애니메이션의 상태가 보여야하는데 이런식으로 나오는겁니다.. 이건 animatorcontroller를못불러온건가요? 아니면 addressable로 지정하면 원래 볼수없는건가요? 근데 이렇게 나오면 애니메이션 상태를 볼수없기때문에 디버깅이 너무 어려워지는데.. 제가 뭔가 잘못한게 맞겠죠?

  • C#
  • unity
술홍 댓글 2 좋아요 0 조회수 365

리액트 복습하기

해결됨

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

안녕하세요. 선생님 강의에 따라서 투두 리스트까지 완강하였는데요. 복습시 이번에 만들어본 프로젝트를 보지 않고 만들 수 있을 때까지 연습해보는 식으로 나아가면 될까요??

  • javascript
  • react
  • node.js
윤토벤 댓글 1 좋아요 0 조회수 402

사용하시는 테마가 궁금합니다

미해결

C#과 유니티, 실전 게임으로 제대로 시작하기 (저자 직강)

vs code에서 사용하시는 테마가 궁금합니다. 저는 코드위에 마우스를 얹어놓아도 해당 코드에 대한 설명(어떻게 작성해야하는지, 인수들이 뭐가 있는지)가 안뜨는데 어떤 테마로 설정해야 나올수 있나요? 참고로 파일 - hover(?)값에서 사용으로 변경해놓았는데도 코드에 대한 설명이 안나옵니다..

  • C#
  • unity
댓글 1 좋아요 0 조회수 245

default.tsx를 넣는대신 modal의 타입을 ?로 하면안되나요?

미해결

Next + React Query로 SNS 서비스 만들기

modal이 없는 상황의 오류를 해결하기위해 제로초님이 default.tsx라는 파일을 소개해줬는데요, 그냥 layout.tsx에서 애초에 Probs를 정의할때 type Probs= modal?:reactNode로 하면 안될까요?

  • react
  • next.js
  • react-query
  • next-auth
  • msw
김창훈 댓글 1 좋아요 0 조회수 248

msw patch

미해결

Next + React Query로 SNS 서비스 만들기

안녕하세요 msw patch 관련해서 여쭤보고싶은게 있습니다! 제로초님 강의를 응용해서 프로젝트에 msw로 데이터들을 테스트 하고있습니다 handler에서 /users란 엔드포인트로 get요청후 데이터들을 받아온뒤 다시 수정이 필요해 patch handler를 생성했습니다. mutation을 통해서 patch 요청은 성공한거같은데 기존의 get으로 받아온 user데이터들을 수정하고 싶다면 어떻게 할수있을지 여쭤보고싶습니다 ! const mutation = useMutation({ mutationFn: async (e: FormEvent) => { e.preventDefault(); const updatedUser = { userId: product.userId, nickName: product.nickName, userFileUrl: product.userFileUrl, techStack: product.techStack, position: product.position, employmentStatus: product.employmentStatus, year: product.year, links: product.links, alarmStatus: product.alarmStatus, content: product.content, softSkill: product.softSkill, }; fetch(`${process.env.NEXT_PUBLIC_BASE_URL}/users`, { method: "PATCH", body: JSON.stringify(updatedUser), }); }, }); import { bypass, http, HttpResponse } from "msw"; import { hotPeople, peoples, users } from "./peopleData"; export const handlers = [ http.get("/peoples/hot/:tag", () => { return HttpResponse.json(hotPeople); }), http.get("/peoples", ({ request, params }) => { return HttpResponse.json(peoples); }), http.get("/users", () => { return HttpResponse.json(users); }), http.patch("/users", async ({ request }) => { return HttpResponse.text("success?"); }), ]; export default handlers;

  • react
  • next.js
  • react-query
  • next-auth
  • msw
댓글 1 좋아요 0 조회수 217

No tests were found

미해결

스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 위처럼 join_membership하면 체크표시가 뜨고 한글로 작성하면 No tests were found라고 뜨는 이유는 뭔지 궁금합니다

  • java
  • spring
  • mvc
  • spring-boot
xorud0711 댓글 3 좋아요 0 조회수 350

로그인 모달창 새로고침 시 배경 메인 페이지 사라지는 현상

미해결

Next + React Query로 SNS 서비스 만들기

로그인 버튼을 클릭하면 우선 '/login' 주소로 이동했다가 'i/flow/login'으로 이동하기 때문에 이때 '/login'에서 배경이 메인 컴포넌트를 보여줘야 메인 페이지가 바탕이 되고로그인 모달 창을 띄운다는 점은 이해했습니다. 따라서 app/(beforeLogin)/login/page.tsx 에서 Main 컴포넌트를 보여주도록 했습니다. export default function Login() { const router = useRouter(); router.replace("/i/flow/login"); return <Main />; } 문제는 '/i/flow/login' 에서 새로고침하면 모달 창은 그대로지만 배경은 메인 페이지가 아닙니다. 이때 아래와 코드와 같이 따로 Main 컴포넌트를 불러오면 새로고침 시, 배경은 메인 페이지로 잘 나옵니다.그런데 강의와 깃허브 코드를 보니 LoginModal 컴포넌트만 보여주고 있습니다. LoginModal 컴포넌트만 있어도 app/(beforeLogin)/page.tsx에서 Main 컴포넌트를 보여주고 있으므로 app/(beforeLogin)/layout.tsx에서 Main 컴포넌트가 {children}에 할당된다고 생각했습니다. 따라서 아래 코드에서 Main 컴포넌트가 없어도 배경은 메인 페이지가 나온다고 생각했습니다. 아래 코드와 같이 Main 컴포넌트가 있으면 새로고침 시, 메인 페이지가 배경이 되고 그 위에 로그인 모달창이 띄워지지만 Main 컴포넌트가 없으면 새로고침 시, 메인 페이지가 빈 페이지가 나옵니다. 여기서 Main 컴포넌트를 넣어서 해결해도 되는건지 의문이 들었습니다. 아래 코드에서 Main 컴포넌트를 넣지 않으면 Main 페이지가 어떻게 배경으로 보여지는 건지 알고 싶습니다! import LoginModal from "@/app/(beforeLogin)/@modal/(.)i/flow/login/page"; import Main from "@/app/(beforeLogin)/_component/Main"; export default function Page() { return ( <> <LoginModal /> <Main /> </> ); }

  • react
  • next.js
  • react-query
  • next-auth
  • msw
 키키 댓글 1 좋아요 0 조회수 278

전체 회원 다 뜨는거 말고 원하는 아이디만 찾을떄 어떻게해야 할까요?

미해결

스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] <!DOCTYPE HTML> <html xmlns:th="http://www.thymeleaf.org"> <body> <div class="container"> <form action="/members/find" method="post"> <div class="form-group"> <label for="name">찾기</label> <input type="text" id="name" name="name" placeholder="이름을 입력하세요"> </div> <button type="submit">찾기버튼</button> </form> </div> <!-- /container --> </body> </html> find.html입니다. <!DOCTYPE HTML> <html xmlns:th="http://www.thymeleaf.org"> <body> <div class="container"> <div> <table> <thead> <tr> <th>#</th> <th>이름</th> </tr> </thead> <tbody> <tr th:each="member : ${members}"> <td th:text="${member.id}"></td> <td th:text="${member.name}"></td> </tr> </tbody> </table> </div> </div> <!-- /container --> </body> </html> memberfind.html 입니다 memberController.java 입니다 @GetMapping("members/find") public String find(MemberForm form) { return "members/find"; } @PostMapping("members/find") public String find(Model model) { List<Member> members = memberService.findMembers(); model.addAttribute("members", members); return "members/memberfind"; } } List<Member> members = memberService.findMembers(); 여기 부분을 List<Member> members = memberService.findOne(); 으로 바꾸어야할텐데 ()-> 여기안에 매개변수를 뭘로 해야할까요

  • java
  • spring
  • mvc
  • spring-boot
댓글 1 좋아요 0 조회수 206

인기 태그

인프런 TOP Writers

주간 인기글