DEV Community

Cover image for Day 31-32: More Flask: Git, Debugging, and Refactoring
John Enad
John Enad

Posted on

Day 31-32: More Flask: Git, Debugging, and Refactoring

Having gained some basic knowledge of Flask and written some simple code on my local desktop, I was eager to share my work by putting it on Github. Given that my Github account currently has only one public repository, I felt it was high time to start building up my collection.

Leveraging my Git experience from working with other languages such as Java, .NET, and Javascript, I quickly uploaded the "flask-service-1" project to Github. I began by executing git init while inside the project root folder, initializing my project and creating a new Git repository. A hidden directory named ".git" was created shortly after.

At this stage, it's crucial to create a .gitignore file containing expressions that instruct Git which files or folders to ignore when committing to Github. Next, I created a new branch called "develop" using the command git checkout -b develop. This was followed by git add . and git commit -m "Initial Commit", and then git push --set-upstream origin develop.

In various types of projects, project dependencies are listed in specific locations. For instance, in JavaScript projects, they are found in the package.json file, while in Spring Boot (Maven), they reside in the pom.xml files. For Python, it's the requirements.txt file. Developers usually exclude the virtual environment folder from source control using the aforementioned .gitignore file, and instead list all dependencies in the requirements.txt file.

To create this file, simply run pip freeze > requirements.txt and then commit and push to Github. Now, anyone who clones the project can just run pip install -r requirements.txt, and all the listed packages will be reinstalled.

With my code securely stored on Github, I wanted to set up debugging with VS Code to easily examine variables and investigate bugs, especially as the code grows larger. To configure the VSCode debugger, I navigated to the Command Palette, typed "Add Debug Configuration", selected Python, and then Flask. A launch.json configuration file was created in a new folder called .vscode. I modified the FLASK_APP value in launch.json to "app.py". At this point, I could place breakpoints in the code and debug effectively.

Image description

After setting up Git and debugging, I refactored the code. I created an "api" folder to separate its files from other project-level files like requirements.txt and .vscode folders, and added an _init_.py file containing the following code:

from flask import Flask

app = Flask(\__name__)
Enter fullscreen mode Exit fullscreen mode

I then moved the app.py file inside the api folder and added this code:

from . import app

@app.route("/")
def hello():
    return "Hello, World!!"
Enter fullscreen mode Exit fullscreen mode

I made a minor change to the launch.json file, updating the FLASK_APP value to "api.app". The code still worked when running from the debugger, but to run outside the VS Code debugger, I needed to set an environment variable for FLASK_APP.

On Linux and macOS, use: export set FLASK_APP=api.app
On Windows, using Powershell: $env:FLASK_APP=api.app
On Windows, using Command Prompt: set FLASK_APP=api.app

After committing and pushing these changes to the Github repository, I discovered that the -p parameter can be used to change the port number when running locally. For example, to run on port 8001, use:

python -m flask run -p 8001

On the 33rd day of my #100DaysOfCode journey, I plan to checkout kaggle and maybe sign-up for some tutorials for a quick review of the basics lest I forget them.

Top comments (0)