Univdev
취소

Element가 서로 같은지 비교하기

개요 실제로 웹을 개발하다보면 DOM Element를 직접 핸들링 해야하는 일이 은근히 생깁니다. 그럴 때, 내가 선택한 Element와 어떤 Element가 서로 동일한 Element인지 비교를 하고 싶을 때가 있는데, Javascript에서는 다행히도 isEqualNode와 isSameNode Method를 지원합니다. 사용해보기 코드 const ...

React Query로 관리하는 효율적인 서버 데이터 핸들링

React Query React Query는 네트워크에서 받아온 데이터를 관리하기 위해 처리해야 하는 다양하고 번거로운 절차들을 대신 처리해주는 라이브러리입니다. React Query npm 다운로드 횟수 주간 다운로드 횟수가 백만 회를 넘어갈 정도로 인기가 많은 라이브러리인데, 서버 데이터에 대해 어떤 문제점이 있길래 이렇게나 많은 호응을 얻을...

취업과 이직에 실패하는 여러분께

개요 출처: https://www.hankyung.com/life/article/202007146223g 저는 얼마 전, IT 업계에 정식으로 몸을 담은지 5년 차가 되었습니다. 누군가가 말하길, IT 업종에서 1인분을 하기 시작할 때는 3년차이고 어느 정도 좀 한다는 취급을 듣는 시기는 5년차라고 하더라구요. 나름 노력은 하고 있지만 배우면 배울...

Novel AI 디테일하게 사용해보기

Novel AI란? Novel AI가 궁금하신 분들은 제 이전 글을 참고해주시기 바랍니다. 지난 게시글 이후 그 이후로 10,000 Anlas 만큼 더 충전해서 이용해보았습니다. 한화로 약 1만 5천원 정도 돼요. 2일 동안 약 10시간 정도 Novel AI 서비스를 사용해 보았습니다. 그래서 이젠 어느정도 사용법을 익힌 듯 하여 여기에 다시 작성합...

Novel AI 찍먹해본 후기

Novel AI Novel AI는 요즘 유행하는 텍스트 기반 이미지 생성 서비스입니다. Dall E와 다른 점은 실사처럼 그리는 것이 아닌, 만화나 애니메이션과 같은 화풍으로 일러스트를 생성해 준다는 점입니다. 회사 Slack에 최신 기술 동향을 공유하는 채널이 있는데 여기에 심심할 때마다 나오는 얘기 중 하나가 텍스트 기반 이미지 생성 인공지능에...

React Context

Context Context는 React에서 제공하는 기능 중 하나로, 유효범위 내부에 존재하는 컴포넌트들에서 데이터를 주고받는 방법 중 하나입니다. 사용 이유 기본적으로 React 공식 홈페이지에서는 컴포넌트들의 계층이 복잡해질 때 props가 아닌 다른 방식으로 데이터를 쉽게 주고 받을 수 있다고 홍보(?)하고 있습니다. 하위 컴포넌트에게 넘겨주...

Atomic Design 설계와 Container Component

개요 저는 몇 개월 전부터 Atomic Design 방법론에 빠져있어요. 애초부터 비즈니스 로직과 UI 컴포넌트 로직은 완벽히 분리되어야 한다는 철학이 있었던 저에게 있어 Atomic Design은 그 어떤 설계방법보다 아름답다고 느꼈거든요. Atomic Design 아토믹 디자인하면 많이 보는 이미지 Atomic Design은 이미 유명한 방법론...

각도가 적용 된 사각형 도형의 각 꼭짓점 좌표 구하기

개요 회사 프로젝트를 진행하다가 어떤 영역에 배치 된 사각형이 어떤 각도로 회전했을 때, 그 사각형의 각 꼭짓점을 알아야만 하는 상황이 생겼어요. 장시간의 리서칭과 사내 개발자분의 조언을 통해 완성한 소스코드입니다. 소스코드 export const getRectPoint = ( x: number, y: number, radian: nu...