Introduction:
In this series, we will build a weather app using NiceGUI, a Python-based UI library that simplifies web app development. In this first post, we'll cover the setup steps, including creating a repository, setting up a virtual environment, installing dependencies, and running a "Hello World" NiceGUI app.
Let’s dive into the necessary preparation to get your project started.
Step 1: Creating a GitHub Repository for our NiceGUI Weather App
Go to GitHub and log into your account.
Create a new repository:
Click the "New" button next to "Repositories."
Name your repo something like weather-app-nicegui.
Add a description (optional).
Make it public or private, as per your preference.
Check "Add .gitignore" and select Python as the template.
Skip the license for now (you can add one later).
Click Create repository.
This will initialize your GitHub repository.
Now you can clone it to your local machine.
Step 2: Setting Up a Python Virtual Environment
Next, create a Python virtual environment. A virtual environment ensures that your project dependencies don’t interfere with system-wide Python packages.
Create the virtual environment using Python's venv module:
Activate the virtual environment:
On macOS/Linux:
On Windows:
Once activated, your terminal will show (venv) at the beginning of each line.
Step 3: Installing NiceGUI and Adding Dependencies
Now that the environment is set up, let’s install NiceGUI and create a requirements.txt file to keep track of the dependencies.
Install NiceGUI via pip:
Freeze your project dependencies to the requirements.txt file:
This will generate a file listing all the installed packages, like this:
By saving your dependencies in requirements.txt, anyone cloning your project can easily install the required packages using:
Step 4: Creating a Simple Hello World App in NiceGUI
Let’s create the first file, main.py, and write a basic "Hello World" app using NiceGUI.
Create main.py in your project root:
Run the app:
If everything is set up correctly, NiceGUI will start a web server, and you’ll see output like this:
Go to http://localhost:8080 in your browser, and you should see a page that displays “Hello, NiceGUI!”
Step 5: Adding .gitignore and Committing Code
Before committing, make sure your .gitignore file is properly set up. Since GitHub already added a basic Python .gitignore, it should include typical entries like:
Add your venv folder to the .gitignore to avoid pushing it to GitHub:
Now, you can commit your changes:
Step 6: Conclusion
Congratulations! You’ve successfully set up the project with GitHub, a virtual environment, and a NiceGUI "Hello World" app. In the next post, we’ll dive into page layout and add some style to our weather app.
Opmerkingen