명품 영수증 관리 애플리케이션 실습

며칠 정도 지나도 이전 질문에 답변이 올라오지 않아서 다시 올렸습니다.
명품 영수증 관리 애플리케이션을 튜토리얼 그대로 실습하고 있는데 상품 등록이 제대로 되지 않습니다. klaytn wallet도 발급 받아서 적용했습니다. 어떻게 하면 될지 궁금합니다.

안녕하세요. 튜토리얼 제작자입니다. 오늘 중으로 확인하고 업데이트 드리도록 하겠습니다.
처리가 지연되어 죄송합니다.

안녕하세요. 튜토리얼 작성자입니다. 질문자분과 동일한 에러인지는 파악이 되지 않는데, 제가 재현했을 때에도 에러가 발생하는 것을 확인하였고, 관련된 문제를 수정한 다음 정상 작동하는 것을 확인하였습니다. 아직 마스터 브랜치에 머지되지 않고 풀 리퀘스트로만 존재하기 때문에, 아래와 같이 제 저장소를 클론하셔서 사용하시면 체인지가 적용된 튜토리얼을 사용하실 수 있습니다.

git clone git@github.com:ehnuje/kas-bapp-luxurytracker.git
git checkout -b 0309-overall-update origin/0309-overall-update

또한, README에도 업데이트한 것처럼, 기존에 흩어져있던 KAS Credential 변수들을 client/src/Config.js에 한번만 선언하고 사용하는 형태로 변경하였기 때문에, 해당 파일에만 질문자님의 KAS Credential을 입력해서 사용하시면 될 것 같습니다.

const accessKeyId = "YOUR_ACCESS_KEY_ID_FROM_KAS_CONSOLE";
const secretAccessKey = "YOUR_SECRET_ACCESS_KEY_FROM_KAS_CONSOLE";

한번 확인해보시고, 여전히 문제가 발생하신다면 알려주세요.
감사합니다.

저는 Clone하면 왜 아래 로그가 떨어질까요,…

git@github.com: Permission denied (publickey).
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.

@maha0313 혹시 깃헙에 SSH key를 등록하셨나요? 등록하지 않으셨다면 아래의 링크를 참조하셔서 등록하신 다음 위의 명령어를 실행하셔도 되고, 아니면 아래의 명령어로 https를 통해서 요청해보시면 될 것 같습니다.

git clone https://github.com/ehnuje/kas-bapp-luxurytracker.git


우분투 20.04 환경에서 yarn dev로 실행하여 캡쳐한 화면입니다. 판매자 등록도 wallet에서 발급 받은 키를 사용했고 제품 추가하기를 해도 화면과 같이 로딩만 되고 제품 등록이 되지 않는 것은 똑같은 것 같습니다… 혹시 제가 실수한 부분이 있는지 궁금합니다.

@11112 브라우저 콘솔 로그와 node.js 로그를 같이 제공해주실 수 있을까요?

잘해결되었습니다!! 감사합니다~^^

그런데 혹시 이전 제가 안되던부분이

어떻게 수정된건지 좀 알 수 있을까요?
좀 배워보고 싶어서요~

Warning: Each child in a list should have a unique “key” prop.

