사이먼's 코딩노트

[실전 서비스 배포]저번 '실전 서비스 배포 (3)' 까지 진행하면서 docker를 통한 이미지 생성과 함께 실제 구매한 도메인 네임으로 접속까지 성공하는 실습을 진행했다.이번에는 실전 서비스 배포의 마지막 단계로 젠킨스를 통해 서비스 배포 자동화를 구현해봅시다. [젠킨스(Jenkins)란?]젠킨스는 지속적 통합(Continuous Integration, CI) 및 지속적 전달(Continuous Delivery, CD)를 지원하는 오픈 소스 자동화 도구이다.젠킨스는 개발자들이 소프트웨어 개발 과정에서 반복적인 작업들을 자동화하여 개발 생산성과 품질을 향상시킬 수 있도록 도와준다.젠킨스는 다양한 프로그래밍 언어와 프레임워크를 지원하며, 소스 코드 컴파일, 테스트 실행, 정적 분석, 배포 등의 작업을 자동..

[실전 서비스 배포]지난 서비스 배포 포스팅에 이어 이번에는 Docker를 통해 MariaDB 버전의 서비스를 배포해봅시다.앞서 필요한 패키지들을 모두 설치했다면 아래와 같이 순서대로 명령어를 입력하여 실제 배포를 실습해보겠습니다. [디렉토리 생성]서버에서 깃허브 리포지터리에 있는 프로젝트를 clone하기 전, 해당 프로젝트가 위치할 디렉토리를 만들어야한다.아래의 명령어를 순서대로 SSH 클라이언트에서 입력해준다.먼저 /docker_projects/프로젝트명/project 라는 디렉토리가 있으면 삭제하도록 하고 mkdir를 통해 새 디렉토리를 생성하고 이동한다.여기서 프로젝트명은 사용자 마음대로 지정해서 넣으면 된다.rm -rf /docker_projects/프로젝트명/projectmkdir -p /do..

[실전 서비스 배포]지난 포스팅에 이어 실전 서비스 배포 방법을 함께 실습해봅시다.서버 생성과 도메인 기본 설정을 모두 마쳤다면 이번에는 원격접속 터미널 프로그램을 통해 SSH에 접속하여 생성된 서버 안에 필요한 패키지를 설치해야한다. [SSH 클라이언트 설치]SSH는 Secure SHell의 약어로 네트워크 상의 다른 컴퓨터에 로그인하여 명령을 실행하고 정보를 보고 받을 수 있도록 해주는 통신 프로토콜이다.쉽게 말해서 현재 생성된 우리의 서버는 네이버 클라우드에서 관리하기 때문에 직접 찾아가서 세팅을 하기엔 어려움이 있다. 그렇기 때문에 SSH로 원격 접속을 하여 해당 리눅스 서버에 접근하려고 하는 것이다.대표적인 SSH 클라이언트가 있는데, 그 중에서도 Putty와 Termius를 추천한다.포스팅에서..

[실전 서비스 배포]이번 포스팅에서는 직접 도메인을 구매하고 서버 플랫폼을 이용해서 우리가 만들어낸 프로젝트를 실제로 다른 사용자들이 로컬 환경이 아닌 곳에서도 접속할 수 있게 해봅시다.  [도메인 구매]먼저 서비스를 실제로 배포하기 위해선 도메인을 하나 구매해야한다.여기서 말하는 도메인이란, google.com 이나 naver.com과 같은 우리가 흔하게 접할 수 있는 웹 사이트의 주소이다.넓은 의미로는 네트워크 상에서 컴퓨터를 식별하는 호스트명이라고 생각하면 좋다.우리는 보통 도메인 네임을 구매한다고 하는데, 말 그대로 배포할 도메인을 우리가 직접 사이트를 통해서 구매해야한다.도메인 네임이 쉽고 범용적인 것을 고르는 것이 유리하지만, 그 만큼 가격 차이도 어느정도 발생한다.아래는 추천하는 두 개의 도..

[TossPayments 결제 시스템 구현]이번 포스팅에서는 마켓 전용 프로젝트를 기반으로 토스 페이먼츠 결제 시스템을 구현해 볼 예정입니다.마켓 프로젝트의 전체 코드를 포스팅할 수 없기 때문에 전체 구조와 코드를 확인하시려면 리포지터리 주소를 참고 부탁드립니다.해당 프로젝트는 SpringBoot v_3.3.0, Java 21 기반으로 세팅되어 있습니다.리포지터리 URL 주소 : https://github.com/psm817/cod_market GitHub - psm817/cod_marketContribute to psm817/cod_market development by creating an account on GitHub.github.com [토스페이먼츠 가입]결제 시스템을 토스페이먼츠를 통해 구현하..

