Are you confused with STATIC_URL, STATICFILES_DIRS, and STATIC_ROOT?

6 min readMay 30, 2021

In this article, we will deep dive into Django static files and we’ll try to understand, how to manage the static files in such a way that we won’t find any problem at production. If you are a newbie in Django you might haveing the question, What is the difference among STATIC_URL, STATICFILES_DIRS, and STATIC_ROOT?
Static files are assets that do not change through the app’s JavaScript, CSS, images, fonts, etc. In Django, they are only “collected” into a public directory during the deployment process.
Don’t forget to run collect static in your production environment!
Let’s first understand the basic theory of Django static files and then we’ll see an example.

What is STATIC_URL:

STATIC_URL is simply the prefix or URL that is prepended to your static files and is used by the static method in Django templates mostly. you can check the URL in your terminal also.

[30/May/2021 13:53:04] "GET /static/myapp/css/style.css HTTP/1.1" 404 1816

What is STATICFIELS_DIRS:

In development mode — python manage.py runserver — Django searches for static files using the STATICFILES_FINDERS setting. By default, it tries to find the requested static file in folders listed in the STATICFILES_DIRS setting. In case of failure, Django tries to find the file using django.contrib.staticfiles.finders.AppDirectoriesFinder, which looks in the static folder of every installed application in the project. This allows you to write reusable applications which are shipped with their own static files.

What is STATIC_ROOT:

STATIC_ROOT is the directory or location where your static files are deployed when you run collectstatic.

Don’t forget to run python manage.py collectstatic in your production environment!

Great we have understood the theory of Django static files management, Now this is the time to start with an example Let’s do it.

#create the Django files inside the main directory
(mainenv) D:\myproject\StaticFlow>django-admin startproject main .
#create the app 'myapp'
(mainenv) D:\myproject\StaticFlow>python manage.py myapp
#create another app 'accounts'
(mainenv) D:\myproject\StaticFlow>python manage.py accounts
#make sure add the apps in settings.py also

That’s all, we are done with the project setup, This will be the file hierarchy

Note: Default behavior of the Django is to look into the first template and static folder inside the app level, So no need to change anything in settings.py file.

Now let’s add template and static files inside apps ‘myapp’ and ‘accounts’

Note: Always prefix the application name in the subfolders because all static folders are merged into one folder and if two or more applications had a js/core.js file, the last application in settings.INSTALLED_APPLICATIONS will override the previous ones.

Lets add CSS in style.css you can see the file structure from image too

Add some basic html and link CSS file to html file as we do in Django

Let’s write view for the same as ‘HomePage’

Map with urls.py file

Okey now run the server and you can see the output, means our CSS is working fine

Now the questions start from here can we change the STATIC_URL=’/static/’ default name?

Yes, we can because it is simply the prefix or URL that is prepended to your static files. Let’s change and test it now

#changed static to assets
STATIC_URL = ‘/assets/’

now you can look at the URL in the terminal how it’s working

[30/May/2021 13:18:41] "GET /assets/myapp/css/style.css HTTP/1.1" 404 1810

Restart the server and you can see static replaced by assets. but don’t change the static folder name at app level

So till now, we have understood that STATIC_URL can be changed.

Now Let’s add static and templates in accounts app an add the file as well

Add some static and html file to understand the use of static_root

As you can see I am just changing the body color in CSS file

So till here, We have two apps one is ‘myaapp’ and the second one is ‘accounts’ as both having static files.

Now the use of STATIC_ROOT starts from here add this line in settings .py

#'staticfiles'is directory name where all the static file will be stored you can pass any name here
STATIC_ROOT = (BASE_DIR /'staticfiles')

and execute the below command , It will create new directory as name staticfliles with admin assets

python manage.py collectstatic

Now you can see that staticflies directory has been created in the root directory.

what did happen here?

once you hit the command by default static file finder will serach all the static files in your app and push them into the staticfiles(static_root) directory

Admin is also an app in Django that’s why admin is in the staticfiles directory

Now Lets understand where the STATICFILES_DIRS will be used?

What we did till was the default behavior of Django but think about that scene where your static files are not stored in your app at that time we explicitly have to tell Django that oye Django please search our static files from the path mention inside the STATICFIELS_DIR. So we’ll add the path in the STATICFIELS_DIR list there can n number of the paths
So if you have created a static folder which not in the app so we have to tell the Django static finder that from where to search other static files and add them to the staticfiles(STATIC_ROOT path)

Let’s add one mainassests folder in root path and which not belongs to any app .

And then add the path in STATICFILES_DIRS

And again execute the python manage.py collectstatic command and see the magic happens

python manage.py collecstaic

As you can see all the content of mainassets folder has been added to the staticfiles directory this where we use the STATICFILES_DIRS.

Conclusion:

In production, you serve your static using a standalone web server like Nginx. The web server knows nothing about the Django project applications structure or which folders your static files are distributed in. Fortunately, Django provides you with the collect static management command python manage.py collectstatic, which walks through STATICFILES_FINDERS and copies all static files from applications static folders and folders listed in STATICFILES_DIRS into the directory you specify in the STATIC_ROOT setting. This allows for the resolution of static file resources using the same logic as Django development mode server and has all static files in one place for your web server.

Thank you..