Check the render method of ProductPage. See https://fb.me/react-warning-keys for more information.
in WithStyles(ForwardRef(TableCell)) (at ProductPage.js:176)
in ProductPage (created by WithStyles(ProductPage))
in WithStyles(ProductPage) (at Product.js:10)
in div (created by ForwardRef(Container))
in ForwardRef(Container) (created by WithStyles(ForwardRef(Container)))
in WithStyles(ForwardRef(Container)) (at Product.js:8)
in Product (created by Context.Consumer)
in Route (at App.js:19)
in Switch (at App.js:17)
in div (created by Styled(MuiBox))
in Styled(MuiBox) (at App.js:10)
in App (at Root.js:7)
in Router (created by BrowserRouter)
in BrowserRouter (at Root.js:6)
in Root (at src/index.js:22)
in ThemeProvider (at src/index.js:21) index.js:1
SyntaxError: JSON.parse: unexpected end of data at line 1 column 1 of the JSON data ProductPage.js:119
Warning: React does not recognize the fullWitdth prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase fullwitdth instead. If you accidentally passed it from a parent component, remove it from the DOM element.
in input (at ProductAdd.js:161)
in div (created by ForwardRef(DialogContent))
in ForwardRef(DialogContent) (created by WithStyles(ForwardRef(DialogContent)))
in WithStyles(ForwardRef(DialogContent)) (at ProductAdd.js:157)
in div (created by ForwardRef(Paper))
in ForwardRef(Paper) (created by WithStyles(ForwardRef(Paper)))
in WithStyles(ForwardRef(Paper)) (created by ForwardRef(Dialog))
in div (created by Transition)
in Transition (created by ForwardRef(Fade))
in ForwardRef(Fade) (created by Unstable_TrapFocus)
in Unstable_TrapFocus (created by ForwardRef(Modal))
in div (created by ForwardRef(Modal))
in ForwardRef(Portal) (created by ForwardRef(Modal))
in ForwardRef(Modal) (created by ForwardRef(Dialog))
in ForwardRef(Dialog) (created by WithStyles(ForwardRef(Dialog)))
in WithStyles(ForwardRef(Dialog)) (at ProductAdd.js:141)
in div (at ProductAdd.js:132)
in ProductAdd (created by WithStyles(ProductAdd))
in WithStyles(ProductAdd) (at ProductPage.js:184)
in td (created by ForwardRef(TableCell))
in ForwardRef(TableCell) (created by WithStyles(ForwardRef(TableCell)))
in WithStyles(ForwardRef(TableCell)) (at ProductPage.js:183)
in tr (created by ForwardRef(TableRow))
in ForwardRef(TableRow) (created by WithStyles(ForwardRef(TableRow)))
in WithStyles(ForwardRef(TableRow)) (at ProductPage.js:182)
in tbody (created by ForwardRef(TableBody))
in ForwardRef(TableBody) (created by WithStyles(ForwardRef(TableBody)))
in WithStyles(ForwardRef(TableBody)) (at ProductPage.js:181)
in table (created by ForwardRef(Table))
in ForwardRef(Table) (created by WithStyles(ForwardRef(Table)))
in WithStyles(ForwardRef(Table)) (at ProductPage.js:171)
in div (created by ForwardRef(Paper))
in ForwardRef(Paper) (created by WithStyles(ForwardRef(Paper)))
in WithStyles(ForwardRef(Paper)) (created by ForwardRef(TableContainer))
in ForwardRef(TableContainer) (created by WithStyles(ForwardRef(TableContainer)))
in WithStyles(ForwardRef(TableContainer)) (at ProductPage.js:170)
in div (created by ForwardRef(Container))
in ForwardRef(Container) (created by WithStyles(ForwardRef(Container)))
in WithStyles(ForwardRef(Container)) (at ProductPage.js:164)
in ProductPage (created by WithStyles(ProductPage))
in WithStyles(ProductPage) (at Product.js:10)
in div (created by ForwardRef(Container))
in ForwardRef(Container) (created by WithStyles(ForwardRef(Container)))
in WithStyles(ForwardRef(Container)) (at Product.js:8)
in Product (created by Context.Consumer)
in Route (at App.js:19)
in Switch (at App.js:17)
in div (created by Styled(MuiBox))
in Styled(MuiBox) (at App.js:10)
in App (at Root.js:7)
in Router (created by BrowserRouter)
in BrowserRouter (at Root.js:6)
in Root (at src/index.js:22)
in ThemeProvider (at src/index.js:21) index.js:1
handleClose

브라우저 콘솔 로그는 찾았는데 node.js 로그는 제가 어떻게 하는지 잘 모르겠네요… 터미널에서 로그를 긁어오는 건가요 아니면 자동적으로 로그파일이 생성되는 건가요?

@11112yarn dev 로 실행시킨 터미널에 자동으로 찍히고 있는 로그를 긁어서 보내주시면 됩니다!

