728x90 Side project8 [AWS] EC2 + PM2 + Ubuntu 환경에서 무중단 배포 환경 구축하기 PM2 무중단배포인스턴스는 내가 중단하기까지 꺼지지 않지만 터미널은 닫으면 종료되니 때문에 무중단 서비스가 되지않는다.터미널을 계속 켜놔도 결국은 일정시간이 지나면 종료가 됨그렇기 때문에 해당 터미널과 서버 실행 환경을 분리가 필요하다그래야 터미널을 닫아도 서버가 계속 돌아가기 때문! 이 방식은 도커로 무중단 서비스를 운영해도 비슷하게 작동한다.하지만 지금 진행하는 프로젝트는 프론트 서버도 1개고 대규모 인프라로 자동으로 설정하는 부분도 아니기때문에간단하게 pm2로 진행!하지만 도커도 언젠간 제대로!! 해보고 싶다 그럼 이제 막 ec2 인스턴스를 만들었으니node를 우분투에 설치해보겠습니다. 우선 패키지 리스트를 최신화 하기 위해 apt update를 진행sudo apt-get update 업데이트가 됐.. 2025. 6. 12. [AWS] NEXT.js 배포를 위한 ec2를 만들고 연결해보자 AWS EC2생성가장 많이 쓰는 우분투로 서버는 설정해주고 당연히 프리티어 키페어도 만들어줍니다꼭 저장잘하시고 되도록 잃어버리지 마세요 더보기키페어란?퍼블릭 키와 프라이빗 키로 구성되는 키 페어는 Amazon EC2 인스턴스에 연결할 때 자격 증명 입증에 사용하는 보안 자격 증명 집합입니다. Linux 인스턴스의 경우 프라이빗 키를 사용하여 인스턴스에 SSH로 안전하게 연결할 수 있습니다.일종의 열쇠의 개념! 패스워드보다 보안성이 훨씬 높음SSH환경에서 진행하기 때문에 pem키로 생성 VPC는 기본값으로 진행서브넷도 자동으로 설정되게 합니다 퍼블릭 IP도 당연히 설정기본 보안 그룹은 외부에서의 인바운드 트래픽이 차단되어 있으므로 원하는 포트를 열기 위해 새로운 보안 그룹을 생성SSH의 경우는 내 ip만.. 2025. 6. 2. 서버에 도메인 연결해보자 - a레코드 설정 서버에 도메인 연결해보자이 도메인을 과연 어느 서버로 연결 할 것인가!도메인에 ip주소를 연결해줘야 dns서버가 도메인을 보고 ip주소를 찾아 갈 수있다. (a레코드의 역할, aaaa는 ipv6)즉 ip주소와 도메인이 1:1매핑이 된다고 생각하면된다. 도메인은 동일하게 진행하고 서버와 클라이언트 서브 도메인으로 구분해서 진행하고 있다. 도메인을 구매한 곳에 가면dns설정을 할 수 있는 설정페이지가 존재한다. 원하는 서브 도메인을 설정해주면 된다.나의 경우에 서버 api의 경우는 주로 api.domain.com으로 진행한다. 클라이언트와 같은 도메인으로 진행할까 싶었지만 url로 바로 접근 되는 문제도 있을 수 있어서 서브도메인을 설정해주었다.물론 서버에서 보안처리를 하면 되지만 클라리언트에서 1차적으로.. 2025. 5. 31. 포트폴리오03 - styled components는 버린다. 일 년 만에 작업하는 포트폴리오 이번엔 정말 이직을 해야 하기 때문!!!! 다시 이어서 해보자고 오 작년의 나 제법 잘 해뒀네? 칭찬해....작년에도 진심이긴 했구나 하지만 페이지 전반에 메뉴가 없어서 이동이 약간은 불편하다고 느꼈다. 포트폴리오 사이트에서 얼마나 이동하겠어~?라고 할 수 있지만 없는 것보다 낫지 않겠는가 기존의 작업하던 코드를 보니 styled components를 사용했었다. 작년에는 학습용으로 사용하기는 했었다만 굳이 포트폴리오에 적용할 이유는 없어 보인다. 유지보수가 엄청나게 많은 사이트도 아닐뿐더러 6페이지 정도밖에 안 되기 때문에 클래스 이름 겹치기도 힘듦 이번달 안으로 빠르게 완성해야 하기 때문에 scss로 작업을 전환했다. 오 여기에 마침 적절한 메뉴가 있네 너 헤더로 승급.. 2023. 12. 2. 포트폴리오02 - 깔끔한 UI는 역시 어렵다 여백의 미라는 말이라도 있을만큼 디자인에 있어서 여백은 참 중요한 것 같다. 1px 2px이 다른데 직접 만들려니,, 참으로 어려워서 결국에는 구글링의 힘을 빌렸다. 기준은 최대한 따라하기 좋으면서도 내눈에 깔끔한 것으로 Davina씨 감사합니다 https://dorota1997.github.io/react-frontend-dev-portfolio/ Davina Griss | Front-end Developer dorota1997.github.io 타이핑 애니메이션은 다른 프로젝트에서 구현한 적이 있어 손쉽게 가져왔다. 과거의 나에게 감사하다. 물론 그때도 내가 구현하진않았다. 애니메이션은 쉽지않다 .typewriter span { overflow: hidden; /* Ensures the content.. 2022. 12. 26. React - UI library 선택하기(material design / ant design / bootstrap) 모든 컴포넌트를 내가 디자인을 할 미적 감각도 없고 웹 개발에서 많이 사용하는 기능들을 모아둔 멋진 라이브러리가 많기때문에 웹개발 시에 주로 UI라이브러리를 사용한다. 리액트를 공부할 때 가장 많이 나오는 3가지를 추려봤다. Material UI, Ant design, React-Bootstrap 우선 npm trends를 보자 ant design과 bootstrap은 지속적인 사용자가 있는 반면 material design은 계속해서 사용자가 늘고 있는 상황이다. 뭐..더 설명이 필요한가^^.... 그래도 프로젝트를 진행하면서 계속 같이 가야하는 프레임워크인 만큼 자기가 어떤 기능을 위주로 개발을 할 것 인지 설계를 했다면 주 기능을 정리해서 해당 기능이 있는 지 확인하고 진행하자 사실 이미 어느정도 .. 2022. 12. 7. 이전 1 2 다음 728x90 반응형