본문 바로가기

Dev/react16

이직시즌이 되었습니다...포트폴리오는 고개를 들어주세요 / 웹 3D 포트폴리오 작업기 / R3F 야무지게 써먹기 / 프론트엔드 개발자 리액트 포트폴리오 어느새 나도 2년을 꽉 채운 개발자가 되었고, 슬슬 이직을 생각하게 되었다. 아무리 회사가 싫다 해도 뚝딱 그만두고 이직을 할 수 있는 현재의 IT 고용시장이 아니기 때문에(...) 차근차근 이직 준비를 시작해보려고 한다 그래서 가장 먼저 만들어야겠다고 생각한게 포트폴리오다! 지금 다니는 회사에 들어오기 전 만들었던 포트폴리오는 진짜 하루이틀 밤샘해서 급하게 만든거라 딱 그정도의 퀄리티라.. 어디 보여주기 부끄러울 정도라 다시 깔끔하게 만들어보기로 했당 이번엔 포트폴리오를 만들면서 내가 편하게 사용하는 것들로 간단한 보일러플레이트도 만들어 볼 수 있어서 겸사겸사! 결과물 먼저 남겨두고 총총..==33 기간은 약 한달~5주 정도 걸렸다! https://github.com/hyeoz/hyeoz-portfol.. 2024. 4. 8.
Ant Design DatePicker 설명회 / 유일하게 중국이 믿음직스러워지는 순간 / 터져나오는 휴먼에러 이벤트를 생성하고 진행하는 서비스를 개발하면서, date picker 를 지겹도록 쓰는 데.. 쓸 때 마다 새롭고 개발할 때마다 새로운 조건이 생겨서 정리나 해볼까 하고 글을 써본당 기본적으로 우리가 사용하는 date picker 는 요렇게 생겼다. 날짜와 시간을 설정할 수 있는 형태! 그리고 시간은 10분이나 30분 단위로 선택 가능하다. https://ant.design/components/date-picker DatePicker - Ant Design An enterprise-class UI design language and React UI library with a set of high-quality React components, one of best React UI library for en.. 2023. 12. 31.
웹 개발자로 입사해서 앱 개발까지 하고있는 썰 푼다.../리액트 네이티브 박치기 / 기본 문법부터 라이브러리 사용까지 안녕 여러분,,.... 약 두 달 간 프로젝트에 온갖 양기를 빨리고 돌아온 혜오즈입니다 진심 지난 두 달 동안 안좋은 생각이란 안좋은 생각은 다 하고 온 세상 스트레스와 피로를 얻었는데, 곧 추가근무로 인한 긴 휴가를 떠나기 때문에 어떻게든 좋게 생각해보려고 하고 있는 요즘입니다....ㅎㅋ (TMI 이지만 사람때문에 상처받고 사람때문에 치유받는 요즘이지만 그래도 사람이 싫기때문에 사람이 없는 곳으로 떠나볼까 합니다,,,,) 암턴 역대급 짧은 기간, 역대급 빌런들, 역대급 업무량 ,,, 등 안좋은 부분에서 역대급을 찍은 프로젝트였기에 이제는 어떤 어이없는 요구사항이나 업무가 들어와도 당황하지않는 능력을 얻었는데요... 그러다보니 갑자기 배운 적도 없는 리액트 네이티브를 해야 한다는 말을 들었을 때 하하-!.. 2023. 11. 2.
compound component pattern / 리액트 디자인 패턴 / 디자인 시스템의 길은 멀고도 험하구나 저번 포스팅에서 볼 수 있듯, 이번 프로젝트를 진행하며 사내 개발팀 공용 디자인 시스템의 개발과 배포를 맡았다. 2023.01.08 - [Dev/react] - 프론트엔드라면 디자인 시스템 하나 정도는 가지고 있어야 한다 카더라 / storybook 으로 디자인 시스템 개발 / npm 배포 오류가 나거나 css 이슈 등 소소하게 패치를 하고 있었는데, 이번 연휴에 팀원들이 휴가 등으로 자리를 비우며 뜨는 시간에 팀장님께서 우리 디자인 시스템의 코드에 대해 봐주시며 리액트 디자인 패턴 중 Compound component pattern 에 대해 말해주셔서 적용해보기로 했당 리액트 디자인 패턴 일단 리액트 디자인 패턴이란 뭘까여! 재사용가능한 컴포넌트를 다른 use case 에 맞게 만들 수 있도록 컴포넌트.. 2023. 1. 30.
formik 라이브러리 쓰면 쉽겠지?ㅋㅋ(겠냐고) / 복잡한 폼 다루기 / 추가되는 폼 / fieldArray 중첩 오늘은 이번 주 동안 나를 힘들게했던....form 에 대해서 간단히 정리해보려 한다,, 일단 내가 구현해야했던 구조의 form 은 그림과 같이 추가되는 항목이 있는 한 세트의 폼이 또 추가되는 형식...? 전에 구현했던 페이지를 그대로 가져와서 디자인만 수정하면 된다고 생각했는데, 이전과 비즈니스 로직이 수정되면서 form 기능을 다시 구현해야 했다,,, 기존에는 파란색으로 표시한 것과 같이 타이틀, 타입, 콘텐츠가 하나의 폼이라 폼 작성 -> 추가 -> api 요청 -> 다른 폼 작성 ... 과 같은 과정이었다면, 바뀐 로직은 폼 작성 -> 추가 -> 작성 -> 추가 ... -> 한꺼번에 api 요청 이렇게 되면서 form 기능을 처음부터 구현해야했다...ㅠㅠ 그럼 문제가 뭐였는지, 이 기능을 어떻게.. 2023. 1. 20.
프론트엔드라면 디자인 시스템 하나 정도는 가지고 있어야 한다 카더라 / storybook 으로 디자인 시스템 개발 / npm 배포 프론트엔드 개발자는 디자인 시스템으로 완성된다던데 (아님 이번 프로젝트를 총 4명의 개발자가 진행하며 같은 기능을 작업하더라도 서로 다른 스타일로 개발하는 멀티버스(..) 문제가 있어 컴포넌트 단위의 개발! 리액트 스러운 개발! 에 대해 이야기 하다가 디자인 시스템 개발이라는 주제가 나왔다 프로젝트 시작 전 공통 컴포넌트를 개발하는 과정은 거쳤었는데, 이렇게 디자인 시스템으로 배포까지 하는 경우는 처음이었다 어쩌다보니 내가 이 디자인 시스템을 담당하게 되어, 처음 스토리북과 npm 배포까지 하게되었고 이 과정에서 겪은 고충들을 간단히 적어보려 한다,,ㅎㅎ 그럼 스타또 스토리북을 시작해보자 공통 컴포넌트를 만든다 해도 쓰는 사람이 어떻게 쓰는지 모르면 하나도 소용이 없으니까! 일단은 스토리북으로 컴포넌트를.. 2023. 1. 8.