test 작성
test 코드 작성시에는 파일 이름도 tests 로 시작, 함수 이름의 앞머리도 test로 시작해야 한다.
Django-React App 실습
규도자 개발 블로그 간단한 react JS + Django 어플리케이션 만들기
Tech With Tim Full Stack Web App With Python & JavaScript
연동방법
- 첫번째 django template에서 react 가 작동할 수 있게 static파일에 react js를 넣어 라이브러리로 사용하거나 cdns 서버에서 라이브러리를 가져오는 방법.
간단하지만 react의 기능 사용에 제한이 많아 잘 사용하지 않는다. - 두번째 frontend를 react로 작성하고 데이터는 내부 통신망의 django-rest-framework를 이용하여 가져오는 방식. 외부에는 front로 작성된 부분만 노출되고 동작이 이뤄질 때마다 내부에 개설된 django-rest-framework 네트워크를 통해 가져오는 방식. 물론 꼭 django와 react사이에 내부네트워크가 존재해야하는 건 아니다. 인증과정과 CRUD동작에 대한 rest api루트가 제대로 설정돼있다면 frontend서버와 backend서버를 완전분리시키는 것도 좋은 방법일 것이다.
rest_framework
django 와 react를 연결한다는것은 django 에서는 api를 제공해주고, react는 그 api를 받아서 렌더링 해주는 것을 의미한다.
serializer
from rest_framework import serializers
from .models import WiseSaying
class WiseSayingSerializer(serializers.ModelSerializer):
class Meta:
model = WiseSaying
fields = '__all__'
파이썬의 언어(파이썬의 클래스)를 브라우저가 이해할 수 있는 json 형식으로 바꿔주어야 함으로 따로 파일을 작성해야 한다.
cors
INSTALLED_APPS = [
'corsheaders',
]
MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware',
]
CORS_ORIGIN_WHITELIST = (
'localhost:3000/',
or
'http://localhost:3000',
)
script 태그 내에서 다른 도메인 서버(+ 다른 포트)로 요청을 할 수 없는 것이 cors이다. 3000포트에서 8000포트로 요청을 하는 것이니 이것을 해결해줘야 한다.
출처 RunningWater