← All Articles

2021.02.13 (토)

Posted on

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

Diarydjangodatabasepythonreact