IT/Vue

nuxtjs3 + django 통합방법

bepuri 2023. 4. 7. 13:38
728x90

nuxtjs든, nextjs든 비슷할거라 본다.

어쨋든 frontend단에서 뭔가 일어나는것이고,,

frontend단은 backend단에 axios던 fetch던 데이터 통신을 통해서 정보를 가져오면되는거다..

물론 기존 SPA형태가 아닌 SSR까지 들어간다면 backend(django, ruby 등)단의 어플리케이션서버와

node서버가 통신하는 형태가 될것이다.

 

그래서 cors_origin의 whitelist도 django쪽에 추가도 해줘야되는거고,

암튼 서론은 줄이고 통합을 어떻게 해야되냐..

 

ssr이냐 csr이냐에 따라 달라지는데,

csr의 경우 bundling된 main.js와 같은 파일하나가 떨어진다.. 그 파일을 django쪽 index.html에서 불러오면 되는거고,, 

ssr이면 index.html에 포함할 필요가 없으며.. nginx의 root를 frontend에서 띄운 node서버로 지정해주면된다.

 

생각보다 아주 간단ㅎ

 

2~3년전만 해도 아무생각없이 튜토리얼만 따라 하면서 구현에 급급했는데.. 정리해보면 frontend의 코드들은 웹페이지 표시를 포함한 backend간 통신을 통핸 유저가 보는 화면을 구성해주는것 그 이상 그 이하도 아니다..

 

그렇기 때문에 backend와 잘 연결만 해주면되는거다.

 

그건 SPA형태이냐, SEO와 렌더링속도를 고려해서 SSR을 적용한 형태냐에 따라서 backend와의 통합이 약간 달라질 뿐이다.

 

728x90