반응형

React 37

[webOS] React Router dom 중에서 tv에선 BrowserRouter 작동안됨

내가 처음 발견했다가, 다른 문제가 있어 안되는 것인가(앞서 포스팅한 404에러 문제 및 포트 이슈가 있어 그거인줄) 알고 시간이 없어 그냥 넘어간건데 동료직원이 해결했다. 우리가 기본적으로 쓰는 BrowserRouter는 tv에서 당연하게 먹히지 않는다. 왜냐하면 linux를 보통 쓰니까 그런데, 그걸 생각하지 못하고 왜 안되냐? 이러고 있었다. 아무튼 공식문서를 찾아본다는 생각은 안하고 있다가 이번 기회를 통해서 다시 공부했다. 분명 브라우저 말고 다른 것도 있을텐데하면서 예전에 한번 쓴 기억은 있는데 너무 오래되어 까먹은 듯... +++ 추가 에뮬레이터에서만 안되는 것 같다. Tv로 배포하는 경우 정상작동을 확인. 사이드 이펙트가 있을 것으로 보고 hash라우터에서 탈출해서 다행인 듯 ++02.28..

취업/LG webOS 2022.12.30

[Tree] react-d3-tree 미니맵 만들기.

마땅한 라이브러리가 없어 해당 라이브러리를 적용하기로 했다. https://github.com/jeremy-carbonne/react-minimap GitHub - jeremy-carbonne/react-minimap: A minimap component for React A minimap component for React. Contribute to jeremy-carbonne/react-minimap development by creating an account on GitHub. github.com npm i react-minimap --force or npm i react-minimap --legacy-peer-deps 위 명령어를 사용하는 이유는 오래되서리... 뒷 옵션은 참조할 것. https..

취업/Tree Graph 2022.12.13

[React.JS] react-d3-tree 그래프 기술 검토

간단하게 말하자면 이걸로 확정. Reactflow라는 걸출한 라이브러리가 있으나 좌표를 줘야하는 문제가 있어서 그냥 검토중에 버렸다. https://reactflow.dev/ React Flow Showcase React Flow is used by thousands of people, from solo open-source developers to companies like Stripe and Typeform. We’ve seen the library used for data processing tools, chatbot builders, machine learning, musical synthesizers, and more. reactflow.dev 해당 라이브러리 type https://bkrem...

취업/Tree Graph 2022.12.11

[next.js] 심심풀이 진행 중...

아아... 시간이 없습니다... 젠장. ㅠㅠ 개발하기에는 솔직히 템플레이트로 제작하는 것이 제일 좋지만, 그런데 돈쓰기엔 아까우니 그냥 개인적으로 개발하는 여차저차 typescript 적용해서 만드는 프로젝트가 있습니다. head, footer 완성. home 진행 중인데, 가장 첫 탭인 react-slider 적용해서 완성... 약간 비율도 안맞고, 헤더의 경우 로고와 링크 주소를 고쳐야하는 것이 있지만 기본틀은 잡혀있다. 진행해야할 페이지 로그인, 회원가입, 로그아웃, 메인페이지(홈) 상품 리스트 상품 페이지 장바구니 결제페이지 인데...언제 하니 ㅠㅠ

코딩/Next.js 2022.09.14

[nextjs] 아무생각 없이 중첩 기능을 쓰면 망한다...

import React from 'react'; import Head from 'next/head'; import Nav from './Nav'; import Footer from './Footer'; type Props = { children: any; } function Layouts({children}: Props) { return ( {children} ) } export default Layouts; // 위처럼 구성했었다. 위 처럼 내용을 구성했더니... 클릭 Nav 컴포넌트의 클릭이벤트가 아무것도 작동이 안되는 버그가 있었다. 흠.... 무엇이 문제일까? 하고 Nav바만 엄청 보고 고민하고 그랬는데, 원인은 Head였다. import React from 'react'; import Nav f..

코딩/Next.js 2022.09.13

[메타마스크] React 메타마스크 앱 브라우저 구동 테스트

간단하게 메타마스크 내에서 굴러가는 부분을 구현하기 위해서 React로 해당 부분을 구현해보았다. 목적: 로그인 값이라던가 프론트 세션스토리지와 쿠키값 소실 여부를 체크하기 위함. 로그인 인증방식에는 세션 기반과 토큰 기반으로 구성되는데, php로 접속시 헤더값인 세션이 삭제되어 로그인 유지가 안되는 끊김이 생기는 문제가 발생하고 있었다. 그래서 React 세션스토리지 저장과 쿠키값 저장을 구현해보았더니 잘되네.. 서버 통신해서 success를 주기로 구성해놨더니 그 값을 잘 받아와서 저장하더라. 이번에 기능을 구현하면서 발견한 점이 React에선 내부 통신이 안된는 것 같더라. php는 내부 통신을 통해서 해당 Controllers에 접근하여 외부 통신을 다르게 하고, 호출시 아예 도메인을 분리하여 사..

취업/Metamask 2022.05.16

[RN] 개인사이드 프로젝트 1

기존에 개발하다가 때려친 사이드 프로젝트를 진행하고자한다. 이걸 왜 하느냐? 그냥, RN으로 어플 하나 만들어서 써보려고. 일단 이전에 날 좌절시킨 이유로 UI를 만들어보기로 했다. Template을 찾아봤는데, 없네..? 왜 그런가 했더니 expo 전용으로 나왔거나 아니면 유료더라. 그래서 찾아봤더니 템플릿이 필요가 없더라. 그냥 UI를 불러서 구성하면 되는 것이었다. 설치해도 왜 안됨? 이러고 있었는데, 설치할 게 없청많더라. 4개를 기본으로 설치해야 작동. 차라리 부트스트랩이 나은 것 같은데 말이지. "react": "17.0.2", "react-native": "0.67.3", "react-native-elements": "3.4.2", "react-native-linear-gradient": "..

[RN]error: internal/modules/cjs/loader.js:883 error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup.

분명 신규프로젝트로 npx react-native init 프로젝트명 이렇게 했는데, 스튜디오에서 작동이 되지 않는다. 왜 그런것인가? 했는데, Desktop 경로인 것에는 한글이 없고, 바탕화면 폴더에서는 한글 경로가 껴버리는 바람에 이런 것이었다. 안드로이드 스튜디오에서 컴파일될때 한글이나 특수문자가 끼니 해당 문자가 컴파일 경로에서 방해되어 해당 부분이 작동되지 않던 것. 괜히 그래들 버전을 7.2에서 6.7로 변경하고 안드로이드 스튜디오 SDK 파일 날리고 뻘짓했었다. https://blog.naver.com/psjin312/222334408580 error: internal/modules/cjs/loader.js:883 다음과 같은 에러가 발생했다. Terminal에서 npm start 실행 시..

코딩/React Native 2022.03.06
728x90