버전 비교

  • 이 줄이 추가되었습니다.
  • 이 줄이 삭제되었습니다.
  • 서식이 변경되었습니다.

...

https://jsfiddle.net


라이브러리

visjs

https://visjs.org

https://github.com/visjs

https://visjs.github.io/vis-network/examples

https://github.com/visjs/vis-network-react

https://www.npmjs.com/package/vis-network-react

https://codesandbox.io/examples/package/vis-network-react

코드 블럭
npm i vis-network-react


코드 블럭
  "dependencies": {
    "prop-types": "15.8.1",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-scripts": "5.0.1",
    "vis-network-react": "1.3.6"
  }



예제내용추가하면 좋을 것

https://codesandbox.io/s/vis-network-test-hrkqw1
  • 토폴로지
  • 노드/링크 마우스 over
  • 노드/링크 클릭


https://codesandbox.io/s/vis-network-test-gcwoy8
  • 토폴로지
  • 링크에 label 삽입





chartjs

https://blog.logrocket.com/using-chart-js-react/


Material UI

https://mui.com

기본이 되는 것은 무료로 이용 가능
https://mui.com/pricing/


코드 블럭
  "dependencies": {
    "@material-ui/core": "4.9.10",
    "@material-ui/icons": "4.9.1",
    "material-ui": "0.20.2",
    "react": "16.12.0",
    "react-dom": "16.12.0",
    "react-scripts": "3.0.1"
  },



예제내용

https://codesandbox.io/s/react-material-ui-0yqeo
  • 헤더, 푸터, Navbar
  • dropdown, text input
  • edit, view






https://goo-gy.github.io/2021-02-28-material-ui


기타

https://www.geeksforgeeks.org/how-to-create-a-multi-page-website-using-react-js/


[NPM] npm install 할 때 --save 옵션을 함께 입력하는 이유? 하지만 이제는 사용하지 않아도 되는 이유.
https://xtring-dev.tistory.com/11