Static folder configuration in Flask - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to create a Flask app with the default static folder.

Flask

from flask import Flask
app = Flask(__name__, static_folder=[1])

@app.route('/')
def home():
    return 'Hello, Flask!'

if __name__ == '__main__':
    app.run()

Drag options to blanks, or click blank then click option'

A'files'

B'assets'

C'public'

D'static'

Attempts:

3 left

💡 Hint

Common Mistakes

Using a folder name other than 'static' without configuring Flask accordingly.

Leaving the static_folder parameter empty or None.

The default static folder in Flask is named static. Setting static_folder='static' tells Flask where to find static files like CSS and images.

2fill in blank

medium

Complete the code to set a custom static folder named 'assets' in the Flask app.

Flask

from flask import Flask
app = Flask(__name__, static_folder=[1])

@app.route('/')
def home():
    return 'Welcome!'

if __name__ == '__main__':
    app.run()

Drag options to blanks, or click blank then click option'

A'static'

B'assets'

C'public'

D'resources'

Attempts:

3 left

💡 Hint

Common Mistakes

Forgetting to set static_folder when using a custom folder.

Using the wrong folder name string.

To use a custom folder for static files, set static_folder to the folder name, here 'assets'.

3fill in blank

hard

Fix the error in the code by completing the static_url_path parameter to serve static files from '/content'.

Flask

from flask import Flask
app = Flask(__name__, static_folder='static', static_url_path=[1])

@app.route('/')
def home():
    return 'Static files served from /content'

if __name__ == '__main__':
    app.run()

Drag options to blanks, or click blank then click option'

A'static/content'

B'/static'

C'/content'

D'content'

Attempts:

3 left

💡 Hint

Common Mistakes

Omitting the leading slash in the URL path.

Setting static_url_path to the folder name without a slash.

The static_url_path sets the URL path to access static files. To serve them from '/content', set static_url_path='/content'.

4fill in blank

hard

Fill both blanks to create a Flask app with a custom static folder 'assets' and serve static files from URL path '/resources'.

Flask

from flask import Flask
app = Flask(__name__, static_folder=[1], static_url_path=[2])

@app.route('/')
def home():
    return 'Custom static folder and URL path'

if __name__ == '__main__':
    app.run()

Drag options to blanks, or click blank then click option'

A'assets'

B'static'

C'/resources'

D'/assets'

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing up folder name and URL path values.

Forgetting the leading slash in the URL path.

Set static_folder='assets' to specify the folder name, and static_url_path='/resources' to set the URL path for static files.

5fill in blank

hard

Fill all three blanks to create a Flask app with static folder 'public', serve static files from '/staticfiles', and set static_host to None.

Flask

from flask import Flask
app = Flask(__name__, static_folder=[1], static_url_path=[2], static_host=[3])

@app.route('/')
def home():
    return 'Static files with custom folder, path and host'

if __name__ == '__main__':
    app.run()

Drag options to blanks, or click blank then click option'

A'public'

B'/staticfiles'

CNone

D'/public'

Attempts:

3 left

💡 Hint

Common Mistakes

Using incorrect folder or URL path names.

Setting static_host to a string instead of None.

Set static_folder='public' for the folder name, static_url_path='/staticfiles' for the URL path, and static_host=None to serve static files from the app's host.

Practice

1. What is the default folder name Flask uses to serve static files like images and CSS?

easy

A. assets

B. static

C. public

D. files

Solution

1. Step 1: Recall Flask default static folder

   Flask by default looks for a folder named static in your project to serve static files.

2. Step 2: Confirm other options are not defaults

   Folders like assets, public, or files are common in other frameworks but not Flask's default.

3. Final Answer:

   static -> Option B

4. Quick Check:

   Default static folder = static [OK]

Hint: Remember Flask uses 'static' folder by default for static files [OK]

Common Mistakes:

• Confusing 'assets' or 'public' as default static folder
• Thinking Flask serves static files from root directory
• Assuming no default static folder exists

2. Which of the following is the correct way to change the static folder name to 'assets' when creating a Flask app?

