프론트엔드에서는 어떤 것을 테스트 해야 할까?
·
Knowledge/Test
이 글은 Kent C. Dodds의 How to know what to test 포스트를 번역한 글입니다.Thank you Kent C. Dodds. Because of your posts, I can continue to grow as an engineer. 테스트하는 방법을 아는 것은 훌륭하고 중요한 일이다. 나는 사람들에게 테스트의 기본 사항, 도구 구성 방법, 특정 시나리오에 대한 테스트 작성 방법 등을 알려주는 많은 콘텐츠를 만들었다. 하지만 테스트를 작성하는 방법을 알아도, 애플리케이션에 대한 신뢰성을 얻기 위해서는 그저 절반일 뿐이다. 무엇을 테스트할지 아는 것은 중요한 또 다른 절반이다.워크숍 자료와 TestingJavaScript.com에서 무엇을 테스트해야 하는지 아는 방법에 대해 이야..
프론트엔드에서의 Static, Unit, Integration, E2E 테스트
·
Knowledge/Test
이 글은 Kent C. Dodds의 Static vs Unit vs Integration vs E2E Testing for Frontend Apps 포스트를 번역한 글입니다.Thank you Kent C. Dodds. Because of your posts, I can continue to grow as an engineer. TestingJavaScript.com에 있는 "Testing Practices with J.B. Rainsberger" 인터뷰에서 그는 내가 정말 좋아하는 비유를 들려주었다. 그는 다음과 같이 말했다."You can throw paint against the wall and eventually you might get most of the wall, but until you go..
[React] 구글 스프레드 시트 API 이용하기(with google-spreadsheet)
·
React
버전 정보react: ^18.2.0react-scripts: ^4.0.2 (5버전은 에러가 너무 많이 나서 다운그레이드)google-spreadsheet: ^3.3.0 구글 스프레드 시트 API구글 스프레드 시트 API를 이용하여 받아온 데이터를 React에서 처리하려고 한다.API를 이용하면 자바스크립트나 파이썬등에서 코드를 통해 시트 내용을 조회, 생성, 수정, 삭제를 할 수 있다. 이 작업은 주로 정적인 사이트에 활용하기 좋다. 또한, 구글 스프레드시트에 익숙한 기획자들과의 협업에도 큰 도움이 될 수 있다.예를 들어, 기획자들이 스프레드시트에서 작업한 내용을 DB에 반영해야 하는 경우가 종종 있다. 하지만 스프레드시트의 데이터가 자주 업데이트되면, 이를 관리하는 데 상당한 노력이 필요하게 된다. 반..
[Next.JS] _app.js, _document.js
·
Next.JS
_app.js, _document.js이 파일들은 pages폴더에 위치한 Next.JS에서 제공하는 로직을 override하기 위해 필요한 파일들이다. Next.JS에서 제공해 주는 기능만 사용한다면 생성하지 않아도 된다. 하지만 실제로 개발하다 보면 100% 커스텀해야 한다._app.js_app은 모든 페이지에 레이아웃 형태로 항상 적용되어 있다.페이지 이동 시에 상태가 변하지 않는다.필요한 초기 데이터를 getInitialProps에서 받아 컴포넌트들에 공유할 수 있다.global css를 추가하기 좋은 파일이다.// _app.tsconst App = ({Component, pageProps}: AppProps) => { return }}export default App;위 코드에서 Componen..