Build and Deploy a Multi-Page Web Application Using Python (Streamlit)
ฝัง
- เผยแพร่เมื่อ 22 ก.ค. 2024
- 👉 Explore All My Excel Solutions: pythonandvba.com/solutions
𝗗𝗘𝗦𝗖𝗥𝗜𝗣𝗧𝗜𝗢𝗡
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
In this video, I’ll guide you step-by-step on how to build and deploy a multi-page web application in just 15 minutes using Python and Streamlit. No need to worry about HTML, CSS, or JavaScript-everything will be done in Python!
We’ll start by creating a simple navigation menu to switch between different pages and add a fully functional modal contact form. This project will showcase how powerful and easy Streamlit makes web development.
I'll also show you how to integrate no-code tools to enhance your app's functionality, making it even more versatile. By the end of this tutorial, you’ll have a professional-looking web app ready to go. Plus, I’ll teach you how to deploy it on the Streamlit Community Cloud for free, so you can share your work with the world.
🌍 𝗟𝗜𝗡𝗞𝗦:
▶ Live Website: multipage-webapp.streamlit.app/
▶ Source Code: github.com/Sven-Bo/python-mul...
▶ Pabbly Connect: pythonandvba.com/go/pabbly-co...
▶ Material Icons: fonts.google.com/icons
▶ Build a Streamlit Sales Dashboard: • Turn An Excel Sheet In...
▶ Build a Streamlit ChatBot App: • Turn An Excel Sheet In...
⭐ 𝗧𝗜𝗠𝗘𝗦𝗧𝗔𝗠𝗣𝗦:
00:00 - Introduction
01:26 - Installing Dependencies
01:57 - Creating 'Hello World' App
02:52 - Setting Up Navigation Menu
06:26 - Inserting Logo
07:21 - Creating 'About Me' Page
09:30 - Creating Contact Form
10:53 - Setting Up No Code Automation
14:45 - Building Sales Dashboard & ChatBot
15:48 - Styling the App
16:55 - Configuring Secrets File
17:49 - Deploying the App
19:43 - App Review
20:20 - Outro
𝗧𝗢𝗢𝗟𝗦 𝗔𝗡𝗗 𝗥𝗘𝗦𝗢𝗨𝗥𝗖𝗘𝗦
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
🆓【𝗙𝗥𝗘𝗘】Excel Add-in (𝗠𝘆𝗧𝗼𝗼𝗹𝗕𝗲𝗹𝘁): pythonandvba.com/mytoolbelt
📊 Dashboard Excel Add-In (𝗚𝗿𝗮𝗳𝗹𝘆): pythonandvba.com/grafly
🎨 Cartoon Charts Excel Add-In (𝗖𝘂𝘁𝗲𝗣𝗹𝗼𝘁𝘀): pythonandvba.com/cuteplots
🤪 Fun Emoji Excel Add-In (𝗘𝗺𝗼𝗷𝗶𝗳𝘆): pythonandvba.com/emojify
📑 Excel Templates: pythonandvba.com/go/excel-tem...
🎓 My Courses: pythonandvba.com/go/courses
📚 Books, Tools, and More: pythonandvba.com/resources
𝗖𝗢𝗡𝗡𝗘𝗖𝗧 𝗪𝗜𝗧𝗛 𝗠𝗘
▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀
🔗 LinkedIn: / sven-bosau
📸 Instagram: / codingisfun_official
💻 GitHub: github.com/Sven-Bo
💬 Discord: pythonandvba.com/discord
📬 Contact: pythonandvba.com/contact
☕ 𝗕𝘂𝘆 𝗺𝗲 𝗮 𝗰𝗼𝗳𝗳𝗲𝗲?
If you want to support this channel, you can buy me a coffee here:
▶ pythonandvba.com/coffee-donation
*Here's the link to the final website:* multipage-webapp.streamlit.app/
I hope you enjoyed the video and the project. All the links mentioned in the video can be found in the description box. Cheers, Sven ✌
How to upload on internet please
@@Harazi868 Have you watched the video? 😅
Best python-streamlit coders
Thank you! ❤️ -Sven
I even didin't look at all the video yet, but i give you already a five star *****. You are a great guy.
Thanks for the support! I appreciate it! Cheers, Sven ✌️
The best streamlit youtuber !!!!! BRAVO
Thanks, mate! Appreciate it! -Sven
I have learn streamlit from your video...its is really helpful...Jai hind... respect from India 🤍
Glad to hear that! Thanks for watching and taking the time to leave a comment. Love to India ❤️ Cheers, Sven ✌️
Thankyou so much , it's really useful🙂🙏 love from India..😊
Glad you liked it. Love to India. Cheers, Sven ✌️
I just finished a web app today and was looking for a video on how to upload it. Thanks! Your channel is one of the best for Python!
I'm glad to hear it was helpful. Just curious, what kind of app did you create? Cheers, Sven ✌️
@@CodingIsFun We often have to figure out the volumes for stock solution dilutions in our lab. The math is really easy but gets really tedious when you have a bunch of solutions to mix. So, I made an app that automates all that. Just enter the data for your solutions, and it spits out a SOP in PDF format. I think our techs and students are going to love how much easier it makes things!
@@mdld1293 Thanks for sharing. Sounds like an interesting project 👍
Great addition Sven , helping others to grow by learning these skills, great contribution , have great success ahead
Appreciate your kind words. Cheers for the support! -Sven ✌️
Thank you. So timely.
Glad it was helpful! Cheers, Sven ✌️
Bro is cooking the best streamlit tutorial again 🎉🎉🎉
Cheers mate✌️
@@CodingIsFun By the way Sven, please make more contents relating to Machine Learning & Taipy 😁. All the best to you!
Great Video
Thank you! -Sven ✌️
"Hi Sven! 😃 I just watched your new tutorial and, as always, it's incredibly useful and well explained. Thank you for sharing your knowledge with us! 🌟👍"
Hi Patricio, thanks for tuning in again and taking the time to leave a comment. I'm glad to hear you liked this video too. Cheers, Sven ✌️
Great job again, best wishes and have great success ahead
Again, appreciate the support and well wishes. All the best to you as well! -Sven 😊
great tutorial is easy to understand for me even just beginer in python like, thanks for the video
Thanks for the positive feedback! Appreciate you taking the time to leave a comment. Cheers, Sven ✌️
great video. well done.
Glad you liked it. Thanks for watching and taking the time to leave a comment! -Sven ✌️
Hi!
Thank you for such high-quality content! 😍
Regarding checking an email for correctness, using regular expressions is a flawed approach because:
1. There are numerous formats all over the world
2. The address might not exist
3. There may be a typo
The best way is to send a verification link to the email.
I understand that it's off-topic, but worth mentioning, I guess.
BTW, the Win + Dot command to see emojis is handy, thanks! 😊
Thank you for watching, and I'm glad you liked it! Regarding the email:
That's an absolutely valid point. Initially, I considered integrating an email validation API as well, but I wanted to keep the video concise. However, if you're interested in the code, you can check out this form I created for another app:
github.com/Sven-Bo/streamlit_contest/blob/main/streamlit_app.py#L17
Basically, I first validate the email and using a dedicated API also has the advantage of filtering out temporary email addresses.
Cheers,
Sven ✌️
@@CodingIsFun Wow, that's cool! thank you!!
Very nice!
Thank you! Cheers, Sven ✌️
This is really an excellent channel on Python like "techie talkee"
Thank you! -Sven ✌️
Thank you Sven for another amazing tutorial💫! looking handsome as usual 😉
Aw, you're making me blush. Thanks for watching and for your comment. Cheers, Sven ✌️
Realy cool 🙌
Thanks!
Thanks sir ✌️😉
My pleasure! Appreciate you taking the time to watch and leave a comment. -Sven ✌️
Hi Sven, I'm learning from you. You made it so easy. Thanks a lot. Can you make a video regarding how to use pabbly.
Happy to hear that you like my teaching style. Your request on the Pabbly Connect video is well noted. Cheers, Sven ✌️
can this be deployed also to a vps like digitalocean?
Yes, that should be possible. Here's one example: www.bitdoze.com/streamlit-deploy-vps-cloudflare/
Happy Deployment! -Sven
How did you use an icon as a call action button?
I mean the contact me button you used that opened the contact form
As explained in the video 4:12 min. Cheers, Sven ✌️
Hi! I really loved your video and tutorial of streamlit you made. Can you give full tutorial of simple website which can crud and have login page for my projects? Thanksss
Thanks for watching and your video suggestion! Cheers, Sven ✌️
Way of your explaining everyone can understand easily,
My request: Can you create tutorials based on user login,user can access web pages (based on permission)
Thank you for watching. I'm glad to hear you like my explanation style. Regarding your request: I'm still waiting for native authentication support from Streamlit. Currently, there are some workarounds and third-party packages available, but I prefer to wait for official Streamlit support for authentication. Cheers, Sven ✌️
@@CodingIsFun Thanks for reply,
Can we build a sidebar like the one on the Streamlit documentation webpage (docs.streamlit.io/)? For instance, imagine having sections like "About Me" or "Section 1" with clickable subsections. Clicking on any section or subsection should take me to the corresponding page. How can we achieve this?
Thanks for watching. Currently, that does not seem to be supported natively in Streamlit. Cheers, Sven ✌️
Is streamlit responsive and how do you handle mobile apps with it? Excellent tutorial. Looking forward to many more.
Yes, Streamlit is mobile responsive. You can check out the live website on your mobile phone. Cheers, Sven ✌️
Can I add a custom domain to my streamlit webapp?
Thank you for watching. In Streamlit Cloud, you can specify a custom subdomain but not change the top-level domain. If you deploy your app on Heroku or Render, you can set up a custom domain.
Here are the tutorials for deployment:
▶ Heroku (no free plan): th-cam.com/video/nJHrSvYxzjE/w-d-xo.htmlsi=5N5QWkUwftgFSsUM
▶ Render (free plan available): th-cam.com/video/4SO3CUWPYf0/w-d-xo.htmlsi=HFFruTkzTevHHBsO
And here are the instructions for setting up a custom domain:
▶ Heroku: th-cam.com/video/ZP7GpxMlxOI/w-d-xo.htmlsi=fNWEbw3xc7xtvtm3
▶ Render: docs.render.com/custom-domains
I hope this helps! Cheers, Sven ✌️
@@CodingIsFun Thanks a lot, Sven. Appreciate your work. Keep going. Hope to see more useful streamlit webapp and data viz videos from you.
Thanks Very Useful. 👏
I have an unrelated question, but I guess you know the Answer,
How to build Executable (.exe) file from Python for all Versions of Windows (Seven,8,10,11)
i used PyInstaller in windows 10 ,but the Executable file compiled by PyInstaller does not work on Windows 7
I apologize for the unrelated topic .
Thanks for watching. I have never tried to run compiled Python scripts on older Windows versions. Hence, I cannot help you here. You might need to do some Google searching. Happy debugging! Cheers, Sven ✌️
Can you do this with shiny for python
Thanks for watching. In Shiny for Python you could also include a navigation panel:
shiny.posit.co/py/templates/basic-navigation/
Happy Coding! Cheers, Sven ✌️
i keep getting
AttributeError: module 'streamlit' has no attribute 'Page'
any idea why?
Are you using the latest Streamlit version as explained in the video (1:27 min)?
pip install streamlit --upgrade
Cheers, Sven ✌️
How do i build a web site like you sir ... Any udemy course you can recommend I am a non coder
Thanks for watching. You might want to check out my Streamlit Playlist here: th-cam.com/play/PL7QI8ORyVSCaejt2LICRQtOTwmPiwKO2n.html
Also, for learning Python, you can check out my favorite resources here: pythonandvba.com/resources
I hope it helps! Happy learning & coding! Cheers, Sven ✌️
@@CodingIsFun -Thank you sir