728x90 728x90 Frontend54 React 테스팅의 개념과 종류 React 테스팅의 개념과 종류 테스팅이란 우리는 개발자로서 코드를 작성해서 특정 속성을 구현하거나 특정 문제를 해결하고 이 애플리케이션을 브라우저에서 먼저 보고 시험적으로 테스트한다. 이것들은 수동적인 테스팅이고 항상하고 있는 것인데 이런 수동적인 앱 테스팅은 오류 발생이 쉽다. 수동으로는 가능한 모든 조합과 시나리오를 테스트하기 어렵기 때문이다. 복잡한 리액트 앱에서 새로운 속성을 추가한다거나 기존의 속성을 변경한다면 이 변경에 대한 테스트 또는 새로운 속성에 대한 테스트는 하겠지만 애플리케이션의 다른 모든 부분을 항상 테스트 하지는 않을 것이다. 어떤 것을 변경한 것이 앱에서 다른 속성을 손상시킬 수 있고 우리가 모든 것을 항상 테스팅 하는 것이 아니기 때문에 손상을 유발한 변경사항과 버그를 그냥 .. 2023. 2. 25. React 배포하기 React 배포하기 배포 과정 1. 테스트 당연한 얘기지만 배포전에 애플리케이션을 철저하게 테스트한다. 애플리케이션으로 여러 가지를 테스트해보고 에러를 제대로 처리할 수 있는지 등을 철저하게 확인한다. 2. 최적화 코드에서 최적화할 수 있는 부분은 최적화 한다. 그 중에서도 lazy loading은 중요하다. 3. 빌드 코드를 더 써야하는 과정은 아니고 이미 작성되어 있는 스크립트를 실행한다. 그러면 스크립트가 코드들은 최대한 작게 축소하고 자동으로 최적화한다. 웹사이트가 완전히 로딩되어야 사용자가 웹사이트와 인터랙트할 수 있기 때문에 코드를 적게 보내면 앱이 더 빨리 로딩될 것이다. 그렇게 결과 값을 얻어서 서버로 올릴 수 있는 상태로 만든다. 4. 서버에 업로드 배포 준비가 된 최적화된 코드가 생성되.. 2023. 2. 24. React lazy loading 개념과 사용 방법 React lazy loading 개념과 사용 방법 레이지 로딩은 해당 코드가 필요할 때만 그 특정 코드를 로딩하는 것이다. React 애플리케이션을 사용하면 결국 큰 자바스크립트 코드 번들을 빌드하게 되고 해당 사이트를 사용하려면 웹 사이트의 모든 방문자가 이 전체 번들을 다운로드해야 한다. React가 이 모든 유저 인터페이스를 화면에 띄우고 애플케이션이 반응하게 하기 위해 모든 코드가 다운로드된 후에만 작동한다. 즉 사용자가 화면이 보이고 애플리케이션을 사용할 수 있을 때까지 기다려야 한다. 따라서 우리는 이 초기 코드 번들을 가능한 한 작게 만들어야 하고 특정한 코드는 진짜로 해당 페이지에 들어올 때만 다운로드되도록 해야 한다. 이것이 바로 레이지 로딩의 개념이다. 코드를 여러 덩어리와 여러 번들.. 2023. 2. 23. React 인증 방식과 개념 React 인증 방식과 개념 인증이 작동하는 원리를 이해하려면 인증의 필요성부터 이해해야 한다. 웹사이트에 인증이 필요한 이유는 보호해야 할 정보가 있기 때문이며 모든 사이트 이용자나 방문자가 모든 정보에 접근 권한을 가져선 안 되니 인증이 필요하다. 페이지 자체에도 접근 제한을 걸어야겠지만 인증된 사용자가 보낸 요청이 아니라면 API 엔드포인트로 전송된 요청이 성공할 수 없게 API 엔드포인트에도 접근 제한을 걸어야 한다. API 엔드포인트에 접근 제한을 걸지 않으면 엔드포인트의 URL을 아는 사용자나 요청을 보내 다른 사람의 데이터를 바꿀 수 있기 때문이다. 일반적으로 인증은 2단계 절차를 거치는데 1단계는 사용자가 접근 허가를 받는 것이고 2단계는 접근 허가를 통해서 보호된 리소스에 요청을 보내는 .. 2023. 2. 22. 이전 1 ··· 3 4 5 6 7 8 9 ··· 14 다음 728x90 728x90
