[PYTHON] The story that CSS is no longer applied after uploading the Django app from local to AWS

Background

For learning Django and AWS, after creating a Django app locally based on the following article, clone it from github to AWS. Articles that enable system development with Django (Python)_Introduction [Deploy in 20 minutes] Build a Django + PostgreSQL + Nginx environment on AWS EC2 and publish it quickly

After python3 manage.py runserver on AWS, I notice that the CSS that was applied to the admin screen locally is not applied.

Solution

As a result of checking the Nginx log, I confirmed that an error that the CSS path did not pass occurred.

$ tail -F /var/log/nginx/error.log
(Omitted)
2020/03/21 01:18:04 [error] 23086#23086: *197 open() "/home/ubuntu/repository/mysite/static/admin/css/base.css" failed (2: No such file or directory), client: XXX.XXX.XXX.XXX, server: XXX.XXX.XXX.XXX, request: "GET /static/admin/css/base.css HTTP/1.1", host: "XXX.XXX.XXX.XXX", referrer: "http://XXX.XXX.XXX.XXX/admin/login/?next=/admin/"

According to Handling static files in Django, you can use the collect static command to get through the path. After setting the static content handling settings of settings.py as follows, execute python3 manage.py collect static

settings.py

#Added static file call settings to the bottom
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
PROJECT_NAME = os.path.basename(BASE_DIR)
#STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')] 
STATIC_ROOT = os.path.join(BASE_DIR, 'static')

$ python3 manage.py collectstatic

You have requested to collect static files at the destination
location as specified in your settings:

    /home/ubuntu/repository/mysite/static

This will overwrite existing files!
Are you sure you want to do this?

Type 'yes' to continue, or 'no' to cancel: yes

119 static files copied to '/home/ubuntu/repository/mysite/static'.

The static files of the management screen (the ones under ~ / .local / lib / python3.5 / site-packages / django / contrib / admin / static /) are copied under the static directory.

$ ls ~/repository/mysite/static
admin  css  images  js
（css,image,js created with mkdir)

$ ls ~/repository/mysite/static/admin
css  fonts  img  js

As a result, the CSS path of the management screen passed.