yarn run v1.22.5
warning package.json: No license field
concurrently --kill-others-on-fail "npm run server" "yarn client" [0] npm WARN lifecycle The node binary used for scripts is /tmp/yarn--1615342368417-0.4962073403603491/node but npm is using /usr/bin/node itself. Use the `--scripts-prepend-node-path` option to include the path for the node binary npm was executed with. [0] [0] > luxury-receipts@1.0.0 server /home/sangjin/바탕화면/kas-bapp-luxurytracker [0] > nodemon server.js [0] warning package.json: No license field cd client && yarn start
[0] [nodemon] 2.0.7
[0] [nodemon] to restart at any time, enter rs
[0] [nodemon] watching path(s): .
[0] [nodemon] watching extensions: js,mjs,json
[0] [nodemon] starting node server.js
warning …/package.json: No license field
$ cross-env NODE_PATH=src react-scripts start
[0] Ignoring invalid configuration option passed to Connection: databsase. This is currently a warning, but in future versions of MySQL2, an error will be thrown if you pass an invalid configuration option to a Connection
[0] Listening on port 5000
[1] :information_source: 「wds」: Project is running at http://192.168.209.140/
[1] :information_source: 「wds」: webpack output is served from
[1] :information_source: 「wds」: Content not from webpack is served from /home/sangjin/바탕화면/kas-bapp-luxurytracker/client/public
[1] :information_source: 「wds」: 404s will fallback to /
[1] Setting NODE_PATH to resolve modules absolutely has been deprecated in favor of setting baseUrl in jsconfig.json (or tsconfig.json if you are using TypeScript) and will be removed in a future major release of create-react-app.
[1]
[1] Starting the development server…
[1]
[1] Compiled successfully!
[1]
[1] You can now view luxury-receipts-final in the browser.
[1]
[1] Local: http://localhost:3000
[1] On Your Network: http://192.168.209.140:3000
[1]
[1] Note that the development build is not optimized.
[1] To create a production build, use yarn build.
[1]
[0] get /api/customers/:addr
[0] post /api/products
[0] name chkrootkit symbol asdsad sellerPrivateKey
[0] (node:115456) UnhandledPromiseRejectionWarning: Error: Returned error: insufficient funds of the sender for value
[0] at Object.ErrorResponse (/home/sangjin/바탕화면/kas-bapp-luxurytracker/node_modules/caver-js/packages/caver-core-helpers/src/errors.js:74:16)
[0] at /home/sangjin/바탕화면/kas-bapp-luxurytracker/node_modules/caver-js/packages/caver-core-requestmanager/src/index.js:155:44
[0] at XMLHttpRequest.request.onreadystatechange (/home/sangjin/바탕화면/kas-bapp-luxurytracker/node_modules/caver-js/packages/caver-core-requestmanager/caver-providers-http/src/index.js:112:13)
[0] at XMLHttpRequestEventTarget.dispatchEvent (/home/sangjin/바탕화면/kas-bapp-luxurytracker/node_modules/xhr2-cookies/dist/xml-http-request-event-target.js:34:22)
[0] at XMLHttpRequest._setReadyState (/home/sangjin/바탕화면/kas-bapp-luxurytracker/node_modules/xhr2-cookies/dist/xml-http-request.js:208:14)
[0] at XMLHttpRequest._onHttpResponseEnd (/home/sangjin/바탕화면/kas-bapp-luxurytracker/node_modules/xhr2-cookies/dist/xml-http-request.js:318:14)
[0] at IncomingMessage. (/home/sangjin/바탕화면/kas-bapp-luxurytracker/node_modules/xhr2-cookies/dist/xml-http-request.js:289:61)
[0] at IncomingMessage.emit (events.js:203:15)
[0] at endReadableNT (_stream_readable.js:1145:12)
[0] at process._tickCallback (internal/process/next_tick.js:63:19)
[0] (node:115456) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
[0] (node:115456) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
[1] Proxy error: Could not proxy request /api/products from localhost:3000 to http://localhost:5000/.
[1] See Errors | Node.js v15.11.0 Documentation for more information (ECONNRESET).
[1]

여기 있습니다… 키 부분은 지웠습니다

[0] (node:115456) UnhandledPromiseRejectionWarning: Error: Returned error: insufficient funds of the sender for value

@11112 이 부분 때문에 발생하는 것으로 보이는데요, 해당 계정에 밸런스가 없기 때문에 트랜잭션을 실행하지 못해서 발생하는 것으로 보입니다. https://baobab.wallet.klaytn.com/access?next=faucet 바오밥 네트워크를 이용하시는 경우에는 이 링크에서 테스트에 사용하실 클레이를 받으실 수 있습니다. 클레이를 충전하신 다음 한번 다시 해보시겠어요?

감사합니다! 그리고 또 다른 오류가 있었는데
Error: Unknown database ‘TEST’
라고 떠서 DB 이름과 테이블 이름을 전부 대문자로 바꿔서 해결했습니다.

1개의 좋아요

@11112 네 확인 감사합니다! 이제 정상적으로 사용하실 수 있으신가요?