안녕하세요 Next.js 강의를 잘 보고 있습니다. Next.js 장단점 내용을 보고 궁금한 점이 생겨서 질문드립니다. 1. 8:59초에 서버에서 모든 컴포넌트를 사전 렌더링을 한다고 말씀하셨는데, 작성한 모든 컴포넌트 의 HTML을 서버에 생성해놓는다는 의미인가요? 그렇다면 그 HTML을 받아서 브라우저가 파싱할 때, 서버로부터 받는 스크립트는 해당 컴포넌트의 관련된 로직의 js 파일을 받아오는건가요? 이 동작까지 Next.js에서 담당해주는건가요..? 사용자의 접속 요청이 들어왔을 때, FCP는 빠르겠지만 이 과정에서 서버에서 모든 컴포넌트의 사전 렌더링이 진행되고, 하이드레이션 과정까지 있습니다. 전처리 작업은 늘어난 것 같고, 사용자의 인터렉션이 불가한 지점까지 있는데 이 부분은 어떻게 핸들링하는지와 과연 FCP가 단축된게 장점이라고 할 수 있는지 궁금합니다. 해소가 안되는 부분들이 계속 생기는데, 영상을 계속 보다보면 뒤에서 다 설명을 해주시는 부분들일까요...?
> Task :test FAILED FAILURE: Build failed with an exception. * What went wrong: Execution failed for task ':test'. > There were failing tests. See the report at: file:///C:/Spring_kyh/%EC%8A%A4%ED%94%84%EB%A7%81%20%EB%B6%80%ED%8A%B8%EC%99%80%20JPA%20%ED%99%9C%E C%9A%A91/jpashop/build/reports/tests/test/index.html * Try: > Run with --scan to get full insights. BUILD FAILED in 4s 8 actionable tasks: 8 executed 다른 질문들 찾아보다가 https://www.inflearn.com/community/questions/1251256/gradlew-%EB%B9%8C%EB%93%9C%EA%B0%80-%EA%B3%84%EC%86%8D-%EC%8B%A4%ED%8C%A8%EB%A1%9C-%EB%9C%B9%EB%8B%88%EB%8B%A4?focusComment=336001 이 답변을 보고 gradle도 8.5로 바꿔봤는데 똑같은 오류가 발생해 질문드립니다. 환경변수도 제대로 설정했는데도 똑같은 증상이 발생합니다
@ExtendWith(SpringExtension.class) @SpringBootTest class MemberRepositoryTest { @Autowired MemberRepository memberRepository; @Test @Transactional public void testMember() throws Exception { //given Member member = new Member(); member.setUsername("memberA"); //when Long saveId = memberRepository.save(member); Member findMember = memberRepository.find(saveId); //then Assertions.assertThat(findMember.getId()).isEqualTo(member.getId()); Assertions.assertThat(findMember.getUsername()).isEqualTo(member.getUsername()); } 2024-08-27T08:46:11.488+09:00 INFO 20440 --- [ Test worker] com.zaxxer.hikari.HikariDataSource : HikariPool-1 - Starting... 2024-08-27T08:46:11.607+09:00 INFO 20440 --- [ Test worker] com.zaxxer.hikari.pool.HikariPool : HikariPool-1 - Added connection conn0: url=jdbc:h2:tcp://localhost/~/jpashop user=SA 2024-08-27T08:46:11.610+09:00 INFO 20440 --- [ Test worker] com.zaxxer.hikari.HikariDataSource : HikariPool-1 - Start completed. 2024-08-27T08:46:12.826+09:00 INFO 20440 --- [ Test worker] o.h.e.t.j.p.i.JtaPlatformInitiator : HHH000489: No JTA platform available (set 'hibernate.transaction.jta.platform' to enable JTA platform integration) 2024-08-27T08:46:12.846+09:00 DEBUG 20440 --- [ Test worker] org.hibernate.SQL : drop table if exists member cascade 2024-08-27T08:46:12.853+09:00 DEBUG 20440 --- [ Test worker] org.hibernate.SQL : drop sequence if exists member_seq 2024-08-27T08:46:12.860+09:00 DEBUG 20440 --- [ Test worker] org.hibernate.SQL : create sequence member_seq start with 1 increment by 50 2024-08-27T08:46:12.866+09:00 DEBUG 20440 --- [ Test worker] org.hibernate.SQL : create table member ( id bigint not null, username varchar(255), primary key (id) ) 2024-08-27T08:46:12.872+09:00 INFO 20440 --- [ Test worker] j.LocalContainerEntityManagerFactoryBean : Initialized JPA EntityManagerFactory for persistence unit 'default' 2024-08-27T08:46:13.228+09:00 WARN 20440 --- [ Test worker] JpaBaseConfiguration$JpaWebConfiguration : spring.jpa.open-in-view is enabled by default. Therefore, database queries may be performed during view rendering. Explicitly configure spring.jpa.open-in-view to disable this warning 2024-08-27T08:46:13.272+09:00 INFO 20440 --- [ Test worker] o.s.b.a.w.s.WelcomePageHandlerMapping : Adding welcome page: class path resource [static/index.html] 2024-08-27T08:46:13.987+09:00 INFO 20440 --- [ Test worker] jpabook.jpashop.MemberRepositoryTest : Started MemberRepositoryTest in 6.47 seconds (process running for 8.794) WARNING: A Java agent has been loaded dynamically (C:\gradle\caches\modules-2\files-2.1\net.bytebuddy\byte-buddy-agent\1.14.19\154da3a65b4f4a909d3e5bdec55d1b2b4cbb6ce1\byte-buddy-agent-1.14.19.jar) WARNING: If a serviceability tool is in use, please run with -XX:+EnableDynamicAgentLoading to hide this warning WARNING: If a serviceability tool is not in use, please run with -Djdk.instrument.traceUsage for more information WARNING: Dynamic loading of agents will be disallowed by default in a future release 2024-08-27T08:46:14.774+09:00 DEBUG 20440 --- [ Test worker] org.hibernate.SQL : select next value for member_seq Java HotSpot(TM) 64-Bit Server VM warning: Sharing is only supported for boot loader classes because bootstrap classpath has been appended 2024-08-27T08:46:14.914+09:00 INFO 20440 --- [ionShutdownHook] j.LocalContainerEntityManagerFactoryBean : Closing JPA EntityManagerFactory for persistence unit 'default' 2024-08-27T08:46:14.918+09:00 INFO 20440 --- [ionShutdownHook] com.zaxxer.hikari.HikariDataSource : HikariPool-1 - Shutdown initiated... 2024-08-27T08:46:14.933+09:00 INFO 20440 --- [ionShutdownHook] com.zaxxer.hikari.HikariDataSource : HikariPool-1 - Shutdown completed. > Task :test BUILD SUCCESSFUL in 26s 4 actionable tasks: 1 executed, 3 up-to-date 오전 8:46:15: Execution finished ':test --tests "jpabook.jpashop.MemberRepositoryTest.testMember"'. Transactional 애노테이션을 붙였는데 롤백얘기가 안보이네요... JUnit5로 해서 차이가 있는걸까요?
저의 경우 client sql 버전이 안맞다고 나옵니다 workbench는 8.0 Mysql 9.0 Configurator로 설치했습니다 stackoveflow에서 찾아보니 ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY 'password'; Where root as your user localhost as your URL and password as your password Then run this query to refresh privileges: flush privileges; Try connecting using node after you do so. If that doesn't work, try it without @'localhost' part. 이런 답변이 있는데 어떻게 적용하는지 알 수 있을까요?
리포지토리 계층에서 모든 데이터 액세스 기술에서 발생하는 예외는 DataAccessException으로 랩핑되어서 던져진다고 말씀하셨는데 받는 쪽인 서비스 계층에서는 DataAccessException의 서브클래스 타입의 예외를 받게 될거 같은데요. 서비스 계층에서 받게 되는 예외가 예를 들어 DuplicateKeyException이라서 처리를 하게 된다면 서비스 계층은 특정 리포지토리의 예외에 종속적이게 될거 같습니다. 그래서 컨트롤러 단으로 예외를 넘겨 ExceptionHandler로 처리해주는 것이 좋은 방법일까?에 대해서 질문 드리고 싶습니다. 근데 만약 서비스 계층에서 처리한다면, // @Service 안에 있는 있는 일부 코드 (회원가입 로직) public boolean saveCustJoinInfo(UserDto userDto) { String pwd1 = userDto.getPwd().split(",")[0]; String password = passwordEncoder.encode(pwd1); userDto.setPwd(password); try { userDao.insertUser(userDto); return true; } catch (DataAccessException e) { return false; } } 이렇게 처리해도 문제가 없는가에 대해 궁금합니다. 예외 처리에 대한 여러 블로그들을 읽어봤는데 다수의 사람들이 사용자 정의 예외클래스를 정의해서 던지도록 한 이유도 궁금합니다. 만약 이 방법이 좋지 않다면 어떤 계층에서 처리하면 특정 계층이 기술에 종속적이지 않게 예외를 처리할 수 있는지 조언해 주시면 감사하겠습니다. 토비님의 스프링 강의를 일주일 만에 완강했는데 너무 좋은 강의라 부트 강의도 구매하였습니다ㅎㅎ 아키텍처에 대한 강의도 고려하시고 있다고 하셨는데 기다리고 있겠습니다!!
안녕하세요 선생님! 해당 수업에서 On-Demand-ISR을 적용하기 위해 page/api/revalidate.ts 파일에 재 생성을 요청하는 handler 함수를 정의를 했습니다. // 강의에서 작성한 handler 코드 export default async function handler( req: NextApiRequest, res: NextApiResponse ) { try { // 인덱스 페이지를 요청받을 때 revalidate 되도록 하기 await res.revalidate("/"); // 재 생성이 잘 완료되었다는 걸 리턴함 return res.json({ revalidate: true }); } catch (err) { // 재생성 실패 했을 떄 실행할 코드 res.status(500).send("실패"); console.error(err); } } 현재 강의에서는 직접 localhost:3000/api/revalidate 를 입력해 수동으로 페이지를 재 생성했는데, 만약 인덱스 페이지 접속할 때마다 자동으로 페이지를 재 생성하고 싶으면 useEffect 훅을 사용하면 될까요? 아래는 제가 작성한 코드입니다! useEffect(() => { fetch("/api/revalidate") .then((res) => res.json()) .then((data) => { if (data.revalidate) { console.log("페이지가 성공적으로 재생 성되었습니다."); } }); }, []);
========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예/아니오) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오) [질문 내용] 안녕하세요, 해당 static 폴더에 index.html파일에 코드를 입력한후 서버 실행결과 whilelabel 에러가 뜹니다. 해결에 도움을 주시면 감사하겠습니다.. 콘솔 내용 :: Spring Boot :: (v3.3.3) 2024-08-26T17:27:55.146+09:00 INFO 4895 --- [ main] h.hello_spring.HelloSpringApplication : Starting HelloSpringApplication using Java 17.0.12 with PID 4895 (/Users/kipyo/Documents/스프링/hello-spring/out/production/classes started by kipyo in /Users/kipyo/Documents/스프링/hello-spring) 2024-08-26T17:27:55.148+09:00 INFO 4895 --- [ main] h.hello_spring.HelloSpringApplication : No active profile set, falling back to 1 default profile: "default" 2024-08-26T17:27:55.573+09:00 INFO 4895 --- [ main] o.s.b.w.embedded.tomcat.TomcatWebServer : Tomcat initialized with port 8080 (http) 2024-08-26T17:27:55.580+09:00 INFO 4895 --- [ main] o.apache.catalina.core.StandardService : Starting service [Tomcat] 2024-08-26T17:27:55.580+09:00 INFO 4895 --- [ main] o.apache.catalina.core.StandardEngine : Starting Servlet engine: [Apache Tomcat/10.1.28] 2024-08-26T17:27:55.606+09:00 INFO 4895 --- [ main] o.a.c.c.C.[Tomcat].[localhost].[/] : Initializing Spring embedded WebApplicationContext 2024-08-26T17:27:55.607+09:00 INFO 4895 --- [ main] w.s.c.ServletWebServerApplicationContext : Root WebApplicationContext: initialization completed in 433 ms 2024-08-26T17:27:55.743+09:00 WARN 4895 --- [ main] ion$DefaultTemplateResolverConfiguration : Cannot find template location: classpath:/templates/ (please add some templates, check your Thymeleaf configuration, or set spring.thymeleaf.check-template-location=false) 2024-08-26T17:27:55.768+09:00 INFO 4895 --- [ main] o.s.b.w.embedded.tomcat.TomcatWebServer : Tomcat started on port 8080 (http) with context path '/' 2024-08-26T17:27:55.772+09:00 INFO 4895 --- [ main] h.hello_spring.HelloSpringApplication : Started HelloSpringApplication in 0.793 seconds (process running for 0.952)
app.use('/', express.static(path.join(__dirname, 'public'))); 다른 코드들에서는 이런 식으로 경로를 지정하면 경로와 똑같은 요청만 처리를 하거나 모든 요청에 대해 처리하고 싶으면 그냥 경로를 생략하였는데 express.static은 왜 localhost:3000/ 에 대한 요청만 받아들이는 것이 아니라, 모든 요청에 대해 해당 파일이 있는지 확인하게 되는지 궁금합니다. 예시) localhost:3000/about -> public 폴더 안에 about 파일이 있는지 찾음 localhost:3000/hello.css -> public 폴더 안에 hello.css 파일이 있는지 찾음 express.static은 특별한 미들웨어 인가요?
첫번째 JPQL Query("select m from Member m join m.team ") List<Member> findInnerJoin(); @Test public void test() { Team teamA = new Team("teamA"); Team teamB = new Team("teamB"); teamRepository.save(teamA); teamRepository.save(teamB); Member member1 = new Member(10, "member1", teamA); Member member2 = new Member(10, "member2", teamB); memberRepository.save(member1); memberRepository.save(member2); em.flush(); em.clear(); List<Member> members = memberRepository.findInnerJoin(); for (Member member : members) { System.out.println("member = " + member); System.out.println("member.getTeam().getClass() = " + member.getTeam().getClass()); System.out.println("member.getTeam().getName() = " + member.getTeam().getName()); } } 실행결과 Hibernate: select m1_0.member_id, m1_0.age, m1_0.team_id, m1_0.username from member m1_0 join team t1_0 on t1_0.team_id=m1_0.team_id member = Member(id=1, username=member1, age=10) member.getTeam().getClass() = class study.data_jpa.entity.Team$HibernateProxy$w0d2fXxq Hibernate: select t1_0.team_id, t1_0.name from team t1_0 where t1_0.team_id=? member.getTeam().getName() = teamA member = Member(id=2, username=member2, age=10) member.getTeam().getClass() = class study.data_jpa.entity.Team$HibernateProxy$w0d2fXxq Hibernate: select t1_0.team_id, t1_0.name from team t1_0 where t1_0.team_id=? member.getTeam().getName() = teamB 첫번째 JPQL에서는 전형적인 N + 1 문제가 발생함을 알 수 있습니다. 그래서 첫번째 JPQL에서의 select문에 t만 추가를 해봤습니다. 두번째 JPQL @Query("select m, t from Member m join m.team t") List<Member> findInnerJoin(); 실행결과 Hibernate: select m1_0.member_id, m1_0.age, m1_0.team_id, m1_0.username, t1_0.team_id, t1_0.name from member m1_0 join team t1_0 on t1_0.team_id=m1_0.team_id member = Member(id=1, username=member1, age=10) member.getTeam().getClass() = class study.data_jpa.entity.Team member.getTeam().getName() = teamA member = Member(id=2, username=member2, age=10) member.getTeam().getClass() = class study.data_jpa.entity.Team member.getTeam().getName() = teamB 위 실행 결과를 보고 페치 조인과 무슨 차이가 있을까 해서 페치 조인을 테스트 해봤습니다. 세번째 JPQL @Query("select m from Member m join fetch m.team t") List<Member> findMemberFetchJoinTeam(); @Test public void ManyToOneFetchJoin() { Team teamA = new Team("teamA"); Team teamB = new Team("teamB"); teamRepository.save(teamA); teamRepository.save(teamB); Member member1 = new Member(10, "member1", teamA); Member member2 = new Member(10, "member2", teamB); memberRepository.save(member1); memberRepository.save(member2); em.flush(); em.clear(); List<Member> members = memberRepository.findMemberFetchJoinTeam(); for (Member member : members) { System.out.println("member = " + member); System.out.println("member.getTeam().getClass() = " + member.getTeam().getClass()); System.out.println("member.getTeam().getName() = " + member.getTeam().getName()); } } 실행결과 Hibernate: select m1_0.member_id, m1_0.age, t1_0.team_id, t1_0.name, m1_0.username from member m1_0 join team t1_0 on t1_0.team_id=m1_0.team_id member = Member(id=1, username=member1, age=10) member.getTeam().getClass() = class study.data_jpa.entity.Team member.getTeam().getName() = teamA member = Member(id=2, username=member2, age=10) member.getTeam().getClass() = class study.data_jpa.entity.Team member.getTeam().getName() = teamB 두번째 JPQL과 세번째 JPQL의 차이를 보면 두번째 JPQL의 select문에서 m1 _0.tea m_id 도 조회하고 세번째 JPQL의 select문에서는 m1 _0.tea m_id 을 조회하지 않습니다. 두번째 JPQL과 세번째 JPQL이 정확히 어떤 차이가 있어 select문에서 조회하는 컬럼이 달라지는지 궁금합니다.
1) "webpack": "^5.94.0", "webpack-cli": "^5.1.4" node_modules/.bin/webpack --mode development --entry ./src/app.js --output-path ./dist 다른 질문글에 open index.html 을 했는지 모르겠지만 저는 잘 안되더라구요 차이점은 ./dist/main.js 에서 ./dist 입니다. main.js를 /dist/main.js/main.js 이렇게 만들어버리더라구요 그래서 요상한 에러들 때문에 해맸었습니다. 2) 제가 봤던 에러는 크롬 디버깅창에 main.js를 그대로 로딩하지않고 마치html처럼 <!DOCTYPE html> 이 첫줄에 추가된 체로 로딩이 되어서 unexpected token "<" 와 같은에러를 봤습니다. 혹시 왜 js를 html로 랩핑? 해서 읽어온 이유를 아시나요?
학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문 전에 다음을 꼭 확인해주세요. 1. 강의 내용과 관련된 질문을 남겨주세요. 2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요. (자주 하는 질문 링크: https://bit.ly/3fX6ygx) 3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요. (질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG) 질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요. ========================================= [질문 템플릿] 1. 강의 내용과 관련된 질문인가요? (예) 2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예) 3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예) [질문 내용] 비공정 모드가 공정 모드가 빠른 이유가 뭔지 자세히 궁금합니다. 비공정 모드에서도 어느 정도 대기큐가 있다고 하셨는데 그 걸 제외하고 공정 모드에서는 대기큐를 사용하면 어떤 스레드가 다음 락을 가져야할 지 알기 때문에 좀 더 빠르지 않나? 라는 생각이 들어서요.. 그리고 비공정 모드에서는 반대로 대기큐를 사용하지 않았기 때문에 공정 모드보다 락 얻기 위한 경합이 일어나서 좀 더 느릴 수 있는거 아닌가..? 싶어서 여쭤봅니다.. 시스템 상황에서 어떻게 비공정 모드가 공정 모드보다 빠른지 이해가 가지 않네요..ㅠㅠ
추가적인 리팩토링 해보기 PaymentService 에서 exRate 계산을 Payment 가 직접 하도록 할 수 있음 exRateProvider 를 Payment 안으로 넣어주면됨 시간계산은 Clock 을 Payment 안으로 넣어줘도 됨 추가 리팩토링을 진행하면 Payment 의 prepare 메서드의 내부 로직은 한 줄이면 끝남 강의 중 말씀 해주신 위의 설명을 토대로 PaymentService, Payment 클래스를 리팩토링하고 PaymentTest 클래스를 수정 해 보았습니다. PaymentService의 prepare 메서드 @Component public class PaymentService { private final ExRateProvider exRateProvider; private final Clock clock; public PaymentService(ExRateProvider exRateProvider, Clock clock) { this.exRateProvider = exRateProvider; this.clock = clock; } public Payment prepare(Long orderId, String currency, BigDecimal foreginCurrencyAmount) throws IOException { return Payment.createPrepared(orderId, currency, foreginCurrencyAmount, this.exRateProvider, this.clock); } } Payment의 createdPrepared 메서드 public static Payment createPrepared(Long orderId, String currency, BigDecimal foreginCurrencyAmount, ExRateProvider exRateProvider, Clock clock) throws IOException { BigDecimal exRate = exRateProvider.getExRate(currency); BigDecimal convertedAmount = foreginCurrencyAmount.multiply(exRate); LocalDateTime validUntil = LocalDateTime.now(clock).plusMinutes(30); return new Payment(orderId, currency, foreginCurrencyAmount, exRate, convertedAmount, validUntil); } PaymentTest class PaymentTest { @Test void createPrepared() throws IOException { Clock clock = Clock.fixed(Instant.now(), ZoneId.systemDefault()); ExRateProviderStub exRateProvider = new ExRateProviderStub(valueOf(1_000)); Payment payment = Payment.createPrepared( 1L, "USD", BigDecimal.TEN, exRateProvider, clock ); Assertions.assertThat(payment.getConvertedAmount()).isEqualByComparingTo(valueOf(10_000)); Assertions.assertThat(payment.getValidUntil()).isEqualTo(LocalDateTime.now(clock).plusMinutes(30)); } @Test void isValid() throws IOException { Clock clock = Clock.fixed(Instant.now(), ZoneId.systemDefault()); ExRateProviderStub exRateProvider = new ExRateProviderStub(valueOf(1_000)); Payment payment = Payment.createPrepared( 1L, "USD", BigDecimal.TEN, exRateProvider, clock ); Assertions.assertThat(payment.isValid(clock)).isTrue(); Assertions.assertThat( payment.isValid(Clock.offset(clock, Duration.of(30, ChronoUnit.MINUTES)))).isFalse(); } } 질문 제가 진행한 리팩토링이 올바르게 행하였는지 궁금합니다. Test를 진행할 때 exRateProvider 를 사용하기 위해서 기존에 작성하였던 ExRateProviderStub 오브젝트를 생성하여 테스트를 진행해 주는 것이 맞는지 궁금합니다. 처음에 ExRateProviderStub exRateProvider = null; 을 사용해 봤더니 java.lang.NullPointerException: Cannot invoke "tobyspring.hellospring.payment.ExRateProvider.getExRate(String)" because "exRateProvider" is null 이와 같은 에러가 발생하였습니다. 제가 ExRateProvider 객체가 null로 설정해서 발생한 에러인걸 이해 하고, ExRateProvider 를 구현한 객체가 필요하기 때문에 ExRateProviderStub 오브젝트를 생성하여 exRate 를 넣어 주었습니다. 3. ExRateProviderStub 오브젝트를 생성하여 exRate (적용환율)을 넣고 생성하는 이유는 실제 api가 아닌 일부 기능을 테스트하기 위해서 저희가 직접 적용환율을 적용해보고 외화금액과 곱해서 계산된게 맞는지 테스트하는 목적이다. 라고 제가 이해하였는데 올바르게 이해한 것인지 궁금합니다. PS. 제가 아직 배운 내용을 완전히 소화하지 못한 부분이 있을 수 있어, 질문에 대한 설명이 부족할 수 있습니다. 혹시 잘못된 부분이나 추가적인 조언이 있다면 피드백 부탁드립니다. 감사합니다.
리액트 쿼리를 사용하면 결국 client side fetching이 됩니다. nextjs13부터 server side fetching이 가능해지고 suspense를 활용한 data streaming은 데이터펫칭에서 새로운 패러다임을 제시했다고 생각합니다. 굳이 리액트 쿼리를 사용할 이유가 있을까요?
