개발(250)
-
React 19 Beta 번역
원문: https://react.dev/blog/2024/04/25/react-19#support-for-metadata-tags React 19 Beta – ReactThe library for web and native user interfacesreact.dev React 19 BetaReact 19 베타는 이제 npm에서 사용할 수 있습니다! 이 게시물에서는 React 19의 새로운 기능과 채택 방법에 대한 개요를 제공합니다. 이번 베타 릴리스는 라이브러리가 React 19를 준비하기 위한 것입니다. 앱 개발자들은 18.3.0으로 업그레이드하고 피드백을 기반으로 라이브러리와 협력하여 React 19가 안정적으로 유지될 때까지 기다려야 합니다. React 19 베타는 이제 npm에서 사용할 수 ..
2024.04.29 -
Warning: Maximum update depth exceeded. This can happen when a component calls setState inside useEffect, but useEffect either doesn't have a dependency array, or one of the dependencies changes on every render.
문제의 코드 useEffect(() => { if (selectedData !== selectedRowKeys) { setSelectedRowKeys(selectedData) } }, [selectedData]) useEffect(() => { if (verifiedColumns.length > 0) { if (useCheckbox) { setSelectAddColumns([ { //todo 컬럼 추가 title: ( ..
2024.04.17 -
[Find_Similar_Colors] for CSS Desingner (셀레니움 + 크롤링)
셀레니움을 활용하여 크롤링해와 사용자가 원하는 색상과 비슷한 색상들을 추천해주고 보여주어 클립보드에 쉽게 복사할 수 있게끔 해주는 페이지 https://github.com/ravenkim/Find_Similar_Colors GitHub - ravenkim/Find_Similar_Colors: for CSS Desingner for CSS Desingner. Contribute to ravenkim/Find_Similar_Colors development by creating an account on GitHub. github.com 원하는 색상 입력시 그거와 비슷한 색상 리스트를 api로 박아와서 색상 변화를 보여줌 버튼으로 원하는 형식을 복사 가능
2024.04.15 -
원티드 디자인 (피그마)
https://www.figma.com/file/dlV8uoVBqmLL5aMndxfYb2/Wanted-Design-Library-(Community)?type=design&node-id=0%3A1&mode=design&t=eez8sTtLwSz7Sq1s-1 Figma Created with Figma www.figma.com
2024.04.03 -
노드 자바 성능 비교
사실상 차이가 없긴 합니다. 간단한 경우 ' 실제로 둘의 비교 그래프를 봐도 처리량, 실행시간, 메모리 사용량 모든 부분에서 Node.js + typescript가 우세한 것을 볼 수 있습니다. 물론 위 그래프는 CPU 사용량이 적은 간단한 I/O 요청의 경우입니다. ' 복잡한 경우 위 그림은 동일한 처리를 하는데 걸리는 수행 시간을 비교한 그래프로써 CPU를 사용하는 연산이 많아질수록 Node.js의 처리 수행 시간이 급격히 증가하는 것을 볼 수 있습니다. 즉, CPU 연산이 많을수록 Spring이 유리하며, 간단한 I/O가 많은 경우에는 Node.js가 유리한 것입니다.
2024.04.03 -
[React] 리액트 차트 라이브러리 추천 비교 분석 (무료, 유료) 19 + 6 종
조건! 영어를 지원하고(중국어만 있는거는 패스) JS 혹은 Ts 로 만들어져서 도입이 쉬운 리액트 차트들로 목록화 했습니다. 무료의 경우 깃허브 stars or 사용해본 지인 추천 ------------------------무료------------------------ 1. FL 차트 https://app.flchart.dev/#/line FL Chart App app.flchart.dev 2. react-chartjs-2 https://react-chartjs-2.js.org/ react-chartjs-2 | react-chartjs-2 React components for Chart.js react-chartjs-2.js.org 3. recharts https://recharts.org/en-US ..
2024.04.03 -
react 차트 라이브러리 종류 비교 14종!
리액트에서 이악물고 쓸수 있는것들 위주로 1. FL 차트 https://app.flchart.dev/#/line FL Chart App app.flchart.dev 2. 차트js 2 https://react-chartjs-2.js.org/examples/stacked-bar-chart Stacked Bar Chart | react-chartjs-2 Example of stacked bar chart in react-chartjs-2. react-chartjs-2.js.org 3. recharts https://recharts.org/en-US 4. nivo https://nivo.rocks/ Home | nivo nivo.rocks Bar chart | nivo Bar chart which can dis..
2024.03.29 -
10만건 이상의 데이터 in front (테이블 개선)
사건개요 antd table 사용중 클라이언트: 개발자님 이거 스크롤로 보고싶어요 >> 인피니티 스크롤 적용시 버버버버버벅 대는 화면을 발견 원인 너무 많은 div가 있으면 보여줄 수 가 없다 가상화 도입!!! 여기서부터 맨탈 와르르 antd 4.0 은 가상화 직접 구현 추천받은 라이브러리 https://github.com/bvaughn/react-virtualized GitHub - bvaughn/react-virtualized: React components for efficiently rendering large lists and tabular data React components for efficiently rendering large lists and tabular data - bvaughn/..
2024.03.28 -
2개의 map vs 1개의 reduce 속도 비교
console.time() const updatedEntireKeyList = data.map((value, index) => { return index + 1 }) setEntireKeyList(updatedEntireKeyList) const keyUpdatedData = data.map((value, index) => ({ ...value, key: index + 1, })) setKeySetData(keyUpdatedData) console.timeEnd() console.time() const result = data.reduce( (acc, value, index) => { const newItem = { ...value, key: index + 1 } acc.keyUpdatedData.pus..
2024.03.25 -
윈도우 호스트 파일
C:\Windows\System32\drivers\etc 경로에 있는 호스트 파일은 인터넷에서 컴퓨터 이름을 IP 주소로 매핑하는 역할을 합니다. 간단히 말해서, 인터넷이나 네트워크 상에서 컴퓨터나 서버를 찾을 때 사용하는 '주소록'과 같은 역할을 해요. 예를 들어, 웹사이트의 주소(도메인 이름)를 웹 브라우저에 입력하면, 일반적으로 DNS(Domain Name System) 서버가 해당 도메인 이름을 실제 IP 주소로 변환하여 해당 웹사이트에 접속할 수 있도록 도와줍니다. 그런데 컴퓨터의 호스트 파일에 특정 도메인 이름과 IP 주소를 미리 지정해 두면, 브라우저는 DNS 서버에 요청을 보내지 않고 바로 호스트 파일에서 매핑 정보를 찾아 해당 IP 주소로 접속하게 됩니다. 이 기능은 네트워크 테스트나 개..
2024.03.15