how to use

[bitcorr]

I am a newbie in TS.
Couldn't figure out anywhere how to use this awesome library.

How can I know what to use and where to import it from? on this website it only shows you the tag it uses, but not where to import it from.

Also, I find it very confusing as there is almost no explanation.
Will appreciate any help or some example code if there is one.

Thanks.

[dev-nll]

I agree the docs could be extended a bit to help people figure out how to use it inside of their projects.

However, if you don't need to modify/change react-financial-charts itself, and you're happy to use it as-is, it's fairly easy. You can simply follow the installation instructions in the docs (npm install react-financial-charts etc) in your project, and then copy and paste this file (a working example) into your project. You should be able to get that to run if you're using React+Typescript and if you install the required dependencies (in your index file simply import StockChart from this file, and render it). Try to build/run your project with this copied StockChart.tsx and it'll tell you what dependencies you need to install (e.g. d3-format and so on) which you can do one by one until the error messages go away. Once you've installed those dependencies then the chart should display in your project.

If you need help setting up a React+Typescript (+webpack) project from scratch, this is a good guide: https://www.newline.co/@bespoyasov/how-to-create-a-react-typescript-application-from-scratch--676bd120

If you need to actually edit the code inside react-financial-charts and have those changes reflected in your project, that's a bit trickier. You need to checkout the git code into a separate folder. Build that code following the instructions in the docs. Then cd into every subfolder inside ../react-financial-charts/packages and type npm link. Then go to your main project's folder and type npm link react-financial-charts @react-financial-charts/series @react-financial-charts/stories @react-financial-charts/annotations @react-financial-charts/axes @react-financial-charts/coordinates @react-financial-charts/core @react-financial-charts/indicators @react-financial-charts/interactive @react-financial-charts/scales @react-financial-charts/tooltip @react-financial-charts/utils (alternatively, for this last step, you can add it to webpack as a predev script, if you're using webpack).