https://this-programmer.tistory.com/entry/간단한-react-JS-Django-어플리케이션-만들기

frontend를 전부 react로 작성하고 그 데이터는 내부통신망의 django-rest-framework를 이용하여 가져오는 방식이다. 외부에는 front로 작성된 부분만 노출되고 동작이 이뤄질 때마다 내부에 개설된 django-rest-framework 네트워크를 통해 가져온다고 보면 된다.

그래서 비즈니스로직과 프론트엔드 동작을 완전히 분리할 수 있고 react의 기능도 온전히 사용가능할 수 있다. 하지만 서버 설정이 첫번째 방법보다는 복잡하다. django는 uWSGI나 gunicorn을 통해 항상 rest-api request에 응답할 수 있는 상태가 돼야하고 외부에는 react로 만들어진 frontend가 노출돼있어야한다.

사실상 모든 CRUD작업이 django-rest-framework에 의해서 이뤄지므로 GET, POST, PUT, DELETE작업에 대한 인증 작업 및 구분을 제대로 구현해야 한다. 한줄요약하자면 django와 react사이의 내부네트워크를 구성한 다음에 react와 client의 외부네트워크를 구성시켜야 한다. 아 물론 꼭 django와 react사이에 내부네트워크가 존재해야하는 건 아니다. 인증과정과 CRUD동작에 대한 rest api루트가 제대로 설정돼있다면 frontend서버와 backend서버를 완전분리시키는 것도 좋은 방법일 것이다.

하지만 두번째 방법 사용시 알아야할 것은 여기에서 끝이 아니다. 바로 SEO를 위한 SSR이다. 무슨 말인가 하면 검색엔진최적화(Search Engine Optimization)를 위해서 서버사이드렌더링(Server Side Rendering)이 돼야한다는 말이다. 한 예로 첫번째 방법과 비교해보자. 첫번째 방법은 사이트에 들어가자마자 http리퀘스트에 의해 html페이지가 완성되어 돌아온다. 그렇게 나온 데이터를 검색엔진이 종합하여 노출순위를 지정한다. 하지만 두번째 방법 사용시에는 그냥 http요청만으로는 페이지가 그려서 오지 않는다. 페이지 안에 들어가서 작성돼있는 javaScript들을 자극해야만 해당 정보들이 html태그로 그려져서 출력된다. 그렇다, 검색엔진은 http요청을 보낸 순간에 그려져있지 않는 비동기데이터들은 종합하지 못한다. 그래서 SSR이라는 기술이 필요한 것이다. http요청을 받았을 때 이미 어느정도는 html태그로 페이지를 그려놓아 검색엔진이 정보를 수집해갈 수 있게 해주는 기술인 것이다. 구글의 검색엔진이 js를 작동하여 종합한 데이터까지 포함시키게 개선할 거라는 얘기는 종종 있다. 구현 된건지, 아니면 개발 중인지는 모르겠다.