Build Stunning Web UIs in Python With NiceGUI

Real Python · Beginner ·🛠️ AI Tools & Apps ·6mo ago

Key Takeaways

The video demonstrates how to use NiceGUI, a Python-based UI framework, to build stunning web UIs, leveraging Tailwind CSS, SVG, and markdown, with features like buttons, dialogue, 3D scenes, and plots.

Full Transcript

It's called Nice Guey. Create web-based interfaces with Python. You can see it in action if you want to just kind of check it out and play around with some of their examples. It's at nicegeue.io. Web browser approach to doing a guey library. And what's nice about that in some ways is you get a bunch of extra things out of that. It being browserbased gives you the ability to leverage a bunch of stuff like, well, you can use CSS then. And so they actually take advantage of Tailwind CSS under the hood. SVG uh markdown. It can act as a web server so it can be accessed by the browser or used in native code like a desktop window. It's touted as an easyuse Python-based UI framework. You can create buttons, dialogue, markdowns, 3D scenes, plots. Good for micro web apps, dashboards, robotics projects, smart home solutions, and so forth. These are some things that they're offering as suggested areas you could use it. Uh you can use it in development for example tweaking, configuring a machine learning algorithm or tuning motor controllers. It has standard guey elements like label, button, checkboxes, switches, sliders, input files, and so forth. It allows for simple grouping with rows and columns and cards and dialogues. Again, a lot of that is coming from a lot of the CSS stuff that's there, which is nice. There's powerful highle elements inside of it of plotting of graphs and charts, rendering 3D scenes. There's a way to use virtual joysticks with it, annotate or overlay images, interact with tables, even embed video and audio files. So, uh there's a built-in timer to refresh data in intervals every 10 milliseconds, notifications, dialogues, and menus to provide state-of-the-art user interaction. You can have shared and individual web pages, and then an easyto use per user and general persistence. Interesting idea there. They even had an interesting way of like hosting it that I thought was kind of cool. Uh you can pip install it from Pippi. They also have a docker image. Their site has a lot of examples. And then the readme docs site is built within the framework also with again lots of additional

Original Description

Download your free Python Cheat Sheet here: https://realpython.com/cheatsheet Free Python Skill Test with instant level + learning plan: https://realpython.com/skill-test Want to learn faster? Become a Python Expert with unlimited access to 5,000+ tutorials, videos, and exercises: https://realpython.com/start They say it's pronounced NiceGUY. Listen to the full episode at https://realpython.com/podcasts/rpp/263 or wherever you get podcasts -- with Chris Trudeau (hosted by Chris Bailey). 🐍 Become a Python expert with real-world tutorials, on-demand courses, interactive quizzes, and 24/7 access to a community of experts at https://realpython.com ▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰ 🐍 Start Here → https://realpython.com/start 🗺️ Guided Learning Paths → https://realpython.com/learning-paths 🎧 Real Python Podcast → https://realpython.com/podcast 📚 Python Books → https://realpython.com/books 📖 Python Reference → https://realpython.com/ref 🧑‍💻 Quizzes & Exercises → https://realpython.com/quizzes 🎓 Live Courses: https://realpython.com/live ⭐️ Reviews & Learner Stories: https://realpython.com/learner-stories ▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰▰
Watch on YouTube ↗ (saves to browser)
Sign in to unlock AI tutor explanation · ⚡30

Playlist

Uploads from Real Python · Real Python · 0 of 60

