To Do List App으로 정리하는 TypeScript

들어가기 지난 번에 공부했던 React에서 활용하는 방법을 공부하기 위해 TypeScript 할 일 목록 만들기 앱 강좌를 보며 정리했습니다. 기본 세팅 App의 유형이 Functional Component라는 의미로 FC로 넣어줍니다. useState 사용하기 useState에 꺽쇠를 붙여서 타입을 정의할 수 있습니다. 예: <타입> input 핸들러의 타입 정의 ChangeEvent를 react에서 불러와서 ‘HTMLInputElement’를 타입으로 줄 수 있습니다. 예 <HTMLInputElement> 이벤트 값을 Number로... » read more

원티드 FE 프리온보딩 과제1 회고 (환율 계산기)

들어가기 원티드 프리온보딩 첫 과제는 환율정보 API를 이용해서 환율 계산기를 만드는 것이 과제였습니다. 팀 프로젝트로 4명인 팀을 2명씩 나눠서 기능이 다른 계산기를 구현해야 했습니다. 지금까지 독학으로 공부하면서 다른 사람들과 공부한 내용에 대해서 이야기한 적도 없었고, 정해진 과제를 수행한 경험도 거의 없었기 때문에 너무 긴장되었습니다. 하지만 괜찮다고 격려해 주신 팀원 분들 덕분에 힘을 낼 수 있었습니다.... » read more

원티드, 위코드 FE 프리온보딩 – 두 번째 수업

주제 : React 성능최적화 & Best Practice 성능 개선이 필요한 이유 JS도 React도 성능을 고려하지 않고 개발하면 갑자기 사이트가 느려지는 순간이 올 수 있기 때문에 미리 성능을 개선하는 방식으로 프로그래밍을 해야 합니다. 알면서 안 쓰는 것과 모르는 것은 다르기 때문에 개선에 대해서 알아서 쓰면 좋을 것 같습니다. (실제로는 0.01초 밖에 개선이 안 되겠죠. 그래도 쌓이면... » read more

Browser Router 사용했는데 netlify에서 404 에러가 나는 경우

지금까지 github pages를 사용하다가 처음으로 netlify로 배포를 했습니다. 그런데 404 에러가 나서 인터넷을 찾아보고 수정했습니다. 해결 방법 public폴더에 _redirects라는 파일을 만듭니다. _redirects파일의 내용은 다음과 같이 작성합니다. 커밋하면 에러가 사라집니다. (저는 이것을 public이 아니고 가장 상위 폴더에 넣어뒀다가 안돼서 한참 헤맸습니다...) 출처 : https://answers.netlify.com/t/netlify-page-not-found-when-sharing-react-router-dom-based-links/11744

TypeSciript 기본 타입

TypeScript 타입의 종류를 블로그에 다시 쓰면서 공부한 내용을 복습해 보고자 합니다. 타입의 종류 number 1, 2, 3, 4 ... string '가나다라', 'abcd' boolean true, false bigint 2^53 - 1보다 큰 정수 symbol 불변하고 유니크한 값입니다. (생성된 심볼은 다른 값이랑 같아도 a===b false) null 비어 있는 상태 undefined 정의되지 않은 상태 void function에서 return값이 없을 때... » read more

Array.some

콜백 내에 있는 식이 참이 될 때까지 배열을 반복해서 확인! 배열 안에 참이 하나라도 있으면 true 하나도 없으면 false

Array.map()

배열 안에 있는 모든 요소를 호출해서 새로운 값을 반환하는 것. MDN 설명 페이지 map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환합니다. 설명 페이지 내용 확인 array1.map(x);라고 하면 1, 4, 9, 16 라는 결과가 나옴. 위에 예제의 코드는 () 안에 함수를 넣어서 전체 배열의 값을 2배로 반환하는 것을 보여줌.... » read more