월 15,400원
5개월 할부 시다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 해결됨코드로 배우는 React with 스프링부트 API서버
이동한 페이지 번호가 회색 색상으로 변하지 않습니다 ㅠ
데이터는 정상적으로 가져와지고 있습니다. 하지만 선택된 페이지 번호가 회색으로 변경이 안되고 있는데, 어느 부분이 문제인지 모르겠습니다...PageComponent.js 에서 선택된 페이지 번호에 회색을 부여하는 것으로 알고 있는데, 왜 안되는 걸까요..? 아래는 PageComponent.js 코드입니다. 강의 내용과 피피티와 코드가 동일합니다.import React from 'react'; function PageComponent({serverData, movePage}) { // serverData.prev, pageNumList, next return ( <div className="m-6 flex justify-center"> {serverData.prev ? <div className="m-2 p-2 w-16 text-center font-bold text-blue-400 " onClick={() => movePage({page: serverData.prevPage})}> Prev </div> : <></>} {serverData.pageNumList.map(pageNum => <div key={pageNum} className={`m-2 p-2 w-12 text-center rounded shadow-md text-white ${serverData.current === pageNum ? 'bg-gray-500' : 'bg-blue-400'}`} onClick={() => movePage({page: pageNum})}> {pageNum} </div> )} {serverData.next ? <div className="m-2 p-2 w-16 text-center font-bold text-blue-400" onClick={() => movePage({page: serverData.nextPage})}> Next </div> : <></>} </div> ); } export default PageComponent; 그리고 콘솔창에서 다음과 같은 경고창이 뜨는데 가장 좋은 해결 방법에 대해 알 수 있을까요?이 문제는 해결됐습니다! 제가 ListComponent.js 파일 안에서 div 태그 안의 key 속성에 todo.tno 를 큰따옴표로 묶은 오타였습니다.
- 해결됨코드로 배우는 React with 스프링부트 API서버
PageResponseDTO 생성자의 매개변수 변수명에 관련된 질문
안녕하세요.현재 섹션 4 서비스계층 - 상품 목록 처리 강의 7분 44초 진행중 문제가 생겨 질문 드려요.제 코드에서는 totalCount 를 사용하지 못하는데, 선생님 강의에서는 totalCount 로 사용 하셨더라구요. 기존의 섹션2 - 페이지처리를 위한 DTO설계 14분 56초 부분에서는 매개변수 명을 total 로 작성 해주셨는데 매개변수 명을 totalCount 로 작성하면 해결 되는건가요??
- 미해결코드로 배우는 React with 스프링부트 API서버
QTodo Class Not found
2024-04-18T17:27:21.633+09:00 ERROR 19504 --- [apiserver] [nio-8080-exec-2] o.a.c.c.C.[.[.[/].[dispatcherServlet] : Servlet.service() for servlet [dispatcherServlet] in context with path [] threw exception [Request processing failed: java.lang.RuntimeException: java.lang.NoClassDefFoundError: org/zerock/apiserver/domain/QTodo] with root causejava.lang.ClassNotFoundException: org.zerock.apiserver.domain.QTodo at java.base/jdk.internal.loader.BuiltinClassLoader.loadClass(BuiltinClassLoader.java:641) ~[na:na] at java.base/jdk.internal.loader.ClassLoaders$AppClassLoader.loadClass(ClassLoaders.java:188) ~[na:na] at java.base/java.lang.ClassLoader.loadClass(ClassLoader.java:525) ~[na:na]package org.zerock.apiserver.repository.search; import com.querydsl.jpa.JPQLQuery; import lombok.extern.log4j.Log4j2; import org.springframework.data.domain.*; import org.springframework.data.jpa.repository.support.QuerydslRepositorySupport; import org.zerock.apiserver.domain.QTodo; import org.zerock.apiserver.domain.Todo; import org.zerock.apiserver.dto.PageRequestDTO; import java.util.List; @Log4j2 public class TodoSearchImpl extends QuerydslRepositorySupport implements TodoSearch { public TodoSearchImpl() { super(Todo.class); } @Override public Page<Todo> search1(PageRequestDTO pageRequestDTO) { log.info("search1........................"); QTodo todo = QTodo.todo; JPQLQuery<Todo> query = from(todo); query.where(todo.title.contains("")); Pageable pageable = PageRequest.of( pageRequestDTO.getPage() - 1, pageRequestDTO.getSize(), Sort.by("tno").descending()); this.getQuerydsl().applyPagination(pageable, query); List<Todo> list = query.fetch(); // 목록 데이터 long total = query.fetchCount(); return new PageImpl<>(list, pageable, total); } } 코드는 잘 따라 친거같은데 getList() 할때마다 QTodo 클래스를 못찾는다고 요류가 뜨네요.... 어떻게 해결할 수 있을까요?
- 미해결코드로 배우는 React with 스프링부트 API서버
섹션2 강의에 RootConfig와 ModelMapper과 관련된 내용은 없나요?
안녕하세요. 섹션2 RootConfig라는 클래스가 없다가 마지막 강의에서 보이던데 아무 언급이 없어서 질문 드립니다. 섹션2 pdf에는 RootConfig와 ModelMapper에 대해 언급되어 있던데 거기 있는 내용만 보고 넘어가면 되나요?
- 미해결코드로 배우는 React with 스프링부트 API서버
2장 router ch02_start폴더를 따로 만들고 시작해야 하는건가요?
2장 보는데 ch02_start 폴더를 하나 생성하고 시작하신건가요..???
- 해결됨코드로 배우는 React with 스프링부트 API서버
섹션7에 이름 없는 강의가 2개 있는데 오류인가요?
눌러봐도 강의 재생이 되진 않네요.
- 미해결코드로 배우는 React with 스프링부트 API서버
github 링크
화면 html 소스 같은 것들 때문에 github 주소는 없나요?
- 미해결코드로 배우는 React with 스프링부트 API서버
섹션 8 학습 자료 질문
섹션 8의 학습 자료를 다운 받고 압축을 풀면위 사진처럼 파일들이 구성되어 있는데요. 별도의 PDF 파일은 없는건가요?
- 미해결코드로 배우는 React with 스프링부트 API서버
장바구니 컨트롤러 처리 @PreAuthorize 부분 오류
@PreAuthorize("(#itemDTO.email == authentication.name)") @PostMapping("/change") public List<CartItemListDTO> changeCart(@RequestBody(required = true) CartItemDTO itemDTO) { log.info("itemDTO : {}", itemDTO); if (itemDTO.getQuantity() <= 0) { return cartService.remove(itemDTO.getCino()); } return cartService.addOrModify(itemDTO); }위코드에서 #ItemDTo 값이 null 설정되는것같습니다.아무리 찿아봐도 원일을 알수없는데 확인좀 부탁드릴수 있을까요? 우선 오류로그는 아래와 같습니다.jakarta.servlet.ServletException: Request processing failed: java.lang.IllegalArgumentException: Failed to evaluate expression '(#itemDTO.email == authentication.name)' at org.springframework.web.servlet.FrameworkServlet.processRequest(FrameworkServlet.java:1022) ~[spring-webmvc-6.1.5.jar:6.1.5] at org.springframework.web.servlet.FrameworkServlet.doPost(FrameworkServlet.java:914) ~[spring-webmvc-6.1.5.jar:6.1.5] Caused by: java.lang.IllegalArgumentException: Failed to evaluate expression '(#itemDTO.email == authentication.name)' Caused by: org.springframework.expression.spel.SpelEvaluationException: EL1007E: Property or field 'email' cannot be found on null at org.springframework.expression.spel.ast.PropertyOrFieldReference.readProperty(PropertyOrFieldReference.java:224) ~[spring-expression-6.1.5.jar:6.1.5] at org.springframework.expression.spel.ast.PropertyOrFieldReference.getValueInternal(PropertyOrFieldReference.java:111) ~[spring-expression-6.1.5.jar:6.1.5] at org.springframework.expression.spel.ast.PropertyOrFieldReference$AccessorValueRef.getValue(PropertyOrFieldReference.java:416) ~[spring-expression-6.1.5.jar:6.1.5] at org.springframework.expression.spel.ast.CompoundExpression.getValueInternal(CompoundExpression.java:98) ~[spring-expression-6.1.5.jar:6.1.5] at org.springframework.expression.spel.ast.OpEQ.getValueInternal(OpEQ.java:42) ~[spring-expression-6.1.5.jar:6.1.5] at org.springframework.expression.spel.ast.OpEQ.getValueInternal(OpEQ.java:32) ~[spring-expression-6.1.5.jar:6.1.5] at org.springframework.expression.spel.ast.SpelNodeImpl.getTypedValue(SpelNodeImpl.java:119) ~[spring-expression-6.1.5.jar:6.1.5] at org.springframework.expression.spel.standard.SpelExpression.getValue(SpelExpression.java:309) ~[spring-expression-6.1.5.jar:6.1.5] at org.springframework.security.access.expression.ExpressionUtils.evaluateAsBoolean(ExpressionUtils.java:30) ~[spring-security-core-6.2.3.jar:6.2.3]
- 미해결코드로 배우는 React with 스프링부트 API서버
궁금한점 있습니다 !
안녕하세요 강사님 !!리액트 + 스프링부트 웹개발 강의이지만스터디용으로리액트 네이티브에서 해당 스프링부트 어플리케이션 API 를 활용해도 되는 부분인가요???
- 미해결코드로 배우는 React with 스프링부트 API서버
테일윈드css사용할때
어떤 클래스명이 어떤 css에 해당하는지를 일부내용들은 암기하고 사용하시는건지 궁금합니다! 그냥 사용하다보면 저절로 외워지는건가요?그리고 강의내용과는 별개로 현업에서 디자인같은 부분은 피그마를 많이 사용하는듯 하는데 피그마로 디자인한것을 코드로 변환하는 과정이 어떻게 이루어지나요?피그마 자체기능으로 html코드로 변환한다음에 이걸 잘 가공?해서 프론트코드로 만들어내는건지 아니면 그냥 피그마 이미지만 보고 클론코딩하는것처럼 코드를 작성하는건지 궁금합니다
- 미해결코드로 배우는 React with 스프링부트 API서버
노란색 경고글을 없애고 싶어요..
프론트 부분에서 ESLint 때문에 계속 에러를 겪고 있는데요,,해결했다 싶으면 신기하게도 다음번 컴퓨터를 키면 또 에러가 생겨있고 그러는데요,빨간색 에러는 없앴는데 노란색 경고글도 없애고 싶습니다.아래 노란색 경고글들도 없앨수 있는 방법이 있을까요...에러때문에 이것저것 시도하다가 뭔가 버전이 안맞는 걸까요...
- 미해결코드로 배우는 React with 스프링부트 API서버
repository에 ProductSearch랑 Impl을 작성하셧는데
섹션2 영상에선 TodoSearch랑 TodoSearchImpl 작성한건 어떻게 해야하나요 Todo 삭제하고 이번 수업에 있는 ProductSearch, ProductSearchImpl로 다 바꿔야 하는건가요 ?
- 미해결코드로 배우는 React with 스프링부트 API서버
npm start 하면 발생되는 에러 메시지
(node:8952) [DEP_WEBPACK_DEV_SERVER_ON_AFTER_SETUP_MIDDLEWARE] DeprecationWarning: 'onAfterSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option. (Use `node --trace-deprecation ...` to show where the warning was created) (node:8952) [DEP_WEBPACK_DEV_SERVER_ON_BEFORE_SETUP_MIDDLEWARE] DeprecationWarning: 'onBeforeSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option. 리액트 실행이랑 강의 내용대로 정상적으로 동작 되는데, npm start 를 수행하면 위와 같은 문구가 출력됩니다. 구글에 검색해봤는데 해결 방법과 원인이 다양해서 적합한 해결책을 못찾았습니다. 무시해도 되는 에러일까요? 어떻게 처리하는지 궁금합니다.
- 미해결코드로 배우는 React with 스프링부트 API서버
TypeError: Cannot read properties of undefined (reading 'map')에 대한 문제
크롬에서의 문제입니다웹스톰 내에서는 또 다른 문제가 있다고 하네용 import { useEffect, useState } from "react"; import { getList } from "../../api/productsApi"; import useCustomMove from "../../hooks/useCustomMove"; import FetchingModal from "../common/FetchingModal"; import { API_SERVER_HOST } from "../../api/todoApi"; import PageComponent from "../common/PageComponent"; import useCustomLogin from "../../hooks/useCustomLogin"; const host = API_SERVER_HOST const initState= { dtoList:[], pageNumList:[], pageRequestDTO: null, prev: false, next: false, totalCount: 0, prevPage: 0, nextPage: 0, totalPage: 0, current: 0 } const ListComponent = (props) => { const {page, size, refresh, moveToList, moveToRead} = useCustomMove() const {exceptionHandle} = useCustomLogin() //serverData는 나중에 사용 const [serverData, setServerData] = useState(initState) //for FetchingModal const [fetching, setFetching] = useState(false) useEffect(() => { setFetching(true) getList({page,size}).then(data => { console.log(data); if(data && data.dtoList){ setServerData(data); } setFetching(false); }).catch( err => exceptionHandle(err)) }, [page,size, refresh]) return ( <div className={"border-2 border-blue-100 mt-10 mr-2 ml-2"}> {fetching ? <FetchingModal/> :<></>} <div className="flex flex-wrap mx-auto p-6"> {serverData.dtoList && 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> <PageComponent serverData={serverData} movePage={moveToList}></PageComponent> </div> ); } export default ListComponent;Listcomponent에 문제가 있다고 해서 찾아보려고 하는데 어떻게 봐도 모르겠습니다ㅜㅜ 누구든 도와주세요
- 미해결코드로 배우는 React with 스프링부트 API서버
소셜로그인시 이메일 중복 관련 처리 문의
소셜로그인 강의까지 봤는데요,강의에 있는 프로세스는소셜로그인시 이메일을 가져와서 DB에 저장이 되어있지 않으면 카카오이메일로 회원가입을 시키고, DB에 저장이 되어있으면 비밀번호 없이 해당 계정으로 로그인이 되게끔 만드는 프로세스로 이해 했습니다.그런데, 기존에 회원가입을 하지 않은 사람이 소셜로그인을 할 때 이미 기존에 가입되어 있는 이메일이 있다면 다른사람 계정을 비밀번호 없이 로그인 할 수 있게되는게 지금 구현한 상황에서는 맞는거죠? ex) 기존에 회원가입한 'A' 의 이메일이 test@AAA.com 일 때신규 유입된 사람 'B'의 카카오계정 이메일이 test@AAA.com 인 경우 위와 같은 경우를 방지하려면 소셜로그인시(최초로그인) 회원가입을 시킬 때 이메일 중복체크를 하고 중복되어있다면 다른 이메일 사용을 권유 해야되는식으로 처리를 해야 하는건가요?
- 미해결코드로 배우는 React with 스프링부트 API서버
Section 8 소셜 로그인 API 서버 인코딩 관련 문의드립니다.
위 코드는 수업중 진행하신 MemberServiceImpl.java 파일의 getEmailFromKakaoAccessToken 메소드의 일부입니다. 저기에서 마지막에 bodyMap 을 로그로 확인하는 부분이 있는데 위와 같이 nickname 을 보면 인코딩이 깨져서 나옵니다.저 nickname 을 확인하려면 어떻게 해야하나요?
- 미해결코드로 배우는 React with 스프링부트 API서버
챕터 8 카카오 토큰 받기 이후
카카오 토큰 받기 이후로 많은 오류가 한번에 떠서 질문 드립니다!부트 서버에서도 member.service, impl에 콘솔 찍은것도 에러로 인해 안뜹니다상황마다 500오류 400오류 grant value 오류 등이 계속 뜹니다 ㅜㅜ 부트https://github.com/hyeonbin03/IntelliJHub일단 부트 코드는 선생님 주셨던 파일 참고해서 Member Modify 기능까지 작성 완료 된 상태입니다 리엑트https://github.com/hyeonbin03/WebStromHub깃 주소 남겨드겠습니다 ㅠㅠ
- 미해결코드로 배우는 React with 스프링부트 API서버
jwt 10분 유효기간 끝나면 apiServer 쪽에서 Expired Exception 발생
jwt 10분 유효기간 끝난 상황에서jwtAxios를 이용해서 products 를 호출하면 JWTCheckFilter를 걸쳐서 validateToken 메서드를 호출하고 거기서 Exired Exception 이 납니다. accessToken 이 유효시간(10분)이 경과하였으면refreshToken 으로 교체되는 걸로 강의내용을 인지했었는데요. 제가 어디서 놓친건지 잘 모르겠네요 ㅠ react쪽에서 beforeReq 쪽에서 결국 expired 처리가되고brforeRes 에서 뭔가 유효기간이 끝났으면/api/member/refresh 를 호출해야될 것 같은데 예제 소스 잘 따라한거 filter에서 먼저 유효기간이 만료되어 exception 부터 호출되어 더이상 진행이 안되네요. 어디가 정확히 문제인지 모르겠네요.jwtUtil.js 는 제공해주신 소스는 오타가 있을까봐 동일하게 ctrl+c , v 도 했습니다. JWTUtil.java 일부분 public static Map<String, Object> validateToken(String token) { Map<String, Object> claim = null; try { SecretKey key = Keys.hmacShaKeyFor(JWTUtil.key.getBytes("UTF-8")); claim = Jwts.parserBuilder() .setSigningKey(key) .build() .parseClaimsJws(token) // 파싱 및 검증, 실패 시 에러 .getBody(); } catch (MalformedJwtException malformedJwtException) { throw new CustomJWTException("MalFormed"); } catch (ExpiredJwtException expiredJwtException) { throw new CustomJWTException("Expired"); } catch (InvalidClaimException invalidClaimException) { throw new CustomJWTException("Invalid"); } catch (JwtException jwtException) { throw new CustomJWTException("JWTError"); } catch (Exception e) { throw new CustomJWTException("Error"); } return claim; }
- 미해결코드로 배우는 React with 스프링부트 API서버
챕터 5 모달 처리 | Add 클릭 이후 모달창이 안떠요
모달창이 안떠서 settimeout으로 처리 하니Modal에 result 값이 true로 적용됩니다코드는 깃으로 올리겠습니다 선생님 강의에 올라와있는 ch06 파일 코드 넣어서 해봐도모달창이 안뜨네요 ㅜㅜ https://github.com/hyeonbin03/webstromhub