← Previous Next →
1 A better Python REPL – bpython vs python interpreter
A better Python REPL – bpython vs python interpreter
Real Python
2 Introducing large-type.com – A Utility Website
Introducing large-type.com – A Utility Website
Real Python
3 Reading Hacker News Without Wasting Tons of Time
Reading Hacker News Without Wasting Tons of Time
Real Python
4 Forward References and Python 3 Type Hints
Forward References and Python 3 Type Hints
Real Python
5 Using Sublime Text as your Git Editor
Using Sublime Text as your Git Editor
Real Python
6 Python Code Linting and Auto-Complete for Sublime Text
Python Code Linting and Auto-Complete for Sublime Text
Real Python
7 Make your Python Code More Readable with Custom Exceptions
Make your Python Code More Readable with Custom Exceptions
Real Python
8 Write Better Tests with Sublime Text's Split Layout Feature
Write Better Tests with Sublime Text's Split Layout Feature
Real Python
9 How to Use Sublime Text from the Command Line
How to Use Sublime Text from the Command Line
Real Python
10 Rename Variables with Multiple Selection in Sublime Text
Rename Variables with Multiple Selection in Sublime Text
Real Python
11 Sublime Text Settings for Writing PEP 8 Python
Sublime Text Settings for Writing PEP 8 Python
Real Python
12 Write Cleaner Python with Sublime Text's Indent Guides
Write Cleaner Python with Sublime Text's Indent Guides
Real Python
13 Sublime Text Whitespace Settings for Python Development
Sublime Text Whitespace Settings for Python Development
Real Python
14 Function Argument Unpacking in Python
Function Argument Unpacking in Python
Real Python
15 Python Code Review: Debugging and Refactoring "Conway's Game of Life" +  Automated Tests
Python Code Review: Debugging and Refactoring "Conway's Game of Life" + Automated Tests
Real Python
16 Using "get()" to Return a Default Value from a Python Dict
Using "get()" to Return a Default Value from a Python Dict
Real Python
17 A Python Shorthand for Swapping Two Variables
A Python Shorthand for Swapping Two Variables
Real Python
18 Python Code Review: Refactoring a Web Scraper, PEP 8 Style Guide Compliance, requirements.txt
Python Code Review: Refactoring a Web Scraper, PEP 8 Style Guide Compliance, requirements.txt
Real Python
19 Click & Jump to Test Failures from the Command Line (iTerm2)
Click & Jump to Test Failures from the Command Line (iTerm2)
Real Python
20 Setting up Sublime Text for Python Developers
Setting up Sublime Text for Python Developers
Real Python
21 Sublime Text + Python Guide Overview
Sublime Text + Python Guide Overview
Real Python
22 Python Code Review: Adding Pytest Tests to an Existing Python Web Scraper
Python Code Review: Adding Pytest Tests to an Existing Python Web Scraper
Real Python
23 Type-Checking Python Programs With Type Hints and mypy
Type-Checking Python Programs With Type Hints and mypy
Real Python
24 A Shorthand for Merging Dictionaries in Python 3.5+
A Shorthand for Merging Dictionaries in Python 3.5+
Real Python
25 Python Code Review Flask Web Security Tutorial + Virtualenvs, requirements.txt
Python Code Review Flask Web Security Tutorial + Virtualenvs, requirements.txt
Real Python
26 My Python Code Looks Ugly and Confusing – Help!
My Python Code Looks Ugly and Confusing – Help!
Real Python
27 Setting Up a Programmer Portfolio/Developer Blog – How To Get Started
Setting Up a Programmer Portfolio/Developer Blog – How To Get Started
Real Python
28 Do I Need a GitHub/GitLab/Bitbucket Profile as a Developer?
Do I Need a GitHub/GitLab/Bitbucket Profile as a Developer?
Real Python
29 Programmer Portfolio – Example and Walkthrough
Programmer Portfolio – Example and Walkthrough
Real Python
30 How to Get Your 1st Speaking Gig at a Tech Conference
How to Get Your 1st Speaking Gig at a Tech Conference
Real Python
31 How to Build Your Public Speaking Skills as a Developer
How to Build Your Public Speaking Skills as a Developer
Real Python
32 The Object-oriented Version of "Spaghetti Code" is "Lasagna Code" ?!
The Object-oriented Version of "Spaghetti Code" is "Lasagna Code" ?!
Real Python
33 Setting up Sublime Text for Python Developers – Lesson #1
Setting up Sublime Text for Python Developers – Lesson #1
Real Python
34 Cool New Features in Python 3.6
Cool New Features in Python 3.6
Real Python
35 "is" vs "==" in Python – What's the Difference? (And When to Use Each)
"is" vs "==" in Python – What's the Difference? (And When to Use Each)
Real Python
36 Emulating switch/case Statements in Python with Dictionaries
Emulating switch/case Statements in Python with Dictionaries
Real Python
37 Python Function Argument Unpacking Tutorial (* and ** Operators)
Python Function Argument Unpacking Tutorial (* and ** Operators)
Real Python
38 What Code Should I Put On My GitHub/GitLab/BitBucket Profile?
What Code Should I Put On My GitHub/GitLab/BitBucket Profile?
Real Python
39 A Crazy Python Dictionary Expression ?!
A Crazy Python Dictionary Expression ?!
Real Python
40 String Conversion in Python: When to Use __repr__ vs __str__
String Conversion in Python: When to Use __repr__ vs __str__
Real Python
41 Method Types in Python OOP: @classmethod, @staticmethod, and Instance Methods
Method Types in Python OOP: @classmethod, @staticmethod, and Instance Methods
Real Python
42 Optional Arguments in Python With *args and **kwargs
Optional Arguments in Python With *args and **kwargs
Real Python
43 Python Context Managers and the "with" Statement (__enter__ & __exit__)
Python Context Managers and the "with" Statement (__enter__ & __exit__)
Real Python
44 Installing Python Packages with pip and virtualenv / venv
Installing Python Packages with pip and virtualenv / venv
Real Python
45 "For Each" Loops in Python with enumerate() and range()
"For Each" Loops in Python with enumerate() and range()
Real Python
46 Python Code Review: LibreOffice Automation and the Python Standard Library
Python Code Review: LibreOffice Automation and the Python Standard Library
Real Python
47 Managing Python Dependencies With Pip and Virtual Environments – Lesson #1
Managing Python Dependencies With Pip and Virtual Environments – Lesson #1
Real Python
48 Python Tutorial: List Comprehensions Step-By-Step
Python Tutorial: List Comprehensions Step-By-Step
Real Python
49 Leveraging Python's Implicit "return None" Statements
Leveraging Python's Implicit "return None" Statements
Real Python
50 What's the meaning of underscores (_ & __) in Python variable names?
What's the meaning of underscores (_ & __) in Python variable names?
Real Python
51 Python Data Structures: Sets, Frozensets, and Multisets (Bags)
Python Data Structures: Sets, Frozensets, and Multisets (Bags)
Real Python
52 Writing automated tests for Python command-line apps and scripts
Writing automated tests for Python command-line apps and scripts
Real Python
53 How to find great Python packages on PyPI, the Python Package Repository
How to find great Python packages on PyPI, the Python Package Repository
Real Python
54 Immutable vs Mutable Objects in Python
Immutable vs Mutable Objects in Python
Real Python
55 PyPI vs Warehouse, the Next-Generation Python Package Repository
PyPI vs Warehouse, the Next-Generation Python Package Repository
Real Python
56 pep8.org — The Prettiest Way to View the PEP 8 Python Style Guide
pep8.org — The Prettiest Way to View the PEP 8 Python Style Guide
Real Python
57 My Experience at PyCon 2017 in Portland
My Experience at PyCon 2017 in Portland
Real Python
58 Pylint Tutorial – How to Write Clean Python
Pylint Tutorial – How to Write Clean Python
Real Python
59 "Reverse a List in Python" Tutorial: Three Methods & How-to Demos
"Reverse a List in Python" Tutorial: Three Methods & How-to Demos
Real Python
60 Python Refactoring: "while True" Infinite Loops & The "input" Function
Python Refactoring: "while True" Infinite Loops & The "input" Function
Real Python

The video introduces NiceGUI, a Python-based UI framework, and demonstrates its features and capabilities for building web UIs, including buttons, dialogue, 3D scenes, and plots, with a focus on ease of use and flexibility.

Key Takeaways
  1. Install NiceGUI using pip
  2. Explore the NiceGUI documentation and examples
  3. Create a simple web UI using NiceGUI
  4. Customize the UI with CSS and markdown
  5. Add interactive elements like buttons and dialogue
💡 NiceGUI provides an easy-to-use and flexible way to build web UIs with Python, leveraging the power of Tailwind CSS and markdown for customization and interaction.

Related Reads

Up next
The Difference Between Review Capacity and Review Control | ARDEM Incorporated
ARDEM Incorporated
Watch →