[Svelte Kit 개발환경 세팅]지난번에 이어 스벨트 킷 개발환경 세팅을 진행하도록 하겠습니다.앞으로 작성된 모든 코드는 아래 깃허브 리포지터리 주소를 통해 확인하실 수 있습니다.깃허브 리포지터리 주소 : https://github.com/psm817/sksb_2407 GitHub - psm817/sksb_2407Contribute to psm817/sksb_2407 development by creating an account on GitHub.github.com [TailWind 설치 및 적용]스벨트 킷에 tailwind를 적용하는 방법은 vscode에서 터미널을 열어 아래의 명령어를 실행한다.cd frontappnpm install -D tailwindcss postcss autoprefixer..

[Svelte란?]Svelte(스벨트)는 JavaScript 라이브러리 중 하나로서 React보다 가볍고 Vue.js보다 쉽다는 장점을 가진 최신 프론트엔트 기술이다.스벨트는 JavaScript 코드로 브라우저가 이해할 수 있도록 컴파일을 해주는 컴파일러에 조금 더 가깝다.다시 말해 프레임워크 혹은 라이브러리를 다운로드할 필요가 없다. [Svelte의 구조]스벨트 파일은 주로 아래와 같은 구조로 구성되어 있다.script는 상단에 작성되어 JavaScript 또는 TypeScript를 사용할 수 있다.style은 CSS 스타일링이 가능하다.//마크업 영역 [Svelte Kit 개발환경 세팅]이번에는 스벨트를 사용하기 위해 스프링부트 환경에서 스벨트 킷 개발환경을 세팅해보도록 합시다.기존의 스프링부트에서 ..

[Ajax, Stomp 기반 멀티 채팅방 구현]저번 '멀티 채팅방 (2)' 포스팅에서 Ajax 기반의 멀티 채팅방을 구현하였다.하지만, Ajax를 적용했을 때 불필요한 데이터 전달때문에 서버 부하가 생길 수도 있다는 단점이 있다.해당 부분을 해결하기 위해서 웹 소켓을 사용해 볼 예정입니다.웹 소켓을 사용하면 브라우저와 서버간에 서로 데이터 전달을 하지 않고, 브라우저는 서버에게만 전달, 서버는 브라우저에게만 전달하는 형식이기 때문에 부하가 생기는 단점을 막을 수 있다.Stomp가 바로 그 웹 소켓 방식 중 하나라고 생각하면 좋다. [Stomp란?]Simple/Stream Text Oriented Message Protocol의 약어로 웹 소켓 위에서 동작하는 문자 기반 메세징 프로토콜로써 클라이언트와 서..

[Ajax, Stomp 기반 멀티 채팅방 구현]저번 '멀티 채팅방 (1)' 포스팅에 이어 ChatRoom과 ChatMessage 관련 MVC를 모든 구현하였다면 이제 템플릿을 통해 화면을 구현하고 실제로 JavaScript에 Ajax를 적용하여 실시간으로 채팅이 되는 것을 확인해봅시다.전체 코드와 패키지 구조는 깃허브 리포지터리 주소를 통해 참고 부탁드립니다.리포지터리 주소 : https://github.com/psm817/chat_review GitHub - psm817/chat_reviewContribute to psm817/chat_review development by creating an account on GitHub.github.com [list.html 생성]먼저 전체 채팅방 리스트를 보여..

[Ajax, Stomp 기반 멀티 채팅방 구현]이번 포스팅에서는 Ajax, Stomp 기반의 멀티 채팅방을 구현해 볼 예정입니다.전체 코드를 포스팅할 순 없기 때문에 전체 구조와 코드를 확인하시려면 리포지터리 주소를 참고 부탁드립니다.해당 프로젝트는 SpringBoot v_3.3.0, Java 21 기반으로 세팅되어 있습니다.리포지터리 URL 주소 : https://github.com/psm817/chat_review GitHub - psm817/chat_reviewContribute to psm817/chat_review development by creating an account on GitHub.github.com [Ajax란?]Ajax는 Asynchronous JavaScript and XML의..