본문 바로가기

분류 전체보기162

[React] TypeScript로 표 만드는 라이브러리 추천 안녕하세요. 제니입니다! 제가 통계 도구를 만들게 된 경험을 공유하고자 블로그를 작성하게 되었어요. 이번에 제가 만들 통계 도구 중 첫 번째인 [표]에 대한 이야기로 시작하려 합니다. 1-1. 어떤 표를 만드냐면.. 말 그대로 표를 만들건데요. 구글링에서 제가 원하는 정보를 이틀 동안 검색해봤지만 얻을 수 없었어요 ㅠㅠ 대부분, 테이블을 만드는 내용을 작성해두셨기 때문인데요! 제가 만들 표는 통계 도구 안에 들어가면서, 표의 데이터가 그래프화가 될 수 있어야하고 도수분포표나 대푯값등, 설정 해야하는 것이 다양하기 때문에 보여지는 테이블이 아닌 표 가로 행이나 열도 추가할 수 있는 기능을 만들어야 했습니다. 정말 열심히 열심히 찾다가 딱 한 개 비슷하게 발견한 라이브러리는 React Datasheet Gr.. 2023. 12. 1.
오늘의 웃겼던 개발 경험기 - 이미 정답을 알고 있었다.. 오늘은 그냥 재밌었던 경험을 남긴다. React로 파일 다운로드 하는 기능을 구현해야 하는데, 예전에 이미 구현해둔 게 있지만 자사 서비스 코드가 정~~말 많아서 새로 구글링 해야지~ 하면서 안 찾고 구글링을 하게 됐다. 구글링을 했는데 [제니의 개발일지]가 있길래 오, 여기두 제니가 있네? 하면서 들어갔는데 잉..? 내 개발 블로그였다...ㅋㅋ... 귀차니즘을 느끼면서 구글링을 하려하던 나에게 누군가 혼내는 것 같은 기분이면서도 넘 웃겨서 동료들에게 공유했는데 귀엽에 웃어주시는 인사 담당자님과 아직은 귀여워 해주는 신입 개발자 동료님과 팩폭과 함께 웃음을 주시는 8년차 개발자 동료님 지인 개발자의 카톡... 8개월 전의 제니는 귀여웠구나 조금은 성장했는지 돌아보는 계기가 된다. 왜 블로그를 써왔는지, .. 2023. 11. 23.
JavaScript 절댓값 변환 결론부터 이야기하자면 Math.abs(A - B) 형식으로 작성하면 됩니다! 1-1. 절댓값으로 변환하지 않을 때 사실 외울것도 없이, 너무 심플한 내용인데 기록하는 이유는 자꾸 놓치는 부분이 발생되어서 입니다..ㅎㅎ 개발 경험 1년 넘어가고 있다고 구글링이 많이 줄어들었는데 그러다보니, 생각 없이 코드를 짜게 되는 경우가 종종 있다는 걸 요즘 많이 느끼고 있어요. 포인트와 마일리지를 동시에 사용할 수 있는 상황이었는데 포인트가 마일리지보다 클 수도 있고 마일리지가 클 수도 있는 조건이 있기 때문에 처음에 별 생각 없이 이런식으로 코드를 짠 거죠.. 사실 이런 코드가 문제가 되는 건 없다고 생각은 하는데, 문제는 함수가 너~~무 길어지고 조건이 많아질수록 프론트 개발자로는 한 눈에 안 들어오는 코드가 될.. 2023. 11. 23.
[react-calendar] 프로젝트에 달력 적용하기 TypeScript, react-calendar webpack 문제 해결 안녕하세요. 제니입니다! 오늘은 react-calendar 를 프로젝트에 적용한 기록을 남기려고 합니다. 그동안 여러 프로젝트에 적용을 했지만, 할 때마다 미루게 됐었는데요 ..! 이번엔 잘 기록해 두려고 합니다 ㅎㅎ 1-1. react-calendar 라이브러리 // npm npm install react-calendar // yarn yarn add react-calendar 저는 yarn을 사용하기 때문에 yarn add로 라이브러리를 설치해주었습니다. 1-2. 초기 적용 참고: https://github.com/wojtekmaj/react-calendar/blob/main/packages/react-calendar/README.md react-calendar의 github을 참고하면 쉽게 적용할 .. 2023. 11. 1.
[React] styled-component 복잡한 스타일 코드 개선 안녕하세요. 제니입니다. 오늘 정리하고 싶은 내용은 복잡한 기능은 아니지만, 프론트엔드 개발자에게 필수 역량이라 할 수 있는 style 관련한 이야기를 하려고 합니다. 최근엔 Chakra UI로도 작업해봤지만, 평소엔 styled-components를 사용하고 있는데요. Chakra UI의 inline style의 장점도 느꼈다가 styled-components로 다시 작업하려고 보니 style 코드가 길어지면서 너무 복잡하더라구요. 사실 코드를 쓴 저는 또 금방 찾기는 하지만, 협업을 하니까 코드가 한 눈에 보이는 게 좋은 것도 있고 또, 저는 열심히 UI를 만들어 놨더라도 동료가 UI가 왜 그렇게 작성되었는지, 또는 재사용이 되었는지 체크를 하지 않았을 경우 UI가 무너지는 현상을 꽤 여러번 겪어서 .. 2023. 9. 8.
[React] 날짜, 시간을 type int 형일 때 unix 타임 스탬프 변환하여 서버에 보내주는 방법 안녕하세요. 오늘은 서버와 통신할 때, int 형으로 날짜 및 시간을 보냈던 기록을 남겨보려고 합니다. 프론트엔드 개발자들 입장으로 시간은 보통 받는 경우가 더 많으니까 예를 들어 createdAt처럼 만든 날짜! 이런식으로 ? 그러다보니 보내주는 경우에 어떻게 해야 할까 고민이 들었습니다. 왜냐하면, 일단 기획에서 만들어진 형태가 이런 형태였기 때문에, 날짜도 연, 월, 일 따로 받아서 넣어줘야 하고 시간도 시, 분을 나눠서 받아주어야 했기 때문에 조금 더 고민이 들었거든요. 물론 state 나눠서 정보를 관리하면 되긴 하지만, 16223344000 처럼 보내야 하니까 그걸 어떻게 보내야 하지? 라는 궁금증이 바로 생겼어요. 안 해봤기 때문에,,! 옙 제가 안 해봐서 열심히 또 구글링을 했습니다. (이.. 2023. 6. 22.

티스토리툴바