This was a great tutorial. You have a great presentation style. I had never heard of this UI framework until I randomly saw it here on your profile. Please do more with FastUI.
I'm really happy to see this project become a thing. I've been looking at how to add a simple UI on top of the API's I've been making in FastAPI. There just wasn't much that tied in well with FastAPI without reimplementing code for another framework. Essentially I was just getting into writing a Streamlet program that just calls the API from FastAPI behind the scenes. I wasn't the most thrilled with that solution. This is a much better direction.
Very interesting. I wonder why they chose to be generating a React application as the underlying browser technology (and not just HTML and bound event handlers on the generated tags)
I guess because it's faster to do it this way in a manner that is both useful and easier to style. I would love it being HTMX but that would require much more human hours, no?
Excellent video! I share the concern of abstraction overload: Using React to create a simple UI seems overkill, plus you are adding a whole ecosystem of unknown bugs/constraints. But as a reasonably simple interface for declarative definition of simple UIs, it looks very promising.
FWIW, I used GPT4 to rewrite the basic app to manipulate a different data set. Another video on how to digest a different API and generate a UI for that API would be very interesting.
Interesting library, but that's about it. Going with HTMX, Phoenix Framework or Blazor makes more sense than a Python library that abstracts HTML even further by using.... React of all libraries.
it would be nice to have a pagination example with db in the backend. so as the user clicks on the page a new query is issued per page on the db. If there is a lot of data how one would return a table effciently ?
It's very early stages so I expect more to be added. But you can attach classes to each component - so it's (probably) possible to create a multi-column structure with Bootstrap classes. Maybe an idea for another video!
Thank you very much, the video is very nice. I just wondering that: When we type "localhost:8000/api/" to address bar of browser, can it show the page that we design instead of json or raw data?
@@bugbytes3923 Thanks for your reply. I am very new in web development, so that would you please help me some hint to display the UI that I made with FastUI when user call an API (for example: localhost:8000/api/) on their web browser.
I have built many apps with streamlit for various prototypes. I'm currently working with fastUI on a new project. It's a bit apples and oranges. Streamlit has a very unique operating model with the code being re-executed with every user interaction. This uniqueness has the benefit of making the development pattern. Far more approachable for somebody that is only used to working in Jupyter notebooks. However, it's a closed garden and you can't just inject a little bit of streamlit into an existing code base. Also, I find the performance to be lacking. FastUI is not for somebody that only knows how to write pandas code in a notebook. If you're the kind of person that knows how to work on back end APIs, this thing is a killer. It integrates into an existing fast API app very easily. Performance is phenomenal. They did a very good job of making sure the react front end is nice and snappy. And you get the SSE out of the box!
HI, thanks for the introduction. I like fastapi. This is one of the missing pieces to get rid of Django easily. Is there a way to customize the bootstrap components?
You can pass a "class_name" to components to customize the classes used (from Bootstrap, or custom CSS). I'm preparing another video which I'll release next week on database integration, will include a bit on styling!
what do you think of generate AI writing the front-end UI code for you so you don't need to do as much styling? There are multi-modal models that can take an image of a design and implement most of the html/css with good accuracy
Below is not meant to critic the video, but instead my view on general: I don't get the overall anti-JS mindset in the Python community...Javascript itself is not that hard, it's arguably the 2nd easiest programming language next to Python. 1.5 year ago I started learning Python (I came from non-programming background), this year I learn Javascript. Now I can implement whatever (simple) JS I need for my webapp. No JS framework needed (avoid the JS framework hell), just use pure vanilla JS + HTML + vanilla CSS is more than enough. Also looking at FastUI official demo website, I think this will become like Bootstrap: everyone everywhere using the same template so everything looks similar. Great informative video though! can someone share FastUI project that showcase what a fullblown use of FastUI is capable of?
Interesting perspective, thank you for sharing and the video suggestion! My own opinion (could be wrong) is that the Python community has a lot of programmers who are not necessarily web developers, but who want to build small apps for their work. For example - in the data/AI space - lots of developers and engineers who might prefer to spend their time elsewhere, rather than learning JS SPA frameworks or even building things out with JavaScript itself. This makes these options like HTMX and FastUI much more amenable - these tools can abstract away details and let the developer focus on the functionality in Python. However, if you're building enough web apps with enough complexity, then of course you'll be better served learning the underlying technologies like JavaScript/CSS etc.
@@bugbytes3923 yes I agree I did use Bootstrap a lot on my early Python days and it did helped a lot to create a quick small/simple app...I think FastUI will achieve something similar: make it less painful / much easier to deal with frontend. So yeah it's ideal for people with not much interest on frontend stuff. The issue I got Bootstrap was too limiting / not flexible enough and most websites that use Bootstrap ends up looking similar --> this is my concern and hence why I asked if there's a project that showcases FastUI capabilities. If FastUI ends up being easy to use while maintaining flexibility and highly customizable --> this would be perfect ❤
I would also be very happy with this video if i have seen it two years ago . I hated js and was running away from js. Then just learned it and now i do most of the things in js . But still miss python and try to use it whenever possible . It is not something against js it is just mindset difference between python and js . In js we have callbacks i did not understand those earlier . Now python also supports async await but the i dreaded those in js . Python and is are similar bcz they are dynamic but there philosophy is totally different . Python developer should try Svelte if they fear js . They will love it as i do now 😂
@@bugbytes3923 I fully agree on that one! I am a data engineer and I use python a lot. Sometimes I need a quick web app to do some work like proof of concepts. I don't really care about learning all the web development stuff as it is not my job to create full-blown web applications. I think that FastUI is ideal for my purposes. Now I am usually building Rest API's and use Postman to load data for these purposes. But the problem there is that if users in the program have to work with Postman, then they are lost. Building a quick web app with FastUI will definitely be a game changer.
The sheer irony of Py developers calling their not fast things Fast(API)(UI). They're sipping that copium. (also notice how fast languages don't use fast in the name)
More videos on this framework please. You do a fantastic job in all of your videos. I love the way you explain things line by line.
Got it - will have a think about what to do next. Thanks!
@@bugbytes3923 Would love to see this working in Django with templates/postgres based data- excellent video as always!
This was a great tutorial. You have a great presentation style. I had never heard of this UI framework until I randomly saw it here on your profile. Please do more with FastUI.
Thanks a lot for the nice words! I'll need to get some more prepared for FastUI, for sure.
@@bugbytes3923 It would be interesting to see it styled with Bootstrap.
I'm really happy to see this project become a thing. I've been looking at how to add a simple UI on top of the API's I've been making in FastAPI. There just wasn't much that tied in well with FastAPI without reimplementing code for another framework.
Essentially I was just getting into writing a Streamlet program that just calls the API from FastAPI behind the scenes. I wasn't the most thrilled with that solution. This is a much better direction.
ever tried PyWebIO?
Very interesting. I wonder why they chose to be generating a React application as the underlying browser technology (and not just HTML and bound event handlers on the generated tags)
I guess because it's faster to do it this way in a manner that is both useful and easier to style. I would love it being HTMX but that would require much more human hours, no?
Depends on use cases and architecture you want to implement.
Excellent video!
I share the concern of abstraction overload: Using React to create a simple UI seems overkill, plus you are adding a whole ecosystem of unknown bugs/constraints.
But as a reasonably simple interface for declarative definition of simple UIs, it looks very promising.
Definitely a valid point, regarding abstraction overload.
Nice intro to something really different for python UIs.
Thanks a lot! (Big fan of the podcast btw, awesome job!)
Yes, I'm very interest in this fastUI library. Please could you go and show us what it is capable of ?
Wow always surprising us with new stuffs. Thank you so much Master !
Thanks a lot!
FWIW, I used GPT4 to rewrite the basic app to manipulate a different data set. Another video on how to digest a different API and generate a UI for that API would be very interesting.
Great vid please do more on this FastUI like add css or something of that nature, thanks.
Thanks a lot! Will add a new FastUI one tomorrow.
that looks very promising !!
Interesting library, but that's about it. Going with HTMX, Phoenix Framework or Blazor makes more sense than a Python library that abstracts HTML even further by using.... React of all libraries.
it would be nice to have a pagination example with db in the backend. so as the user clicks on the page a new query is issued per page on the db. If there is a lot of data how one would return a table effciently ?
as always, best content I could find on the internet!
Thanks a lot!
Totes. I’d love to see the build of a sophisticated app with this.
Thanks, will have a think about what we can do!
Kudos to you dude, your videos are top quality.
Thanks a lot for the nice comment, much appreciated!
Cannot import FormResponse because is not part of FastUI.forms no more
Instead return c.FireEvent(event=GoToEvent(url="/endpoint"))
Very nice tutorial. Thank you!
Great video, looks promising.
Thanks a lot!
Love it.
Thanks a lot!
Great one.
Thanks a lot!
Great video, FastUI has some potential. However basic functions like a multi-column layout seem to still be missing.
It's very early stages so I expect more to be added. But you can attach classes to each component - so it's (probably) possible to create a multi-column structure with Bootstrap classes. Maybe an idea for another video!
your videos are always great! It will be fantastic if you create a tutorial on django, postgres and flet like a todo app...!!
Thanks a lot - will look into Flet asap!
Awesome! There is a huge following for flet alone and almost no good tutorials on that subject@@bugbytes3923
Thank you very much, the video is very nice.
I just wondering that: When we type "localhost:8000/api/" to address bar of browser, can it show the page that we design instead of json or raw data?
Thanks! Yes, you can show web pages at your URL routes.
@@bugbytes3923 Thanks for your reply. I am very new in web development, so that would you please help me some hint to display the UI that I made with FastUI when user call an API (for example: localhost:8000/api/) on their web browser.
Great video! How do you find out about new libraries like this? Thanks
Thank you! I typically look on Reddit and Twitter.
This is a good resource to see what's trending too: github.com/explore
Great video. Thanks
Thanks so much!
I wish I could just use jsx
any babel equivalent in python or another transpiler that allows us to extend the syntax with a build step?
Great video . But i am watching Peaky Blinders now days so I enjoyed your accent as well 😂 What is this accent Scottish?
Haha thank you - Peaky Blinders is great!
Yes, from Glasgow, Scotland 😂
holy moly, a button!
how does this compare to streamlit and others like it?
I have built many apps with streamlit for various prototypes. I'm currently working with fastUI on a new project.
It's a bit apples and oranges. Streamlit has a very unique operating model with the code being re-executed with every user interaction. This uniqueness has the benefit of making the development pattern. Far more approachable for somebody that is only used to working in Jupyter notebooks. However, it's a closed garden and you can't just inject a little bit of streamlit into an existing code base. Also, I find the performance to be lacking.
FastUI is not for somebody that only knows how to write pandas code in a notebook. If you're the kind of person that knows how to work on back end APIs, this thing is a killer. It integrates into an existing fast API app very easily. Performance is phenomenal. They did a very good job of making sure the react front end is nice and snappy. And you get the SSE out of the box!
HI, thanks for the introduction. I like fastapi. This is one of the missing pieces to get rid of Django easily.
Is there a way to customize the bootstrap components?
You can pass a "class_name" to components to customize the classes used (from Bootstrap, or custom CSS). I'm preparing another video which I'll release next week on database integration, will include a bit on styling!
@@bugbytes3923wow, answer on x-mass eve. I am impressed. Thanks mate!
why not streamlit or taipy?
Thk you
Excellent choice
The UI is very basic of course, how would you use this framework with a better UI?
is it like JSX? can we use HTMX on it or not?
Good approach but complicated syntax . Streamlit is bit easier for quick implementation .
If you knwo htm,css and jQuery for example, actually you don't need fast ui
True, it's more a tool to build simple webapps for people who aren't webdevs (data scientists, etc)
Can you cover SSE demo as well
I'd like to add this, will try and schedule that into the plans.
what do you think of generate AI writing the front-end UI code for you so you don't need to do as much styling? There are multi-modal models that can take an image of a design and implement most of the html/css with good accuracy
isnt the point of react to not have to refresh the webpage for every click and action? :S
And it doesn't (in FastUI). What I see in devtools is that page change downloads only new data in json format, not everything again.
Below is not meant to critic the video, but instead my view on general:
I don't get the overall anti-JS mindset in the Python community...Javascript itself is not that hard, it's arguably the 2nd easiest programming language next to Python.
1.5 year ago I started learning Python (I came from non-programming background), this year I learn Javascript. Now I can implement whatever (simple) JS I need for my webapp.
No JS framework needed (avoid the JS framework hell), just use pure vanilla JS + HTML + vanilla CSS is more than enough.
Also looking at FastUI official demo website, I think this will become like Bootstrap: everyone everywhere using the same template so everything looks similar.
Great informative video though! can someone share FastUI project that showcase what a fullblown use of FastUI is capable of?
Interesting perspective, thank you for sharing and the video suggestion!
My own opinion (could be wrong) is that the Python community has a lot of programmers who are not necessarily web developers, but who want to build small apps for their work. For example - in the data/AI space - lots of developers and engineers who might prefer to spend their time elsewhere, rather than learning JS SPA frameworks or even building things out with JavaScript itself.
This makes these options like HTMX and FastUI much more amenable - these tools can abstract away details and let the developer focus on the functionality in Python. However, if you're building enough web apps with enough complexity, then of course you'll be better served learning the underlying technologies like JavaScript/CSS etc.
@@bugbytes3923 yes I agree I did use Bootstrap a lot on my early Python days and it did helped a lot to create a quick small/simple app...I think FastUI will achieve something similar: make it less painful / much easier to deal with frontend. So yeah it's ideal for people with not much interest on frontend stuff.
The issue I got Bootstrap was too limiting / not flexible enough and most websites that use Bootstrap ends up looking similar --> this is my concern and hence why I asked if there's a project that showcases FastUI capabilities. If FastUI ends up being easy to use while maintaining flexibility and highly customizable --> this would be perfect ❤
I would also be very happy with this video if i have seen it two years ago .
I hated js and was running away from js.
Then just learned it and now i do most of the things in js .
But still miss python and try to use it whenever possible .
It is not something against js it is just mindset difference between python and js .
In js we have callbacks i did not understand those earlier .
Now python also supports async await but the i dreaded those in js .
Python and is are similar bcz they are dynamic but there philosophy is totally different .
Python developer should try Svelte if they fear js .
They will love it as i do now 😂
@@bugbytes3923 I fully agree on that one! I am a data engineer and I use python a lot. Sometimes I need a quick web app to do some work like proof of concepts. I don't really care about learning all the web development stuff as it is not my job to create full-blown web applications. I think that FastUI is ideal for my purposes. Now I am usually building Rest API's and use Postman to load data for these purposes. But the problem there is that if users in the program have to work with Postman, then they are lost. Building a quick web app with FastUI will definitely be a game changer.
Wow
Very similar to sqlpage.
Interesting! Not heard of this one.
Holy grail of dumpster fire
The sheer irony of Py developers calling their not fast things Fast(API)(UI). They're sipping that copium. (also notice how fast languages don't use fast in the name)
It’s probably “fast enough” 😁
end game is FastPython
That's right! FastAPI + FastUI = FastPython for everything mobile, web and desktop. PERIOD!!!
Fast solutions with little coding
Its fast dev not fast execution