e7e

react-router가 업그레이드 되는 바람에,기존 코드의 import가 문제되어 끝내 수정하는 수고를 하고 만당. 아니 또 누군가는 Tree 컴포넌트를 쓰고 싶단다.jstree는 jquery가 필요한 jquery 플러그인이닝, React를 쓴다면 과감없잉 버릴깡? rc-tree란 게 있당. 중국말 설명이 중국산인가 보당. 아래 npmjs에 가면 api가 테이블로 정리 되어 있당. 지금은 대략 눈치껏 확인 정도만...https://www.npmjs.com/package/rc-tree 아래 링크 가면, 실행 예제와 소스를 볼 수 있어, 어쩔 또 올 수 밖에 없낭? 하는 느낌이당. https://tree-react-component.vercel.app/demo/draggable 시작하면 절반이라 했..

React 2025. 11. 4. 12:19

드디어 svar gantt가 쓸만하게 업그레이드 되었당. (패키지이름도 wx-react-gantt에서 @svar-ui/react-gantt로 살짜기 바뀌었당) 대부분의 간트차트가 유료인 어쩔수 없는 상황에서 svar gantt는 나름 유일한 대안이었지만가이드 문서부터 실제 실행되는 모습, 리액트 버젼 지원까지 디테일하게 따지자면...문제가 한 두가지가 아니었지만... 이제는 사용해 볼만하당.(제대로 안된 문서를 읽고 버린 시간에 미쳐버린 천둥 눈물이 썰물로 빠진당.)[결코 완벽하다는 이야기는 결코 아니당. 비 바람 번개는 여전히 하늘에 산당] 아래 링크에 가면 열심히 설명한당.https://docs.svar.dev/react/gantt/getting_started/ 바로 감정 들어가 보장.당근..

React 2025. 11. 3. 12:31

아무래도 때가 된 것 같다.이제 부터는 TypeScript로 리액트를 해보장.Node와 vscode는 당근으로 이미 설치되어 있어야 한당. TypeScript가 대략 먼지는? 아래 글을 읽고 오장 (싫다면 그러렴)2025.01.13 - [자바스크립트] - TypeScript(타입스크립트) 넌 머냥? 거두절미 하고 바로 퐁당 들어가 보장. (실무는 실체적 느끼미가 중요하당)나의 경우 react-type1(꼭 소문자로)으로 새 폴더를 만들어서 열었당. Terminal -> New Teriminal을 열고는 아래 명령어를 치장(Powershell 이 문제를 일으키면 그냥 cmd라고 치고 다시 한당)npx create-vite@latest .아래 처럼 선택 하여 본당. 참고로 rolldown-vite는 Exp..

React 2025. 10. 21. 20:03

오늘은 HJ의 요청으로 리액트 라우터에 대해 이야기를 구찌스럽게 해보려 한당.먼저 form 전송 방식이 아닌, 데이터 관련 한 것만 B/E 서버와 비동기 AJAX로 통신하는SPA(Single Page Application) 기준으로 보면 구찌 주소표시줄 URL을 관리하는 라우터가 필요한가 의구심이 들 수도 있당. (의구심이 들었다면 오히려 감각이 뛰어나미당!) AJAX에 쓰는 URL은 주소 표시줄에 나타나지 않고, 나타낼 필요도 없음이당.SPA란 것이 최종 사용자 입장에선 거의 데스크탑 앱 느끼미당.하지만 이미 최종 사용자들은 URL 자체를 즐겨찾기에 저장하거나, URL을 보고 본인이어디에 있는지를 아는 사람들도 있기 때문에 새로운 환경을 만들기 전까지는 URL 관리가필요함을 인지 하지 아니 하지 않을 ..

React 2025. 5. 16. 00:23

어찌 Context API에 대한 글이 없는 것인가? ㅠㅠ 나의 실수당.왜 없는 것인가? 생각에 생각을 도돌이표 해보닝 https://react.dev/reference/react/useContext에 나름 설명이 아주 잘 되어 있어서 그랬던 것 같다. 하지만 부족한 부분이 있다.더미 데이터를 이용했기 때문에 비동기 초기화 및 CRUD 부분이 빠져 있당.JSON-SERVER 를 이용해서 간단히 B/E를 구성하여 핵심 중요 예제(5번)인 todo 리스트 예제를 재 구성하여 보장.단순히 더미데이터를 가지고 하는 것과 실제 B/E 연동은 실행 환경 관점에서 보면 꽤나 달라 보일 수도 있당. (달라 미국 달라 달라!) 먼저 Context API를 쓰면 좋은 점은 Props Drilling은 컴포넌트 구조가..

React 2025. 5. 13. 00:23

흐름으로 보면 앞에 했어야 했던(나의 불찰이당~ ㅠㅠ) useReducer 훅에 대해서오늘 쪼메 알아 보도록 하장. 내 느끼미는 useState를 알면,useReducer는 그냥 보면 알 수 있을거라 지레 판단하는,성급한 판단의 오류를 범하고 말았당.그랬당. 다행인 건 성급한 판단의 오류를 오류동에서 했단 거시당.useState가 너무 단순하여, 조금 더 복잡한 상황에 편하게 쓰라고 만들어 주었당.문제는 편하게 쓰라고 만들어 주었는데, 처음 본 사람은 그 형태에 당황하게 된다는 거시당. https://ko.react.dev/reference/react/useReducer에 가면 설명 뿐만 아니라 예제도 잘 나와있당. react.dev 사이트는 리액트를 하고픈 개발자라면 분명 자주 들러야 할 즐겨찾..

React 2025. 5. 7. 17:50

2024.10.14 - [React] - React(리액트) 티키타카 15 ( restful, tanstack, axios)글에서 잠깐 다루었지만도 불구하고, 은폐 엄폐된 낯설다는 의견이 어느덧 분분하여 암막커튼이 오토매틱하게 스스로 뽀인또를 드러낼 수 있도록 기본 전개를 다시 해보장. 아래 tanstack 홈페이지에 가면 실시간으로 NPM 다운로드 숫자가 표시되는데, 엄청나당.https://tanstack.com/원래는 그냥 react-query였는데, 유명해져서 @tanstack 브랜드명을 가지게 되었당. 잘 쓰고싶땅?. 잘 쓰려면 아래 3가지를 일단 브레인에 단어라도 낯설지 않게 구겨넣장.[ Restful 단어가 브레인에 잔잔하게 파도친다면 이미 너무 훌륭하당!~~]QueryClient -> ..

React 2025. 4. 8. 21:32