nextjs 서비스를 위한 빌드 스타트 build start 아파치 연동

그동안 npm rud dev 통해서 개발작업을 하던중 개발테스트 과정에서 발생하는 typescript 오류로 짜증이나서 빌드를 통해 서비스 스타트하는걸 확인했다.

간단하지만 모르면 어려운게 프로그램임 설정이다.

{
  "name": "purple-admin-ui",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev -p 3001",
    "build": "next build",
    "export": "next export",
    "start": "next start -p 3001",
    "lint": "next lint"
  },
  "dependencies": {
    "@ant-design/cssinjs": "^1.16.1",
    "@heroicons/react": "^2.0.18",
    "@microsoft/fetch-event-source": "^2.0.1",
    "@pinecone-database/pinecone": "^0.1.6",
    "@prisma/client": "^5.1.1",
    "@radix-ui/react-accordion": "^1.1.2",
    "@uiw/react-codemirror": "^4.21.9",
    "antd": "^5.7.3",
    "axios": "^1.4.0",
    "clsx": "^2.0.0",
    "date-fns": "^2.30.0",
    "dayjs": "^1.11.9",
    "dotenv": "^16.3.1",

친절하게 빌드에 대한 정보는 package.json 파일에 담겨있다.

npm run build 

를 실행하면 빌드를 시작한다.

빌드를 할때 처음에 타입스크립트 때문에 오류가 발생하기 쉽다. run dev 할때라는 다르게 꼼꼼하게 확인 하는것 같아서 몇번을 소스 수정후 성공하게 됬다. 

빌드가 끝나면 .next/ 폴더 및에 빌드되 내용이 있다.

이젠 서비스를 시작해보자 

npm run start  명령으로 서비스를 시작할수있다.

만약 여기서 에러가 난다면 타입스크립트에서 타입이 안맞다고 할때도 있더라 그럼 다시 수정해서 올려야한다.

브라우저에서 확인 가능 하다.

apache2 를 설치하고 아파치에 연동할경우 https:// 를 통해서비스 해줄수있다. 요즘 구글인증 및 카카오인증을 할려면 도메인에 만드시 SSL 을 요구한다.

그래서 연동한 부분을 보면 아파치  현재 나는 아파치 2 를 적용했다. 

 http://httpd.apache.org/docs/2.4/

Apache HTTP Server Version 2.4 문서 - Apache HTTP Server Version 2.4

위에서 sites-enabled 및에 있는 conf파일을 수정하여야 한다.

VirtualHost *:80>
        ServerName mybot1.store
        ServerAlias mybot1.store salaket.shop
        ServerAdmin webmaster@localhost
        DocumentRoot /var/www/html
        ProxyPass / http://0.0.0.0:3001/
        ProxyPassReverse / http://0.0.0.0:3001/
        ErrorLog ${APACHE_LOG_DIR}/error.log
</VirtualHost>
<VirtualHost *:443>
    DirectoryIndex index.html index.php
    ServerAdmin contact@mydomain.com
    DocumentRoot /var/www/html
    ServerName salaket.shop
    ProxyPass / http://0.0.0.0:3001/
    ProxyPassReverse / http://0.0.0.0:3001/
    ErrorLog /var/log/conf.log
    SSLEngine on
        SSLProtocol all -SSLv2 -SSLv3
        SSLCipherSuite HIGH:MEDIUM:!SSLv2:!PSK:!SRP:!ADH:!AECDH
        SSLCertificateFile /etc/letsencrypt/live/salaket.shop/cert.pem
        SSLCertificateKeyFile /etc/letsencrypt/live/salaket.shop/privkey.pem
        SSLCACertificateFile  /etc/letsencrypt/live/salaket.shop/chain.pem
    #ServerPath /home
    <Directory "/var/www/html">
    </Directory>
</VirtualHost>
<VirtualHost *:443>
    DirectoryIndex index.html index.php
    ServerAdmin contact@mydomain.com
    DocumentRoot /var/www/html
    ServerName mybot1.store
    ProxyPass / http://0.0.0.0:3001/
    ProxyPassReverse / http://0.0.0.0:3001/
    ErrorLog /var/log/conf.log
    SSLEngine on
        SSLProtocol all -SSLv2 -SSLv3
        SSLCipherSuite HIGH:MEDIUM:!SSLv2:!PSK:!SRP:!ADH:!AECDH
        SSLCertificateFile /etc/letsencrypt/live/mybot1.store/cert.pem
        SSLCertificateKeyFile /etc/letsencrypt/live/mybot1.store/privkey.pem
        SSLCACertificateFile  /etc/letsencrypt/live/mybot1.store/chain.pem
    #ServerPath /home
    <Directory "/var/www/html">
    </Directory>
</VirtualHost>

이부분을 추가해주면 된다.  

ProxyPass / http://0.0.0.0:3001/
ProxyPassReverse / http://0.0.0.0:3001/

443 포트 역시 연동해주면 

아파치를 리스타트 해주면 적용된다.

 sudo service apache2 restart

현재 포스트는 우분트2.0 에서 작성했다 .