Using external components like Stripe Elements or other client interactions

[devraj]

Background First of all I am ecstatic that @samuelcolvin you started this project. With all the developments happening around NextJS the change back to a modern stack based around web standards is the way forward. Our hearts still lie with Python and love using SQLAlchemy, alembic, pydantic and FastAPI (having moved to it from our home grown API building framework) to build out the backend of our applications.

you can build responsive web applications using React without writing a single line of JavaScript, or touching npm.

would be a state or nirvana.

JSON APIs aren't going anywhere, specially with services like Stripe calling back and the general need for integration between services. FastAPI is well suited for that.

At present our approach is using NextJS to build a front end, which speaks to a Python backend. We maintain our working template of our server infrastructure, if you wish to have a look at it.

Context This might already be catered for but might be a question because FastUI is still being developed and formal documentation is yet to come.

I have also noticed questions (which also came to mind) around using Tailwind #36 and if a question like that is a misunderstanding of how FastUI components work.

I am yet to get my head around how the machinery works between us writing Python and the frontend using React? So please pardon my ignorance.

Question To add to the discussions around others asking for additional components. More often than not we need to vendor in things like Stripe Elements which offers React support.

Extending the same thought to little client side sprinkles where you wish to call the server side from a client interaction e.g video play back calls the server back to save progress time.

How would this fit into the FastUI paradigm?

[samuelcolvin]

There's a few things here, and I'm super busy today so I'll try to answer quickly - if there are things I missed, please reply.

The intended way to support component that don't belong in FastUI is to use custom components #19, @paddymul has some comments about custom JS/TS on that issue which I'll address in a minute.

But the default way to support custom components is to build your own react app, install the fastui package, use the FastUI component and write your own components for the custom components you've added.

Extending the same thought to little client side sprinkles where you wish to call the server side from a client interaction e.g video play back calls the server back to save progress time.

I think this is just the current ServerLoad component and PageEvents, which mostly just need better documentation.

[betocerutti]

I was also wondering how to make two components communicate with each other... something that is often needed on large pages.

But let me say that overall it looks very promising, keep up the good work!