How to add front end component

Hello Everyone,

I have successfully created my smart contract and have ran daml codegen js -o daml.js .daml/dist/FinanceTracker-0.0.1.dar . and then navigated to FinanceTracker-0.0.1. I see the files i need to build the front end.

I am confused about how to run the dev. For example, if I was writing a next.js I can run yarn dev to see the changes. I want to write the front end with next.js through typescript. Any advice would be great on how I should get started. (NOTE: Front end is not my thing, my background is predominantly in data science and data engineering. However, I want to learn how to build an end-to-end product with daml.)

The best starting point is to see a functional daml app with a frontend already, you can take a look at the basic architecture of the create daml app, (similar to create react app) and its corresponding frontend dependencies.

daml new create-daml-app --template create-daml-app

Follow the documentation below to get the frontend running, it will take less than 5 minutes to set up.
https://docs.daml.com/getting-started/index.html

I haven’t used Next before, so I can’t give you any pointers on that, but we have a @daml/react library which assists you in fetching data from the ledger, https://docs.daml.com/app-dev/bindings-ts/daml-react/index.html

This is already being used in the create-daml-app

Thank you for the quick response. I will play with it to figure it out, from what I understand of typescript I should be able to build it with nextjs and replicate the library that you have pointed out.