반응형 dev/fe12 use-hook-form 예시 만들어 놓기 const schema = yup .object() .shape({ userId: yup.string().required(), userPassword: yup.string().min(7).max(12).required(), userPasswordConfirm: yup .string() .oneOf([yup.ref('userPassword')], 'Passwords must match'), email: yup.string().email('Invalid email').required(), }) .required(); interface SIGNUP_TYPE { userId: string; userPassword: string; userPasswordConfirm: string; email: string; } .. 2023. 4. 25. nextJS, React에서 폰트가 뿌옇게 나오네? next에서 폰트를 적용하다보니 뭔가 폰트가 조금 뿌옇게 나오는 것 같았다. 물론 이런저런 문제들도 있었다. 작은 공간에 큰 폰트가 들어간 경우도 있었고, 폰트사이즈는 고정되있는데, line-height가 문제인 경우도 있었는데, 이번에는 조금 뭔가 안맞는 느낌이 들었다. 일단 해결은 했는데, 기록용으로 남겨야겠다라는 생각을 했다. 우선 @font-face의 설정값 문제였다. /* roboto */ @font-face { font-family: 'Roboto'; src: url('./assets/fonts/Roboto-Bold.woff') format('woff'); font-weight: 700; font-style: normal; unicode-range: U+AC00-D7A3, U+0061-007A.. 2023. 4. 23. useMemo 에 대한 정리 PS. 간만에 시간이 나서 계속 눈으로만 보던 정보들을 정리 [영어 원문](https://javascript.plainenglish.io/stop-using-usememo-now-e5d07d2bbf70?gi=5f63e57e7141) [읽은 글 링크](https://velog.io/@lky5697/stop-using-usememo-now?utm_source=substack&utm_medium=email) `useMemo`를 이용하면서 나도 무분별하게 사용을 했던 일들이 많았다. 특히나 문제가 있었던 이유가 랜더링이나 연산이냐를 두고 혼자 고민을 해서 `내 기준`으로 사용을 했던 것 같다. 근데 요새 많은 기술 블로그에서 나오는 글들을 공장에서 눈으로만 읽었는데, 추후에 또 분명!! 읽을 것 같아서 대략 요.. 2023. 4. 14. NextJS에서 유튜브 썸네일사용하기 구현 내용 NextJS 화면을 구현을 하는 도중에 아래와 같은 화면을 구현했어야한다. 고민을 해보고 iframe으로 구현을 하면 되겠다라고 생각을 했다. NextJS에서 구현을 할 때 외부 URL을 불러오고 뿌려주고 하는 부분이 익숙하지 않아서 삽질을 했다. NextJS에서 외부 링크로 이미지를 불러오거나 할 때 next.config.js파일에 URL를 추가해줘야한다. next.config.js 파일 수정 img.youtube.com 를 추가해주었다. 간략하게 설명을 하자면 img.youtube.com는 유튜브의 썸네일을 불러오기 위한 주소이다. /** @type {import('next').NextConfig} */ const nextConfig = { ... images: { domains: [ 'l.. 2022. 11. 30. 이전 1 2 3 다음 반응형
