🤵🏼얕고 얕은 개발자의 포트폴리오 만들기 2🤵🏼

💥 서버 세팅이 생각보다 어렵다

Spring 계열에 비하면야 당연히 덜 복잡하고 Django, React(와 노드 조합) 의 프로젝트에서 고생을 많이 해보진 않아서 후딱 할 수 있을 줄 알았다. 생각보다 아주 오래 걸렸다..

대략 이런 구조로 되어있는데 프로젝트 루트에 manage.py, pakage.json 과 같은 장고,리액트의 메인 세팅 파일이 있고 /backend 를 백으로 /src 를 프론트로 사용중이다.

react django 통신을 위한 proxy 설정

django 의 CORS, whitelist 설정

이 두 개는 당연히 필수이고 추가로 Heroku에 배포하기 위해 필요한 것이 있다. Heroku에 배포시 헤로쿠의 빌드팩들이 자동으로 빌드를 실행시켜주는데 python buildpack과 react buildpack의 인덱스가 거꾸로 되어있으면 웹에 접속했을때 장고 헬로월드가 나온다. 인덱스를 바꿔주거나 빌드팩을 제거 후 다시 순서대로 설치해주면 된다. 헤로쿠 빌드팩 설정법

이런 식으로 하면 되고 위 사진은 공홈 문서다. 나는 nodejs를 사용하지 않는다. heroku push 를 하면 빌드에 1분 정도 걸리고 heroku open 혹은 앱 주소를 입력하면 whoami 잘 나온다.

컨셉잡기

뭔가 웹에 컨셉을 하나 잡고 싶은데 디자인,html,css에는 재능이 없어 짬뽕할거라 컨셉은 '키보드로만 조작하는 웹'으로 잡았다. PR을 할 때 마우스로 버벅거리기보다 키보드로 딱딱하면 뭔가 더 멋있을 것 같기도 하고✨

https://whoami-moonseok.herokuapp.com/