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. スクリーンショット 2020-03-21 10.38.02.png

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. スクリーンショット 2020-03-21 11.16.43.png

Recommended Posts

The story that CSS is no longer applied after uploading the Django app from local to AWS
After all, the story of returning from Linux to Windows
The story that the private key is set to 600 with chmod
After deleting the Java process log, the log is no longer output
A story that I was addicted to calling Lambda from AWS Lambda.
Heroku deployment of the first Django app that beginners are addicted to
Settings that allow IPython Notebook to be accessed from outside the local
Mia Nanasawa's face is (No'□ `) No Noise processing is applied to return to the original beautiful face