문법 문제 페이지에 접속할때 initializeClickExampleAndSubmitAndAnswer액션과 getGrammarById액션이 2번씩 반복되고 있었습니다. getGrammarById는 서버에 Grammar 조회를 요청하는데, 이로인해 서버에서 동일한 grammar 조회 쿼리가 2번 발생하고 있었습니다. 원인을 파악하고자 하나의 라우터에서 순서대로 실행되는 GrammarBookPage > GrammarBookContainer > GrammarBook > GrammarContainer 컴포넌트들을 뜯어봤습니다. 자세히보니 GrammarBookPage가 매핑된 라우터의 URL로 직접 접속하거나 새로고침해도 액션들이 한 번씩 더 디스패치되고 있었습니다. GrammarBookContainer컴포넌트에..
전체 글
오류 발견 아래 코드를 테스트하던 중 LazyInitializationException이 발생했습니다. public GrammarBookResponseDto getUserWrongGrammarBook(String userName, String grammarBookName) { Long userId = getUserIdByUserName(userName); List userGrammarStatuses = this.userGrammarStatusRepository.findByUserId(userId); Long grammarBookId = this.grammarBookService.getGrammarBookIdByGrammarBookName(grammarBookName); List grammarDtos = ..
오류 발견 리액트 앱 실행시 콘솔창에 다음과 같은 오류 로그가 나타납니다. A non-serializable value was detected in an action, in the path: `register`. Value: ƒ register(key) { _pStore.dispatch({ type: _constants__WEBPACK_IMPORTED_MODULE_2__["REGISTER"], key: key }); } 오류 원인 로그만 보면redux는 state, action에 직렬화가 불가능한 값을 전달할 수 없어 발생하는 오류입니다. 하지만 기능은 정상적으로 작동합니다. 더 찾아본 결과, redux-persist의 고유 문제인것 같습니다. non-serializable value error · Is..
문제 상황현재 Grammar와 GrammarBook를 N:1 양방향 연관관계로 설정한 상태입니다. 그래서 GrammarBook에 다음과 같이 mappedBy 설정으로 GrammarBook은 연관관계의 주인이 아님을 명시해뒀습니다.@OneToMany(mappedBy = "grammarBook", cascade = CascadeType.ALL) @OrderColumn(name = "id") private List grammars = new ArrayList();그리고 GrammarBook엔티티 객체에서 grammars로 size()를 호출하니 수많은 Grammar엔티티 값과 함께 수많은 null값이 채워져 반환되었습니다. [null, null, null, null, null, null, null, null,..
UserGrammarStatus와 SiteUser는 N : 1 단방향 연관 관계를 맺고 있습니다.UserGrammarStatus 엔티티에서 referencedColumnName = "user_name"를 지정해주어 SiteUser 테이블의 userName 컬럼을 참조하게 했습니다.//UserGrammarStatus ... @ManyToOne @JoinColumn(name = "user_name", referencedColumnName = "user_name") private SiteUser user; ...그리고 userName값으로 UserGrammarStatus를 조회하는 JPQL을 직접 작성했습니다.//UserGrammarStatusRepository ... @Query("select ugs fro..
문제 상황 GrammarBook 엔티티 한 개를 조회할때 Grammar를 fetch join하고 Grammar안에서 GrammarExample도 fetch join하는 한 방 쿼리를 JPQL로 작성했습니다. //GrammarBookRepository.java @Query("select gb from GrammarBook gb join fetch gb.grammars g join fetch g.examples where gb.id = :id") Optional findGrammarBookById(@Param("id") Long id); 위 JPQL을 사용한 서비스 메서드를 테스트했더니 org.hibernate.loader.MultipleBagFetchException: cannot simultaneousl..
리액트와 스프링부트를 통합 빌드했기 때문에 스프링부트 테스트 시 항상 리액트 앱을 빌드했습니다. 이때문에 빌드 시간이 너무 오래 걸려 간단한 테스트에도 시간을 많이 뺐겼습니다. 그래서 build.gradle에 테스트할때만 리액트 앱을 빌드하지 않도록 설정을 추가했습니다.//build.gradle ... //테스트할때만 리액트 앱 빌드 안함 def skipReactBuild = project.hasProperty('skipReactBuild') tasks.matching { it.name in ['installReact', 'buildReact', 'copyReactBuildFiles'] }.configureEach { onlyIf { !project.hasProperty('skipReactBuild') ..
무슨 오류인가?리액트가 통합된 스프링부트 애플리케이션을 실행하고, 리액트에서 설정한 Route로 웹페이지 이동 후, 새로고침하면 Whitelabel Error Page가 뜸아래 오류는 http://localhost:8080/grammar로 접속후 새로고침시 나타난 오류Whitelabel Error Page This application has no explicit mapping for /error, so you are seeing this as a fallback. Fri Jan 19 00:01:16 KST 2024 There was an unexpected error (type=Not Found, status=404). No static resource grammar. ...오류 발생 원인 분석개발 단..
리액트를 공부하며 애플 홈페이지의 아이폰15 소개 페이지를 따라 만드는 중이다.애플에는 글자가 특정 스크롤 위치에 반응하며 fade in되는 애니메이션이 있다.아래 글을 참고해(+뤼튼) 스크롤시 특정 위치에서 fade in되도록 만들었다.https://shylog.com/react-custom-hooks-scroll-animation-fadein/ React Custom Hooks로 scroll animation 만들기 FadeIn편 | 수줍은 동그래 블로그해당 글은 김주성님의 세미나를 듣고 작성한 글 입니다. React Custom Hooks로 scroll animation 만들기 FadeIn편 작년에 React Hooks이 정식 릴리즈 된 이후 많은 사람들이 Hooks을 사용하고 있습니다. Hooks..
열거 타입(enumeration type)열거 타입(enumeration type)enum의 간단한 사용법만 소개합니다.한정된 값인 열거 상수(enumeration constant)중에서 하나의 상수를 저장하는 타입public enum 열거타입이름 {열거상수,...} 열거타입 변수 = 열거타입.열거상수; Week today = Week.SATURDAY; // today변수와 Week.SATURDAY변수는 같은 Week객체 참조 Week birthday = null;열거 타입을 선언하려면 열거 타입 이름으로 .java 소스 파일 생성해야함열거 타입의 이름은 첫글자 대문자열거 상수는 모두 대문자 또는 여러 단어일경우 _로 연결, 각 열거 상수는 객체이므로 열거 객체들의 필드 값은 열거 상수의 문자열임열거 타..