티스토리

zineeworld

검색하기

블로그 홈

zineeworld

zinee-world.tistory.com/m

2013년부터 마크업 개발을 하고 있습니다.

구독자: 26

방명록 방문하기

주요 글 목록

2025 TPM Meet-Up 핫한 테크 기업 TPM으로 일하기 | 원티드 2025 TPM Meet-Up 핫한 테크 기업 TPM으로 일하기 | 원티드 2025 TPM Meet-Up 핫한 테크 기업 TPM으로 일하기 | 원티드이력서, 채용 공고, 연봉 정보는 물론 프리랜서 프로젝트까지! 신입 취업 및 경력직 이직, 커리어 성장에 필요한 모든 것을 만나보세요.www.wanted.co.kr 4/4 까지 얼리버드 티켓 판매중입니다.잔여수량이 많지 않아서 빨리 신청하는게 좋을 것 같네요. 공감수 0 댓글수 0 2025. 3. 27.
[토스 개발자 컨퍼런스] SLASH 24 https://toss.im/slash-24 토스 개발자 컨퍼런스 SLASH24참가 신청 8.23-9.2 / 본 행사 9.12 COEXtoss.im 빠르게 성장하고 싶은 주니어 개발자를 위한 소프트 스킬 5가지 팀에 Winning Mentality를 불어넣는 리더십 스킬 신뢰의 출발, 감정 존중인간은 감정적 존재, 감정을 통제 가능한 변수로 보는 관점 가지기들어주기는 강력한 Tool - 충고/조언/평가/판단 않기감정을 말할 수 있는 1명이 안정감의 원천 신뢰받는 리더 되기도덕책실행자"상대가 망치지 않을 것을 믿는 게 아니라, 망쳐도 믿는 것." - 에드원 캐트멀_Pixar 멤버 간 신뢰 만들기강한 network : 연결을 늘리고, 대역폭(bandwidth)을 높이고- 시간에 따라 자연스럽.. 공감수 1 댓글수 0 2025. 1. 16.
[font] woff 랑 otf, ttf 폰트의 볼드체 굵기가 다른 이유 폰트 파일의 형식에 따라 같은 이름의 폰트라도 굵기와 같은 세부적인 특성이 다르게 보일 수 있습니다. 특히 WOFF(웹폰트)와 OTF/TTF(데스크탑 폰트) 간의 차이에서 이런 현상이 발생할 수 있습니다. 이유는 다음과 같습니다: 1. 렌더링 엔진의 차이WOFF는 웹 브라우저에서 사용되며, 브라우저마다 텍스트 렌더링 방식이 다릅니다.Subpixel Rendering 또는 안티앨리어싱 처리가 브라우저 및 운영 체제에 따라 달라지기 때문에 같은 글자라도 굵기 차이가 발생할 수 있습니다.예: Chrome, Safari, Firefox 등의 브라우저에서 동일한 WOFF 폰트도 다르게 보일 수 있음.OTF/TTF는 주로 OS 또는 디자인 툴에서 사용되며, 더 정밀한 렌더링이 가능합니다.이러한 툴들은 폰트의 힌팅.. 공감수 3 댓글수 0 2025. 1. 16.
[디자인시스템] 우아한플레이그라운드 #우아콘2024 1. 우아한플레이그라운드가 필요했던배경문서 사이트엔 정책에 대한 내용만 있고, 코드를 어떻게 작성해야 하는 지는 찾아 볼수 없다.스토리북에서는 다양한 사례와 코드가 제공되긴 하는데 코드 일부가 잘 표시되고 있지 않다.AS-IS문서 사이트에서 개요 읽어보기스토리북에서 예제 확인하기대대로 내려오는 과거 조상들의 코드에서 한 수 배우기빈 프로젝트를 생성하여 맨땅에서 실험해보기 2. 구현 👍에디터와 프리뷰srcDoc을 통해 html 컨텐츠를 문자열 형태로 전달npm 라이브러리 importESM 기반의 CDN인 esm.sh에서 npm 라이브러리 로드importmap을 사용하여 esm.sh로 매핑TypeScript/JSX 지원하기esbuild-wasm을 사용하여 JavaScript로 트랜스파일TypeScript.. 공감수 0 댓글수 0 2024. 12. 12.
ChatGPT 돌아와... OpenAI Status OpenAI Status status.openai.com 공감수 0 댓글수 0 2024. 12. 12.
[Vue3] type: String as PropType와 validator 차이점 type: String as PropType와 validator를 사용하는 방식은 타입 정의와 값 검증의 차이에 따라 적합한 상황이 다릅니다. 아래는 두 방법의 차이를 정리한 내용입니다.1. type: String as PropType의 특징주로 TypeScript를 사용하는 경우:PropType을 사용하면, TypeScript가 제공하는 정적 타입 검사 기능을 통해 컴파일 타임에 허용되는 값의 범위를 명확히 정의할 수 있습니다.IDE에서 자동 완성 및 타입 오류를 바로 확인할 수 있습니다.사용 예시:size: { type: String as PropType, default: 'medium',}장점:타입 안전성을 제공하며, 런타임에 추가 검증 코드가 필요 없습니다.TypeScript의 타입 추론과 완.. 공감수 0 댓글수 0 2024. 12. 5.
[241203] 제12회 널리 웨비나 :: 접근성은 인권이다 Designing Inclusive AI for Marginalized Population - 김영호 Naver AI Lab AI가 이들의 대화를 중간에서 도와준다면?AACessTalkYoung-Ho Kim | HCI Researcher and Builder Young-Ho Kim | HCI Researcher and BuilderI am a Lead Research Scientist at NAVER AI Lab, leading the Human-Computer Interaction Research Group. As a Human-Computer Interaction researcher, I do research at the intersection of Ubiquitous Computing, Person.. 공감수 3 댓글수 0 2024. 12. 3.
Vuex 와 Pinia 비교 Vuex와 Pinia는 Vue.js 애플리케이션에서 상태 관리를 제공하는 라이브러리입니다. Vuex는 Vue의 공식 상태 관리 라이브러리이고, Pinia는 Vue 3와 함께 등장한 경량 상태 관리 솔루션으로, Vuex의 복잡성을 줄이고 더 직관적인 사용법을 제공합니다. Vuex가 무엇인가요? | VuexVuex가 무엇인가요? Vuex는 Vue.js 애플리케이션에 대한 상태 관리 패턴 + 라이브러리 입니다. 애플리케이션의 모든 컴포넌트에 대한 중앙 집중식 저장소 역할을 하며 예측 가능한 방식으로 상태를v3.vuex.vuejs.org Pinia | The intuitive store for Vue.jsIntuitive, type safe, light and flexible Store for Vuepini.. 공감수 0 댓글수 0 2024. 11. 22.
나만의 tailwind CSS 만들기 (preset.scss) 지난 10년간 여러 CSS 방법론들이 있었지만 2024년인 지금 가장 대중적인 방법은 아마 tailwind CSS 일 것이다. 하지만 나에겐 테일윈드마저 약간 오버스펙으로 다가와서 직접 필요한 스타일만 추가해서 유틸리티 CSS를 만들게 되었다. 결과적으로 핀크 내 서비스를 개발할 때 아주 편리하고 유용하게 사용하고 있어서 공유해본다. 사실 특별할 건 정말 하나도 없다. Tailwind CSS란?Tailwind CSS - Rapidly build modern websites without ever leaving your HTML. Tailwind CSS - Rapidly build modern websites without ever leaving your HTML.Tailwind CSS is a utili.. 공감수 5 댓글수 0 2024. 11. 22.
[2023] 핀크 디자인 시스템 구축기 (작성중) - 참고 -아직 수정중인 글입니다 서론환경적 이슈전직장에서 주된 작업이 디자인 시스템이었기 때문에 핀크에 이직한 뒤 가장 먼저 맡게 된 것은 디자인시스템 구축이었다. 잦은 디자이너, 퍼블리셔, 개발자 교체로 인해서 히스토리가 연결되기 쉽지 않은 상태였다. 디자인 역시 스케치에서 피그마로 전환하게 된지 얼마 되지 않아서 모든 화면이 피그마 파일로 존재하는 것도 아니었다. 디자인 시스템 구축을 해본 경험이 있는 디자이너 1명이 리딩을 하고 있었는데 반년이 지나도록 별다른 성과를 만들지 못한 것 같았다. 사실 디자이너 혼자서 운영/신규 피쳐 디자인 대응을 해가면서 모바일(AOS/IOS)과 웹 디자인 시스템을 구축한다는 건 정말 어려운 일이다. 회사에서도 결과물이 나오지 않은 상태에서 수개월 간 디자인 시스.. 공감수 3 댓글수 0 2024. 11. 21.
핀크 (2023.08 ~ ing) 2023디자인 시스템 구축프레임워크별 코어 컴포넌트 제작 (Vue 37종, React 38종)프레임워크별 스토리북 제작핀크 서비스 운영 업무위* (신규 서비스) 마크업 외주 관리전자문서지갑 마크업 개발 Vue2자동차보험비교 마크업 개발 React 2024핀크 웹 사이트 리팩토링 Next.js금융상품탭 마크업 Vue2위* 마크업 QA 대응 Vue2어그리 (포겟 B2C) 마크업 Vue3기타 핀크 운영 프로모션 페이지카드 프로모션머니충전소 쿠팡파트너스홈페이지 대출상품 정보, 약관 수정POP 서버 레거시 정리 (폰트 통일화)마이데이터 연결 플로우 개선 마크업 React핀또 복권 마크업 Vue2 공감수 1 댓글수 0 2024. 11. 20.
[2022] 카카오워크 어드민 디자인시스템 서론디자인모듈파트의 시작카카오엔터프라이즈는 B2B 서비스를 제공하기 때문에 신규 사업이 생길 때마다 필연적으로 어드민이 같이 개발되어 고객사에게 전달이 되어야 한다. 각각의 서비스 자체의 모든 디자인을 시스템화 하기는 정말 어려운 일이었지만 어드민이라는 특수 환경은 어느정도 통일이 가능한 영역이었다. 비슷한 디자인을 각각의 디자이너, 개발자가 매번 새롭게 만드는 것도 리소스 낭비로 여겨질 즈음이었다. 2022년 5월에 정식으로 목적 조직인 '디자인모듈파트'로 발령이 되었고 파트장을 맡아 프로젝트를 이끌었다. 사실 내가 아니더라도 모두가 조직장이 될만한 훌륭한 팀원들 덕에 완성도 높은 작업을 진행할 수 있었다. 대부분의 회사에서는 디자인 시스템을 구축하는 것이 업무 외 적으로 시간이 되면 하는 일로 우선순.. 공감수 1 댓글수 0 2024. 11. 20.
2024-11-19 #오늘의영감 <한정수, 체대 출신 개발자> 한정수 님의 회고를 처음 접한 건 2018년이었는데, 그때도 꽤 신선하게 다가왔던 기억이 난다. 아마도 '체대 출신 개발자'라는 타이틀이 누구나 한 번쯤 클릭해보고 싶게 만드는 후킹 요소였던 것 같다. 흔한 '비전공자'라는 표현보다 더 궁금증을 자아내는 매력이 있었다. 다른 사람의 회고를 읽고 이렇게 자극을 받는 일이 흔치 않은데, 이번에는 간만에 신선한 자극을 받았다. 나도 2016년부터 연말 회고를 꾸준히 써왔지만, 갈수록 자세하게 적지는 못하고 있다. 그런데 다른 사람의 회고를 읽으면서 다시금 연말 회고를 성심성의껏 써야겠다는 생각이 들었다. 내가 직접 쓰는 회고만큼 그 순간을 잘 기록할 방법은 없다는 걸 깨닫는다. 인간은 망각의 동물이기 때문에, 기록은 항상 필요하다. 기록은 그 어떤 것이라도 옳.. 공감수 3 댓글수 0 2024. 11. 19.
[디자인시스템] 우아한형제의 '우아한공방' #우아콘 디자인편15명이 1년동안 만든 디자인시스템 1.0의 이야기 개발편 무려 5년에 걸쳐 만들어진 디자인시스템2019년논의 시작디자인시스템을 적용하기엔 서비스가 크지 않았음2020년 15명의 전사 웹 프론트 개발자적은 개수의 서비스 운영 (배달/B마트 등)신규 서비스의 빠른 성장이 주요 목표비즈니스의 성공이 중요도 매우 높음2021년 서비스별 성장으로 독자적인 디자인 체계를 갖춤개발 생산성 향상을 위해 각 서비스 별 컴포넌트 라이브러리 구축팀의 인원이 늘어남에 따라 협업구조 필요생산성과 비즈니스를 함께 고민2022년 전사에 산발적으로 진행되고 있는 디자인시스템을 일원화하려는 노력 시작'배시시'라는 중앙화 시도시스템을 견고하게 만든 후 비즈니스 개발에 적용시스템의 높은 장벽으로 인한 개발 적용 시 한계비.. 공감수 1 댓글수 0 2024. 11. 18.
기술 블로그 10주년 정든 나의 블로그 벌써 10년이 되었습니다. (2014~2024)최근에는 너무 방치한 것 같아서 양심에 찔렸는데,스킨 업데이트 하고 나니 자잘한 버그들이 해결되어서 블로그 들어올 맛이 생겼네요! 카테고리도 연도별로 정리해봤어요.2014년부터 10년동안 포스팅한 글 개수만 봐도 마크업 개발에 진심이었던 때가 확연하게 보이네요 ㅎㅎGPT 덕에 블로그보다는 프롬프트를 더 자주 들여다보게 되었지만 예전엔 이런 걸 궁금해 했구나 하고 돌아보게 되네요. 예전에는 모르는 게 너무 많았고, 찾아가는 과정이 쉽지 않았는데요즘은 쉽게 많은 것들을 알 수 있는 세상이 되었네요. 2034년의 저는 뭘하고 있을까요...?여러분은 안녕하신가요? 공감수 4 댓글수 0 2024. 11. 15.
[Canvas] Vue로 복권 긁기 기능 구현 (LottoScratch) 핀또 개발하면서 구현하게 된 스크래치 효과토스에서 만보기 복권이나 고양이 그림 맞추기 등에 사용되는 효과와 비슷하다 공감수 0 댓글수 0 2024. 10. 24.
[인터랙션개발] CSSWinner에서 발견한 재밌는 효과들 https://13322566869.com/ Digital Producer - Specialised in DesignNavigating your digital transformation through bespoke creative solutions, providing a personal touch.13322566869.com #1- 스크롤 타이밍 맞춰서 배경 캔버스가 좌->우로 채우짐- 글자색이 배경색과 반전됨 #2스크롤 타이밍 맞춰서 라벨 하나씩 fadeIn 됨 #3조각난 이미지들이 스크롤 타이밍에 맞춰 원상태로 맞춰짐 조각난 이미지 8장을 비틀어놨다가 맞춰놓는 개념임 (너무 궁금해서 찾아냄) 그런데 이렇게 이미지를 개별적으로 다 만들지 않고, `background-clip`을 이용한다던가.. 공감수 0 댓글수 0 2024. 6. 28.
[Fonts] 독특한 무료 한글 폰트, HS산토끼체 2.0 이번주 노마드코더 웹진을 읽다가 발견한 사이트에서 폰트가 너무 눈에 들어오길래 찾아봤다. 약간 히라가나 같기도 한 모양이 특이하고 게다가 절대 무료폰트로 풀릴 만한 퀄리티가 아니어서 너무 탐이 났다. HS산토끼체 2.0 | 산돌구름무료폰트 사용 산돌구름 PC가 설치되어 있는지 확인해주세요. 산돌구름이 실행중인 상태에서 폰트를 사용할 수 있습니다. 확인 취소www.sandollcloud.com:443 HS산토끼체 2.0 해당 폰트의 지적 재산권은 토끼네활자공장에 있습니다. 사용 가능 라이선스를 확인하지 않아서 발생하는 손해에 관한 책임은 사용자에게 있습니다.[무료 한글폰트] HS산토끼체 2.0(2024) : 네이버 블로그 (naver.com) [무료 한글폰트] HS산토끼체 2.0(2024)HS산토끼체 .. 공감수 0 댓글수 0 2024. 6. 28.
[스터디] Vue 3 시작하기 / Vue.js 중급 강좌 수료 #인프런 공감수 0 댓글수 0 2024. 6. 24.
기술 블로그가 필요 없는 세상 10여년 전에 처음 일을 시작했을 땐, 모르는 것도 너무 많고 새로 알게 되는 것들도 많아서 블로그 하는게 즐거웠다. 처음에는 나를 위해 아카이빙 하는 용도였는데 하다보니 나랑 비슷한 어려움을 겪는 사람들이 원하는 정보를 얻어가는 창구가 되기도 했었다. 그런데 세월이 지나서 지금은 개발을 하다가 문제에 부딪히면 구글에 검색해서 기술블로그나 공식문서를 먼저 보기보다는 챗GPT에 제일 먼저 검색을 하게 된다. 구글 검색창은 내가 원하는 결과값을 정확히 보여주지 못하고, 페이지를 눌러 일일이 이 정보가 내가 원하는 정보인지 아닌지를 판독해야한다. 반면, 그 공수에 비해 챗GPT 프롬프트에 입력한 요청이 훨씬 더 정확한 답변을 내어준다. 양질의 기술 블로그는 여전히 각광받겠지만 단순히 나처럼 문제상황고 해결법만.. 공감수 1 댓글수 0 2024. 6. 21.
[Error] Warning: Received `true` for a non-boolean attribute `className`. Warning: Received `true` for a non-boolean attribute `className`. If you want to write it to the DOM, pass a string instead: className="true" or className={value.toString()}. 리액트에서 이런 에러가 콘솔에 찍히고 있었다.검색해보면 스타일드 컴포넌트를 사용할 때 뜨는 에러라고만 나오는데내 경우에는 간단하게 그냥 클래스네임을 attribute값만 적어놔서 생기는 오류였다. className을 지워주고 나니 에러가 사라졌다! 공감수 0 댓글수 0 2024. 6. 21.
2024-06-19 #오늘의영감 <Glean, 회사 내부 정보를 쉽게 검색할 수 있는 AI 서비스> https://eopla.net/magazines/17636 창업 5년 만에 연매출 500억 찍은 AI 서비스#MVP검증 #프로덕트 #마인드셋 창업 5년 만에 연매출 500억을 찍고 있는 AI 스타트업이 있습니다. 투자 잘 받은 AI 회사는 정말 많아요. 하지만 수백억씩 돈을 벌고 있는 회사는 적고요. Glean은 2조가eopla.net Q. 어떤 서비스인가요? 회사 내부 정보를 쉽게 검색할 수 있도록 도와주는 소프트웨어에요. 지난 10년 동안 SaaS 서비스들이 쏟아져 나왔어요. 슬랙, 노션, 지라, 구글 드라이브 같은 서비스들 말이죠. 팀원들이 많아지면서 누가 어떤 정보를 어디에 적어 놓았는지 파악하는 게 어려워지는 문제가 생겼고요. Glean은 수많은 SaaS 서비스들의 데이터를 통합해서 회사 내부.. 공감수 0 댓글수 0 2024. 6. 21.
keyup 이벤트와 input 이벤트의 차이 keyup 이벤트와 input 이벤트는 HTML 폼 요소(특히 및 요소)와 상호작용할 때 발생하는 두 가지 주요 이벤트로, 각기 다른 시점과 용도를 가지고 있습니다. 이들 이벤트의 차이점을 이해하는 것은 사용자 입력을 다룰 때 중요합니다. keyup 이벤트발생 시점: 사용자가 키보드 키를 눌렀다가 뗄 때 발생대상: 주로 , , 및 기타 키보드 이벤트를 수신할 수 있는 요소포함 정보: 어떤 키가 눌렸는지에 대한 정보 (event.key, event.code 등)사용 사례: 특정 키 입력을 감지하거나 키보드 단축키를 처리할 때 유용 input 이벤트발생 시점: 사용자가 입력 필드의 내용을 변경할 때마다 발생이는 키보드 입력, 마우스 붙여넣기, 드래그 앤 드롭 등 모든 입력 방식에 대해 작동대상: 주로 .. 공감수 0 댓글수 0 2024. 5. 29.
2024-02-23 #오늘의영감 <티빙 CEO, 최주희 님> 인터뷰 기사 퀄리티가 정말 좋다!두고두고 다시 읽어봐도 멋진 여성 최주희 : 기업 고민 해결사, 국내 OTT 최초 여성 CEO가 되다 최주희 : 기업 고민 해결사, 국내 OTT 최초 여성 CEO가 되다국내 OTT 업계 최초의 여성 CEO입니다. 세계 3대 컨설팅 펌인 BCG에서 경영 컨설턴트로 근무한 뒤, 월트디즈니코리아에서 아시아 사업 전략 업무를 담당했습니다. 이후 여성 패션 플랫폼 W컨셉과 명prologue.rememberapp.co.kr국내 OTT 업계 최초의 여성 CEO입니다. 세계 3대 컨설팅 펌인 BCG에서 경영 컨설턴트로 근무한 뒤, 월트디즈니코리아에서 아시아 사업 전략 업무를 담당했습니다. 이후 여성 패션 플랫폼 W컨셉과 명품 커머스 플랫폼 트렌비에서 각각 CSO(최고전략책임자), C.. 공감수 0 댓글수 0 2024. 2. 23.
2024-02-21 #오늘의영감 <다음, 7년만의 개편 예고> 7년 만에 확 바뀌는 다음 PC 화면…"실시간 이슈 한눈에" (msn.com) 7년 만에 확 바뀌는 다음 PC 화면…"실시간 이슈 한눈에" '이 시각 이슈' 박스 등 신설…'날씨'·'오늘의 숏' 우측에 추가 (서울=연합뉴스) 최현석 기자 = 카카오[035720]가 포털사이트 다음의 PC용 화면을 7년 만에 전면 개편한다. 21일 ICT업계에 따르면 카카 www.msn.com 공감수 0 댓글수 0 2024. 2. 21.
[Git] 실수로 삭제한 브랜치 복구하기 (reflog) 금융권에서 일하다보니까 인터넷망에서 작업하고, 망간 전송을 시켜서 시스템망(내부폐쇄망)에 완성된 코드를 올린다. 이렇게 작업하다보면 양쪽 레포에 동일하게 관리를 해야하는데 일이 많다보니 정신이 없어서 시스템망에는 잘 올렸는데, 인터넷망의 로컬 브랜치를 리모트 푸시를 안하고 그냥 다 지워버렸다. 순간 멘붕이 와서 멍 때리고 있다가, git 에는 분명 복구방법이 있을 것 같아서 찾아봤다. git refloggit reflog 이렇게 지난 로그가 나온다. // branch 복구git checkout -b 삭제된 브랜치 이름 HRAD@{INDEX}// commit 복구git reset --hard COMMIT-ID 참고https://7942yongdae.tistory.com/161 Git - 삭제한 b.. 공감수 0 댓글수 0 2024. 2. 15.
키워드로 되돌아보는 2023년 #코로나종식올해의 사회적 키워드는 아무래도 '코로나 종식'이 될 것 같다. 2020년 2월부터 시작된 코로나가 2023년에는 종식이라고 부를 수 있을 만큼 완화되었다. 이 재난이 언제 끝날 수 있을까 암담하던 시절이 있었지만 코로나가 믿기지 않게 전 세계를 덮쳤듯이, 믿기지 않게 우리는 또 이 재난을 헤쳐나가 일상을 회복하고 있었다. 웨딩홀 계약을 하던 2022년 9월에는 2023년 7월에는 하객들이 마스크에서 자유로워지겠지? 란 기대를 했었는데 예상대로 되어서 다행이었다. 코로나 3년이 나에게 남긴 것들은 기나긴 재택근무로 인한 사회성 감소....? #결혼올해의 개인적 키워드는 '결혼'이다. 2023년 7월에 결혼을 했다. 결혼 준비 할 때는 너무너무 힘들고, 이걸 누구 좋으라고 하는 결혼식일까 그런.. 공감수 0 댓글수 0 2023. 12. 31.
[Error] input type="number" maxlength is not working maxlength 속성은 주로 텍스트 및 비밀번호와 같은 입력 유형에 사용되어 입력 필드에서 허용되는 최대 문자 수를 지정하는 데 사용됩니다. 그러나 "number" 입력 유형에 대해 maxlength 속성은 지원되지 않습니다. 숫자 입력 필드의 경우 max 속성을 사용하여 허용되는 최대 값을 지정할 수 있습니다. 다음은 예제입니다. 이 예제에서 입력 필드는 100까지의 숫자 값만 허용합니다. 숫자 자체의 값이 아닌 자릿수를 제한하려면 maxlength와 같은 직접적인 속성이 없으므로 JavaScript를 사용하여 이러한 제약을 강제할 수 있습니다. 다음은 숫자 입력의 자릿수를 제한하기 위한 JavaScript를 사용한 간단한 예제입니다. 이 예에서 limitDigits 함수는 사용자가 숫자 입력에 값을.. 공감수 0 댓글수 0 2023. 12. 4.
[Warning] Type '{'--box-gap: string;}' has no properties in common with type 'Properties<string | number, string & {}>'. 리액트 컴포넌트에서 받은 숫자값을 CSS 변수로 지정하고 싶은데, style={{'--box-gap': `${gap}`px} 이렇게 넣으니, Warning이 떴다. 해결책은 as React.CSSProperties를 넣어주면 된다. style={{'--box-gap': `${gap}`px} as React.CSSProperties} 공감수 0 댓글수 0 2023. 11. 30.
[Error] React Hook "useState" is called conditionally. Error React Hook "useState" is called conditionally. React Hooks must be called in the exact same order in every component render. Did you accidentally call a React Hook after an early return? ✅ function component은 본문의 최상위 수준에서 호출하세요 . ✅ custom Hook은 본문의 최상위 수준에서 호출하세요 . ❌ 조건이나 루프 내에서 Hook을 호출하지 마세요. ❌ 조건문 다음에 Hooks를 호출하지 마세요 return. ❌ 이벤트 핸들러에서 Hooks를 호출하지 마세요. ❌ 클래스 구성 요소에서 Hooks를 호출하지 마세요. ❌ .. 공감수 0 댓글수 0 2023. 11. 29.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.