gitlab 프로젝트 CI/CD 환경 구축하기 6편 -gitlab에 push하면 자동으로 프론트엔드 빌드하기-

1. gitlab connection 이전에 했던 gitlab connection을 수행한다 gitlab 프로젝트 CI/CD 환경 구축하기 2편 -window에서 jenkins와 gitlab 프로젝트 연동하기 연습- (tistory.com) gitlab 프로젝트 CI/CD 환경 구축하기 2편 -window에서 jenkins와 gitlab 프로젝트 연동하기 연습- 1. plugin 설치 다음 링크에 나온대로 plugin을 모두 설치해줌 [CI CD] Jenkins와 Gitlab 연동 및 CI/CD 구축하기 (tistory.com) [CI CD] Jenkins와 Gitlab 연동 및 CI/CD 구축하기 1. Jenkins 플러그인 설치 우선, Jenkins와 Git deepdata.tistory.com gi..

• format_list_bulleted 프로그래밍/docker & jenkins
• · 2023. 2. 4.
• textsms

gitlab 프로젝트 CI/CD환경 구축하기 3편 -window에서 node.js & react 프로젝트 빌드해보기-

1. nodejs 플러그인 설치 확인 dashboard 누르고 jenkins 관리에 들어가서 플러그인 관리로 들어간다. installed plugins에서 nodejs 검색해서 nodejs plugin이 설치되어있는지 확인 없다면 available plugins에서 설치해준다 2. nodejs 설정 cmd에 들어가서 node -v 입력해서 본인의 nodejs 버전 확인해본다 다시 jenkins 관리 > global tool configuration으로 들어간다 내려가다보면 NodeJS라고 있는데.. Add NodeJS 눌러서 name은 아무거나 입력하고 아래 version 부분에 본인 nodejs 버전을 찾아서 선택해준다 꼭 버전 안맞아도 될것 같긴함 아무튼 아래에 save 3. shell 설정 빌드를 ..

• format_list_bulleted 프로그래밍/docker & jenkins
• · 2023. 2. 2.
• textsms

react & node.js 개발 - mysql에 배열 데이터 저장하기

여러가지 방법이 있는 것 같은데 성능적으로는 배열 자료형을 문자열로 바꿔서 문자열로 저장하는 방법이 좋은 것 같다 배열이나 객체를 문자열로 바꾸는 방법은 JSON.stringify() 그리고 이렇게 바뀐 문자열을 다시 배열이나 객체로 바꿀려면 JSON.parse()하면 된다 다음과 같이 객체 optionData를 JSON.stringify()로 문자열로 바꿔서 서버에 보내준다 var optionData = { title: title, description: description, data: data.map(x => { return { optionTitle: x.optionTitle, targetUploadType: x.targetUploadType, uploadTargetPath: x.targetUplo..

• format_list_bulleted 프로그래밍/node.js
• · 2023. 1. 31.
• textsms

react에서 setState 함수의 비동기적 처리 특징 기억해두기

react에서 useState로 만든 state에 대해 상태 변경을 위해 setState 함수를 사용하는데 이게 비동기적으로 처리된다는 특징이 있다 그래서 setState로 상태 변경을 하고 console.log로 전후 비교해도 상태가 안바뀌는 것을 확인할 수 있다 const [board,setBoard] = useState({}); const data = {id:state}; const response = await axios.get('/get/one',{ params: data}) console.log(response.data); console.log(board) setBoard(response.data); // 데이터는 response.data 안에 들어있습니다. console.log(board);..

• format_list_bulleted 프로그래밍/React
• · 2023. 1. 31.
• textsms

react & node.js 개발 -get요청으로 서버에 데이터 보내는 방법

get요청으로 단순히 다음과 같이 데이터를 보내면.. 서버가 데이터를 받지 못한다 //client const data = {id:state}; const response = await axios.get('/get/one',data) 서버에서 다음과 같이 data를 받아본다면... //server.js app.get('/get/one', (req,res) => { console.log(req.body) }) data를 받을 것으로 기대되는데 실제로 아무것도 찍히지 않는다 get요청으로 데이터를 보낼때는, get요청이 post와는 다르게 주소창을 통해서 데이터를 보내기 때문에 params라는 옵션으로 다음과 같이 데이터를 보내줘야한다고 한다 //client const response = await axios..

• format_list_bulleted 프로그래밍/node.js
• · 2023. 1. 31.
• textsms

react에서 webcam 사용해서 얼굴 캡쳐하기

1. navigator.mediaDevices.getUserMedia() navigator.mediaDevices.getUserMedia()를 이용하면 사용자 기기에 내장된 웹캠을 이용하게 한다 인자로는 객체 형태로 보통 video : true하면 비디오를 쓰고 audio: true하면 오디오를 쓰고.. 그 외에 비디오 화면 크기 width, height도 주기도 한다 const getWebcam = (callback) => { try { const constraints = { 'video': true, 'audio': false } navigator.mediaDevices.getUserMedia(constraints) .then(callback); } catch (err) { console.log(er..

• format_list_bulleted 프로그래밍/React
• · 2023. 1. 25.
• textsms