easy

A. app = Flask(__name__, static='assets')

B. app = Flask(static_folder='assets')

C. app = Flask(__name__, static_folder='assets')

D. app = Flask(__name__, static_url_path='assets')

Solution

1. Step 1: Identify correct Flask constructor parameter

   The parameter to change the static folder name is static_folder, used as Flask(__name__, static_folder='assets').

2. Step 2: Check other options for errors

   static='assets' is invalid, missing __name__ is wrong, and static_url_path changes URL path, not folder name.

3. Final Answer:

   app = Flask(__name__, static_folder='assets') -> Option C

4. Quick Check:

   Change folder with static_folder param [OK]

Hint: Use static_folder param in Flask constructor to rename folder [OK]

Common Mistakes:

• Using static instead of static_folder
• Omitting __name__ argument
• Confusing static_url_path with static_folder

3. Given this Flask app code:

app = Flask(__name__, static_folder='assets', static_url_path='/content')

# Assume assets folder contains image.png

# What URL path serves image.png?

medium

A. /content/image.png

B. /assets/image.png

C. /static/image.png

D. /image.png

Solution

1. Step 1: Understand static_folder and static_url_path roles

   static_folder='assets' sets the folder name, static_url_path='/content' sets the URL prefix to access static files.

2. Step 2: Determine URL to access image.png

   Since URL path is set to /content, the image is served at /content/image.png.

3. Final Answer:

   /content/image.png -> Option A

4. Quick Check:

   URL path = static_url_path value [OK]

Hint: URL uses static_url_path, not static_folder name [OK]

Common Mistakes:

• Assuming URL matches folder name
• Using default /static URL path despite override
• Confusing folder name with URL path

4. What is wrong with this Flask app code if static files are not served correctly?

app = Flask(__name__, static_folder='staticfiles')

# staticfiles folder exists with CSS files

# Trying to access /static/style.css returns 404

medium

A. The URL path /static does not match the static_folder name 'staticfiles'

B. The static_folder parameter should be set to 'static', not 'staticfiles'

C. The static_url_path should be set to '/staticfiles' to match folder name

D. Flask does not serve static files automatically

Solution

1. Step 1: Check static_folder and URL path mismatch

   Flask serves static files at URL path /static by default, but folder is renamed to staticfiles.

2. Step 2: Understand URL path must match static_url_path

   Since static_url_path is not set, Flask expects files at /static URL but folder is staticfiles, causing 404.

3. Final Answer:

   The URL path /static does not match the static_folder name 'staticfiles' -> Option A

4. Quick Check:

   URL path must match static_folder or static_url_path [OK]

Hint: Match static_url_path with static_folder or set both explicitly [OK]

Common Mistakes:

• Assuming folder rename auto-updates URL path
• Not setting static_url_path when changing folder
• Believing Flask never serves static files automatically

5. You want to serve static files from a folder named 'public_assets' but keep the URL path as '/static'. Which Flask app configuration achieves this?

hard

A. app = Flask(__name__, static_url_path='/static')

B. app = Flask(__name__, static_folder='static', static_url_path='/public_assets')

C. app = Flask(__name__, static_folder='public_assets')

D. app = Flask(__name__, static_folder='public_assets', static_url_path='/static')

Solution

1. Step 1: Set static_folder to 'public_assets'

   To serve files from 'public_assets' folder, set static_folder='public_assets'.

2. Step 2: Keep URL path as '/static'

   Set static_url_path='/static' to keep URL path unchanged.

3. Step 3: Verify other options

   app = Flask(__name__, static_folder='static', static_url_path='/public_assets') swaps folder and URL path, C uses default URL path '/static', D misses folder setting.

4. Final Answer:

   app = Flask(__name__, static_folder='public_assets', static_url_path='/static') -> Option D

5. Quick Check:

   Folder and URL path set explicitly [OK]

Hint: Set static_folder and static_url_path explicitly to control folder and URL [OK]

Common Mistakes:

• Swapping folder and URL path values
• Not setting static_url_path when folder changes
• Assuming default URL path changes with folder