1: NiceGUI Weather App: Setting Up the Project

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.