How to Create & Deploy a Python Web Application FAST (fastHTML Tutorial)

แชร์
ฝัง
  • เผยแพร่เมื่อ 23 พ.ย. 2024

ความคิดเห็น • 61

  • @CodingIsFun
    @CodingIsFun  2 หลายเดือนก่อน +2

    *Say "Hi" on the live demo app:* guestbook.pythonandvba.com/
    What types of web apps do you want to build with fastHTML? Let me know in the comments! ⤵ Cheers, Sven ✌

    • @franciseigbe2796
      @franciseigbe2796 หลายเดือนก่อน

      Hi, this is a great tutorial. I'll really love to see a Point-of-Sale web app to be built using fastHTML and fastAPI...

  • @KevenWebb
    @KevenWebb 2 หลายเดือนก่อน +3

    Very nice tutorial. Just the right amount of detail for a demo project.

    • @bc4198
      @bc4198 2 หลายเดือนก่อน

      Right?! Classic Sven 😊

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Thanks for watching! Glad you liked it! -Sven ✌️

  • @bc4198
    @bc4198 2 หลายเดือนก่อน

    My first goal is customer data entry forms. My ultimate goal is a full app with all the things: database, API, local- / offline-first, microservices, event-driven design, document management system, CI/CD... Oh, and I need it to be reasonably secure, too 😅
    No idea yet, whether FastHTML would be my chosen tool (or one of them), but it certainly has an appeal! I very, very much want to separate the presentation and logic layers. But almost everything else would defer to achieving local- / offline-first, especially without the user needing to install any additional software. So, basically, I'm stuck with the browser, as far as I know.

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Thanks for watching! It seems like you’ve got a more advanced web app in mind already 😅
      As for the logic part, in my demo app, I kept it simple and squeezed everything into one file. Of course, you can separate it into different files or call other services/APIs if needed. That said, I’m not claiming to be a web developer - just a data guy dipping his toes into web development. But I’m enjoying it so far!
      Good luck with your project! Cheers, Sven ✌️

  • @IbrahimSaeed-Plus
    @IbrahimSaeed-Plus 2 หลายเดือนก่อน +2

    Really enjoyed this. Will attempt this during the weekend. May I also know the vscode theme you are using?

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Glad you enjoyed it. I am using Cobalt 3: marketplace.visualstudio.com/items?itemName=alex-pattison.theme-cobalt3
      Happy Coding! Cheers, Sven ✌️

  • @funese102
    @funese102 2 หลายเดือนก่อน +1

    Wow, it's really the same as NextJs, but far simpler. And your tutorial is still amazing as always Sven.

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน +1

      Glad to hear that! Thanks for watching and taking the time to leave a comment. Appreciate it! Cheers, Sven ✌️

    • @funese102
      @funese102 2 หลายเดือนก่อน

      @@CodingIsFun Just wonder why you don't make a whole course about Data Analysis, Machine Learning, so we will can learn from easier 😎

  • @swoopsavvy7560
    @swoopsavvy7560 2 หลายเดือนก่อน

    Great tutorial Sven! Greetings from your Dutch neighbour.

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Thank you! Glad you liked it. Greetings to the Netherlands! 🌷🚴‍♂️ -Sven ✌️

  • @GenZdev
    @GenZdev 2 หลายเดือนก่อน +4

    A video on portfolio+blog will be great

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Thanks for watching and your suggestion! -Sven ✌️

  • @danja5512
    @danja5512 หลายเดือนก่อน

    Nice demo, thank you Sven! Now we have another lightweight UI framework for python next to Streamlit, Dash, Shiny for Python, Gradio etc. 😅
    How would you compare it to Streamlit? At the moment i can't see any benefits to use fastHTM over Streamlit for prototyping.
    I guess as soon as your app gets more functionality, fastHTML would be better choice because it does not rerun the whole script.. am I right or do i mix something up?

    • @CodingIsFun
      @CodingIsFun  หลายเดือนก่อน +1

      Streamlit is excellent for prototyping, so no need to switch! However, if you’re looking for full customization options, especially for layout and styling, FastHTML could be worth exploring. Plus, it allows you to avoid the reruns that come with Streamlit, which might be helpful as your app’s functionality grows. Cheers, Sven ✌️

  • @conradohernanvillagil2764
    @conradohernanvillagil2764 28 วันที่ผ่านมา

    Excelent video!. Amazing. Thank you teacher. I would like to built in fastHtml a risk and control matrix for occupational health and safety.

    • @CodingIsFun
      @CodingIsFun  27 วันที่ผ่านมา

      Thanks for the kind words! Good luck with your project! Happy Coding! -Sven ✌️

  • @Pr4k0MEzoo
    @Pr4k0MEzoo 2 หลายเดือนก่อน +1

    Another awesome tutorial sven, can you redesign the streamlit sales dashboard using this framework in the next video?

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Thanks for watching. Not sure, if I'm gonna recreate the Streamlit Sales Dashboard. If you are interested in how to use charts in fastHTML, then check out this demo: gallery.fastht.ml/vizualizations/plotly_charts/display
      Happy Coding! Cheers, Sven ✌️

  • @wizurai_engineering
    @wizurai_engineering 2 หลายเดือนก่อน

    Great tutorial. Can't wait more project with python FastHtml.

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Glad you liked it. Happy Coding! -Sven ✌️

  • @andfanilo
    @andfanilo 2 หลายเดือนก่อน +1

    👏🏽👏🏽 awesome demo!
    Wait...I thought you were testing out Reflex ahah :D how's the FastHTML experience compared to vanilla FastAPI/HTMX/PicoCSS? and Reflex?

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Thanks, Fanilo! I guess I have a case of shiny object syndrome 😅
      Reflex was working great, but I felt a bit more "locked in" to its environment and syntax. That said, it does have some really cool "recipes," like login/signup forms, pricing cards, etc.
      FastHTML, on the other hand, feels more intuitive for me. I also think that, over time, there will be more (community) components, similar to Reflex’s recipes.
      What are your thoughts on this?

    • @andfanilo
      @andfanilo 2 หลายเดือนก่อน

      @@CodingIsFun i totally got the « reflex syntax lock-in ». The Frontend/Backend split is a nice construct, similar to how other JS frameworks do it, but when I get errors trying to show something Frontend that should be backend state or vice versa, it gets hard to debug. I think it just feels way more « framework for web devs used to full stack SPA frameworks »
      I’m not yet used to FastHTML’s HTML Caps syntax 😅, but it feels so much closer to vanilla html/css/js I think it’s easier to reason around and flexible enough for pythonistas.
      Looking forward to the community components growing!

  • @dm4508
    @dm4508 หลายเดือนก่อน

    Many thx for this nice example with FastHTML. I am building a Web App with Streamlit right now for Crypto Tracking, Charts and Portfolio tracking. Would it be better to do this with fastHTML instead of Streamlit? In terms of performance and UI Design etc I also use Aggrid tables and Plotly for Chart plotting. Kind regards from GER

    • @CodingIsFun
      @CodingIsFun  หลายเดือนก่อน

      FastHTML is great for fast rendering, but if you’re already using Streamlit, it’s a solid choice to stick with-especially since Streamlit v1.39 introduced new features that make UI styling easier (I made a video about it!). However, if you need more advanced customization, trying out FastHTML could be a good move. Good luck with your project, and happy coding! Beste Grüße zurück!

  • @drikting
    @drikting 2 หลายเดือนก่อน

    Thanks for the tutorial. I would have liked to see how or where you learned to code it together in the background or at least mention the resources though. I mean, watching you explain everything is one thing but knowing how to code it and troubleshoot on your own is another e.g. followed along till the supabase database execute() part then an error happened on my end.

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน +1

      Thanks for watching and your feedback! -Sven ✌️

  • @yazanrisheh5127
    @yazanrisheh5127 2 หลายเดือนก่อน +2

    Hi Sven. I really loved FastHTML however I legit have 0 info about HTML. Do you have any video recommendation about learning HTML so that we can build proper fastHTML websites? Thanks!

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Thanks for watching! I’d recommend checking out the FreeCodeCamp YT channel. They have some great HTML tutorials to get you started. Happy coding! Cheers, Sven ✌️

  • @nguyenduyta7136
    @nguyenduyta7136 2 หลายเดือนก่อน +1

    Hi thanks so much. I have a question How does it compare to flask or Django or streamlit

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน +2

      Thanks for watching! Big question, but let me try to answer.
      Flask and Django are both web frameworks, but they differ in complexity. Flask is simpler and more lightweight (easier to get started with, in my opinion), while Django is a full-featured framework with built-in tools like database handling, user authentication, and an admin panel. Both frameworks are more focused on the backend, so you'll still need to write your own frontend code. For example, you could use Jinja templating in both Flask and Django for dynamic HTML generation, and then style it with CSS.
      Streamlit, on the other hand, is designed specifically for building data-focused applications. It comes with built-in components for displaying charts and data, but it's not as flexible as Flask or Django for general web development. It's great for quickly turning data and Python scripts into interactive apps but isn't built for complex web apps or custom frontends.
      Now, FastHTML combines the backend power of FastAPI (which is similar to Flask) but uses regular HTML tags for the frontend. Instead of Jinja for templating, FastHTML allows you to use dynamic elements with HTMX, making it easier to add interactive functionality without needing (a lot of) JavaScript.
      I hope it helps! Happy coding! Cheers, Sven ✌️

    • @nguyenduyta7136
      @nguyenduyta7136 2 หลายเดือนก่อน

      @@CodingIsFun thanks a million for a kind answer 🫶

  • @nadetdevfullstack7041
    @nadetdevfullstack7041 2 หลายเดือนก่อน

    Excellent ! Awasome!

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Glad you enjoyed it Cheers, Sven ✌️

  • @carlos4z
    @carlos4z 2 หลายเดือนก่อน

    Excellent video! Can you create offline web desktop applications with FastHTML? Meaning, the user can simply open a unzipped package with all the files and simply open index.html in his browser and it works just fine (of course ensuring no dependencies that connect to the internet / no APIs...)

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Thanks for watching! I'm glad you liked the video. Sorry, but I haven't tried that yet. -Sven ✌️

  • @Aniket_Pawar
    @Aniket_Pawar 2 หลายเดือนก่อน

    Hello sir, will you please ever make a tutorial on using FastHTML for creating a UI website for machine learning?

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Thanks for watching and your suggestion! -Sven ✌️

  • @pr0skis
    @pr0skis 2 หลายเดือนก่อน

    This looks kinda similar to Plotly Dash in terms of using Python to structure HTML. Probably would be easier and better to use raw HTML and htmx or maybe even just simple vanilla js?

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน +2

      Thanks for watching. I guess it depends on your preference. I never really got into learning JS. What I like is the idea of doing everything in Python. I used to build smaller backends with FastAPI, but now with FastHTML, I can also create the frontend with interactivity in a similar way. Cheers, Sven ✌️

  • @contrarianthinker
    @contrarianthinker หลายเดือนก่อน

    Hey can you help me write some formulas for a spreadsheet I have?

    • @CodingIsFun
      @CodingIsFun  หลายเดือนก่อน

      Thank you very much for watching the video and your comment. I receive many requests for creating individual solutions. As much as I want to help, I simply do not find the time in my daily schedule to develop & test all the different requests. I hope you can understand. Thank you! Cheers, Sven ✌️

  • @WinnerSingh
    @WinnerSingh 2 หลายเดือนก่อน

    Can you make a video on how to upload python project on dreamhost

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      Thanks for watching and for your suggestion, but I probably won't make a dedicated tutorial on how to host a Python project on DreamHost. However, you could have a look at their docs and reach out to their support team: help.dreamhost.com/hc/en-us/articles/216137717-Python-overview. - Sven

  • @micbab-vg2mu
    @micbab-vg2mu 2 หลายเดือนก่อน

    thank you:)

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน +1

      My pleasure! Appreciate you taking the time to watch and leave a comment. -Sven ✌️

  • @gabycazquens304
    @gabycazquens304 หลายเดือนก่อน

    How can it be fast when it's written in Python? If we rewrote it in Rust, it would be faster.

    • @CodingIsFun
      @CodingIsFun  หลายเดือนก่อน

      Go for Rust then! Happy Coding!👍

  • @CyrilLevyMarchal
    @CyrilLevyMarchal 2 หลายเดือนก่อน

    I dont think the instructions to run on Vercel are complete or clear enough

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน

      What's missing?

  • @Joe369x
    @Joe369x 2 หลายเดือนก่อน +1

    Seems overly complex syntax for no reason only good thing would be using python libraries in website I guess

    • @CodingIsFun
      @CodingIsFun  2 หลายเดือนก่อน +1

      Thanks for watching. I guess it depends on what you are comparing it to. For me, I found it quite intuitive. Basically, it's just writing HTML tags in Python and adding interactivity with HTMX. Over time, I am sure there will be community components that you can simply import, like a card, which is also showcased on the fastHTML website: www.fastht.ml/
      Cheers, Sven ✌️

    • @markgaudette9
      @markgaudette9 2 หลายเดือนก่อน

      I am guessing you could create a webpage using something like html editor/creator and then just read in the file using python.

    • @bc4198
      @bc4198 2 หลายเดือนก่อน

      ​@@CodingIsFunExactly!