본문 바로가기

개발/개발 방법 정리5

[gitlab] spring boot(gradle)+jenkins+docker을 이용한 자동 배포 구축 spring boot+gradle 프로젝트 작업중인 gitlab 브랜치가 있는데... 여기 푸시가 발생하면 자동으로 감지하고 배포하도록 cicd를 구축할 것이다. 일단 ec2에 putty를 이용하여 접속해준다.(putty아니어도 상관은 없겠지만 나는 푸티가 좋아) 사용할 포트들은 다 열어놓은 상태라고 가정. sudo apt install openjdk-11-jdk 자바 설치하고 sudo apt-get update sudo apt-get install docker.io 도커를 설치한다. docker run -d --name jenkins -p 7777:8080 -v /jenkins:/var/jenkins_home -v /usr/bin/docker:/usr/bin/docker -v /var/run/docke.. 2023. 3. 17.
CI/CD 어떻게 구현했는지 흐름 정리 이번 프로젝트에서 처음으로 ci/cd를 구축해보았다. 난 배포 쪽은 경험이 많지 않아서 다른 백엔드 팀원분의 도움을 많이 받았다. 하지만 그만큼 배운 것도 많아서 까먹기 전에 어떤식으로 구축했는지 흐름만 간략히 정리해 보려고 한다. 혹시 강좌글 같은 걸 기대하고 이 글을 클릭하셨다면.. 신속한 뒤로가기를 추천합니다.... cicd 구축에는 docker, ansilbe, aws를 사용하였다. 프론트는 react, socket.io를 이용하였고 백엔드는 intlleij, mysql을 이용하였다. - jenkins: 커밋/푸시가 발생하면 자동으로 빌드 - docker: 리눅스의 응용 프로그램들을 프로세스 격리 기술들을 사용해 컨테이너로 실행하고 관리하는 오픈 소스 프로젝트 - ansible: 여러개의 서버를 .. 2023. 1. 28.
cygwin 설치 및 간단한 openmpi 실습 수업시간에 한 실습 정리 위 페이지의 내용을 실습해 볼 것이다. 설치파일 다운로드- 윈도우 버젼 쭉쭉 next 눌러주다보면 패키지들을 다운로드 받을 사이트 주소가 뜬다. 사진에는 ftp://ftp.kaist.ac.kr 으로 되어있는데 이걸로 하면 tzdata 받을때 오류가 떠서 http://ftp.jaist.ac.jp 로 했다. 이걸로 하면 속도도 빠르고 오류도 안뜸 패키지 선택하는 페이지. 키워드로 검색해서 다운받을 패키지의 skip을 더블클릭하면 다운받을 버젼으로 바뀐다. vim libopenmpi-devel zlib-devel gcc-g++ libevent-devel libhwloc-devel 를 모두 선택해주고 다음을 누른다. 설치가 끝나면 cygwin 터미널을 연다. mpicc --version.. 2021. 9. 28.
[html] 부모와 상관없이 width 100% 주기 (+가로 스크롤x) width: 고정px margin:0 auto 를 이용해서 내용들을 중앙정렬했는데, 자식 요소들 중에서 가로 너비를 창크기와 같게 해야 하는 일이 생겼다. width: 100% 를 쓰면 상대적으로 계산돼서 부모의 width와 같게 된다. 그래서 width: 100% 대신 width:100vw; margin-left: calc(-50vw + 50%); 를 자식 요소에 넣어주면 부모와 상관없이 너비를 창 크기와 같게 할 수 있다. 하지만 이렇게 하면 가로 스크롤이 생긴다. 양옆에 약간의 여백도 있다. 양 옆의 여백은 body의 margin 때문이다. 개발자도구에서 확인해보고 body에 margin: 0 속성을 준다. 가로 스크롤이 생긴 이유는 width:100vw에 세로 스크롤까지 포함됐기때문이다. 최상위 .. 2020. 9. 16.
[React] 초간단 Fade In/Fade Out 이펙트 구현 const btnStyle = { display: "inline-block", border: "1px solid black", padding: "3px", cursor: "pointer", }; const box_active = { width: "300px", height: "200px", border: "1px solid black", position: "relative", background: "grey", opacity: "1", transition: "opacity 500ms", }; const box_hidden = { width: "300px", height: "200px", border: "1px solid black", position: "absolute", background: "grey.. 2020. 9. 16.
반응형

티스토리툴바