저장할 때밑에 코드를 쓰면 에러가 뜹니다ㅠㅠ어떻게 해결해야하나요?const initalTodoData = localStorage.getItem("todoData") ? JSON.parse(localStorage.getItem("todoData")) : []; function App() { const [todoData, setTodoData] = useState([initalTodoData]);

List 컴포넌트 생성하기에서 props로 key={data.id}를 넘겨주는데 저기서는 사용하지 않는데 넘겨주어야 하나요? 빼도 상관 없나요??

 generate -> add Dependency 이 메뉴가 안보이던데, 어떻게 보이게할까요?

안녕하세요 강사님, 궁금한게있습니다.인스타그램, 페이스북을 사용할 때 제가 쓴 게시글에 다른 사람이 댓글을 달면 알림이 생성되는데, 제가 작성한 로직에서는 CommentService에서 댓글을 작성하고 alarmService를 호출하여 알림까지 생성하는 로직입니다.이렇게 로직을 짰을 때 제가 생각한 문제점에 대한 해답을 찾고 싶습니다.1. CommentService에서 다른 Service를 의존하게 되는 것2. 댓글 작성이라는 테스트를 짤 때 댓글 작성에 초첨을 맞출 수 없고 알림까지 테스트를 작성해야 되기 떄문에 핵심 기능 외에 다른 부가적인 기능 때문에 테스트의 집중도가 떨어집니다.3. 한 트랙잭션에 묶여서 알림을 생성하는데 문제가 발생하면 댓글도 생성되지 않습니다.이러한 경우 어떤 학습을 통해 개선할 수 있는지 가르쳐주실 수 있나요?

코드 샌드박스들어가면 이런식으로 뜨는데 어떻게 해결하나요?

@SpringBootTest class OrderRepositoryTest { @Autowired private OrderRepository orderRepository; @Autowired private ProductRepository productRepository; @DisplayName("해당 날짜의 모든 결제 내역을 조회한다.") @Test void findAllByDate() { // given LocalDateTime time1 = LocalDateTime.of(2024, 5, 11, 10, 0); LocalDateTime time2 = LocalDateTime.of(2024, 5, 10, 10, 0); Product product1 = createProduct("001"); Product product2 = createProduct("002"); Product product3 = createProduct("003"); Product product4 = createProduct("004"); productRepository.saveAll(List.of(product1, product2, product3, product4)); Order order1 = Order.builder() .products(List.of(product1, product2)) .now(time1) .build(); Order order2 = Order.builder() .products(List.of(product3, product4)) .now(time2) .build(); orderRepository.saveAll(List.of(order1, order2)); // when LocalDate findDate = LocalDate.of(2024, 5, 11); List<Order> findOrders = orderRepository.findAllByDate( findDate.atStartOfDay(), findDate.plusDays(1).atStartOfDay(), OrderStatus.INIT ); // then Assertions.assertThat(findOrders).hasSize(1); } private static Product createProduct(String number){ return Product.builder() .productNumber(number) .productType(ProductType.HAND_MADE) .sellingType(ProductSellingType.SELLING) .name("test") .price(1000) .build(); } } OrderRepositoryTest에서 매서드 테스트를 할 때, Order와 Product는 1대다 다대1로 연관관계 매핑되어 있는 상태인데, 그러면 위와 같이 작성할 경우, productRepository와 관련된 코드가 들어가니, 단위테스트가 깨지는거 아닌가요? 이럴때 어떻게 해야하나요?

안녕하세요. 강의 수강 중에 추가적으로 구현하고 싶은 기능이 있는데 어떻게 해야할지 모르겠어서.. 질문 남깁니다. 검색창에 검색어를 입력하면 SearchPage에 관련 영화 포스터들이 나오고 그 중에 하나를 클릭해서 영화 상세 페이지(DetailPage)로 이동했을 때 검색창을 초기화하고 싶은데 어떻게 해야 하는지 궁금합니다. 

안녕하세요. 2.1강에서 storybook, vitest 명령어를 사용했을 때, 에러가 나타나서 질문 드립니다 Settingbranch: unit-test-examplevitest 플러그인: v0.3.0 (현재 이하로는 변경이 안되는 것 같습니다)node: 19.9.0 eslint.json - `"prettier:prettier": "off"` 추가prettierrc - `"endOfLine": "auto"` 추가 storybook 사용 시(npm run storybook)  Web의 경우 새로고침을 하면 정상 페이지로 동작하지만 에러 로그는 그대로 입니다vitestimport { screen } from '@testing-library/react'; import React from 'react'; import TextField from '@/components/TextField'; import render from '@/utils/test/render'; it('className Prop으로 설정한 css class가 적용된다.', async () => { // Arrange - 테스트를 위한 환경 만들기 // -> className을 지닌 컴포넌트 렌더링 await render(<TextField className="my-class" />); // Act - 테스트할 동작 발생 // -> 렌더링에 대한 검증이기 때문에 이 단계는 생략 // -> 클릭이나 메서드 호출, prop 변경 등등에 대한 작업이 여기에 해당 합니다. // Assert - 올바른 동작이 실행되었는지 검증 // -> 렌덩링 이후 DOM에 해당 class가 존재하는지 검증 // TextField는 placeholder 요소가 있습니다. // vitest의 expect 함수를 사용하여 기대 결과를 검증 expect( screen .getByPlaceholderText('텍스트를 입력해 주세요.') .toHaveClass('my-class'), ); });

강사님은 classicist를 지향한다고 했는데, classicist의 단위 테스트는 데이터베이스와 같은 공유 의존성을 테스트 대역(mock)으로 대체해야 한다는 것으로 알고 있는데 유연한 사고(?)로 classist를 지향하지만 통합 테스트로 단위를 확인하는 것을 좋아한다 정도로 정리하면 좋을까요? 아니면 H2를 사용했으니 테스트 대역을 운영환경보단 빠른 환경으로 교체했으니 여전히 단위 테스트라고 생각을 하시는 걸까요?service 레이어를 통합 테스트로 안 짜는 팀에서 classicist를 지향한다면 DB에 대한 의존성을 어떻게 대체하는지 간단한 예제라도 보여주실 수 있을까요? ㅠ

개인적으로 Mock은 상태를 (내가 작성한 값을) 반환하는 것, Stub은 상태가 (내가 작성한 구현대로) 반환되는 것이라고 정의를 내리고 있습니다. 이와 같은 표현으로 차이를 이해하고 있어도 괜찮을까요?아니면 좀 더 명확한 표현이 있을까요? Mock 객체에 우리가 원하는 행위를 정의(Stubbing)하면,그 객체는 이제 Mock 객체라고 해야하나요 아니면 Stub 객체라고 해야하나요? 아래 코드를 보고 Mock 객체인 mailSendClient의 send 메서드에 대한 Stubbing이 이루어졌다. 라고 하면 맞는 표현인가요?@ExtendWith(MockitoExtension.class) class MailServiceTest { @Mock private MailSendClient mailSendClient; @Mock private MailSendHistoryRepository mailSendHistoryRepository; @InjectMocks private MailService mailService; @DisplayName("메일 전송 테스트") @Test void sendMail() { // given when(mailSendClient.send(anyString(), anyString(), anyString(), anyString())) .thenReturn(true); // when boolean result = mailService.sendMail("", "", "", ""); // then assertThat(result).isTrue(); // verify(mailSendHistoryRepository, times(1)) // .save(any(MailSendHistory.class)); } } mailSendClient는 Mocking하더라도 상태검증을 할 수도 있고, Stubbing하더라도 행위검증을 할 수도 있지 않나요?이 둘의 차이는 Mockist와 Classicist의 차이이지, Mock과 Stub의 차이라고 할 수 없지 않을까요? 

실무에 적용하려고 하니 msw 에서 많이 막히네요 ㅠ 그래서 올려주신 깃헙 프로젝트를 샅샅히 훑어보고 있는데 mockServiceWorker.js 이 파일과 package.json에"msw": { "workerDirectory": "public" } 요런 부분이 있더라고요. 요것들의 역할이 뭔지 알수 있을까요? msw 사이트에 가서 Getting started 를 가봐도 안나와 있는것 같아서 궁금합니다!

안녕하세요. 프로젝트 내에서 통합 테스트를 위해서 @SpringBootTest를 사용한 여러 테스트 코드를 작성하였습니다.예를 들어 아래와 같이 별개의 2개 테스트 코드에는 각각 school table의 값을 생성 및 조회하는 코드가 들어있습니다.@SpringBootTest @Transactional class aTest { // JPA 사용해서 school Table의 data 생성/조회 } --------------------- @SpringBootTest @Transactional class bTest { // JPA 사용해서 school Table의 data 생성/조회 } 위와 같이 테스트 코드를 작성하고 aTest.java 에서 school table에 3개의 데이터를 넣은 경우, bTest.java 에서 school 테이블의 값을 읽었을 때, aTest.java에서 넣은 값은 지워지는 것인지요? 아니면 그대로 남아 bTest.java 에서 조회가 가능한 것인지요?@Transactional이 들어가 있는 경우 데이터가 rollback 되는 것으로 알고 있어서, bTest.java에서 읽었을 때는 빈 테이블이 있을 것으로 예상했는데, 테스트를 해보면 School table의 id 값(자동 증가하는 값)이 bTest.java에서 처음 읽었을 때 4로 보이는 현상이 있어서 질문을 드립니다. 

안녕하세요 강사님 강의 듣고 많이 배우고 있습니다.다름이 아니라 테스트 방식에 질문이 있어서 문의 드립니다.현재 테스트는 서비스 코드를 먼저 짜고 테스트를 진행하는데테스트 방식에는 테스트 코드를 먼저 짜고 서비스 코드를 만들어가는 형식도 있더라구요..둘 차이점이 혹시 있을까요..

cypress를 적용해보고 러닝 커브가 훨씬 낮은거 같고 좋았습니다 jest는 많이 목킹을 하고 여러가지 더 설정이 많아서 힘들긴 했는데 여기서 타입을 제외하고 더 같이 쓰지 말아야할 이유가 있나요?

테스트 모음 폴더명을 "test" 아닌 "__test__"로 정의하신이유가있을까요??

App.js파일을 refresh 하면 이렇게 error가 뜨네요 ㅜㅜ 해결책을 아무리 찾아봐도 나오질 않습니다 . .

학습 관련 질문을 남겨주세요. 어떤 부분이 고민인지, 무엇이 문제인지 상세히 작성하면 더 좋아요!먼저 유사한 질문이 있었는지 검색해 보세요.서로 예의를 지키며 존중하는 문화를 만들어가요.  저희만의 서비스에 특화된 비즈니스 검증로직은 따로 서비스나 도메인에서 분리해서 검증하라고 하셨는데, 정확히 이해가 가지 않아서 좀더 질문 드립니다.예를 들어, 패스워드 검증 로직이 있다고 하면, 저희만의 서비스는 패스워드 검증을( 영문,특문 혼합 8자이상)이라고 정했을때, 컨트롤러의 요청 부분에서는 @NotBlank를 처리하고, 서비스나 도메인에서 위의 패스워드 검증 로직을 진행하라는 말씀인가요??

강사님은 내부적으로 Banner.css에 대한 내용을 복붙하셨는데,강의 영상에서 Banner.css 내에 소스가 다표기가 되지 않아서동일하게 진행하기 어려운 것 같습니다.

Import From Android Device 에서 목록 이름이 Type, Application, Version 형태가 아니라 아래 캡쳐이미지 처럼 보입니다.강사님 화면에서는 정상적으로 보이는데 전 뭐가 문제일까요..?

안녕하세요.application.yml에서 local, test로 환경을 나누어서 h2 db를 통해 테스트 코드를 만들어보고있습니다.나중에 운영 서버나 릴리즈 서버같은곳에 빌드, 배포할때도 테스트를 진행해야 할텐데 DB 주소를 어떻게 설정하는게 좋을까요? 각각 실제로 사용할 DB의 주소를 적어놓을텐데 빌드하면서 테스트를 진행하면 해당 DB의 테이블과 데이터를 건드리게 될거란 생각이 들어서요..테스트용 resources로 yml을 따로 작성해서 해야할까요?