분류 전체보기(129)
-
SVN - JENKINS 로 배포하기 2 - SVN 프로젝트 생성하기
지난장에서는 젠킨스의 설정을 마무리 하였다. 이번에는 SVN에 있는 프로젝트를 젠킨스에 생성 및 설정하는 방법에 대해서 알아보자. 먼저 젠킨스 메인에서 새로운 Item을 클릭한다. 그 후 프로젝트 이름 입력 후 Maven project를 클릭 후 OK 버튼을 클릭한다. (다른 형식의 프로젝트라면 그에 맞는 프로젝트를 선택한다.) 먼저 SVN 의 프로젝트를 받기 위해 아래와 같이 선택을 하여 SVN 프로젝트의 URL을 입력한다. 그 후 Add를 눌러 SVN 계정을 입력한다. SVN에 접속하기 위한 계정정보를 입력 후 ADD를 클릭한다. 추가 후 아래와 같이 계정 선택이 가능해진다. 그 후 해당 프로젝트의 pom.xml 파일의 경로를 아래와 같이 입력한다. 만약 pom.xml 파일이 svn 경로 아래에 바로..
2021.08.13 -
SVN - JENKINS 로 배포하기 1 - 젠킨스 설치 및 기초세팅
젠킨스 설치를 위해 아래 사이트에 접속을 하여 war 파일을 받아준다. https://www.jenkins.io/download/ Jenkins download and deployment Jenkins download and deployment The Jenkins project produces two release lines: Stable (LTS) and regular (Weekly). Depending on your organization's needs, one may be preferred over the other. See the links below for more information and recommendations abo www.jenkins.io 다운받은 war 파일을 현재 사용중인 ..
2021.08.13 -
React - 파일 데이터 전송하기(파일 업로드, 파일 미리보기)
리액트에서 파일 업로드를 하는 방법은 기존 ajax를 사용하는 방법과 크게 다르지 않다. 스테이트에 파일 데이터를 넣는 방법이 다른 부분이 있어서 해당 부분부터 처리를 해야한다. 먼저 아래와 같이 두개의 스테이트를 생성한다. const [imgBase64, setImgBase64] = useState([]); // 파일 base64 const [imgFile, setImgFile] = useState(null);//파일 imgFile은 이미지 파일 그 자체를 받을 스테이트이고, imgBase64는 미리보기를 구현하기 위해서 이미지 데이터를 받을 스테이트이다. 아래와 같이 input을 만들어준다. 위 input에 파일을 등록하면 handleChangeFile 함수가 실행한다. const handleChan..
2021.05.27 -
Spring - Ajax 사용하여 이미지 , 파일 업로드 구현하기 (feat. AWS S3)
Ajax를 이용하여 이미지 및 파일을 업로드 하는 방법을 알아보도록 하겠습니다. 본 글에서 이미지 저장은 로컬 저장소가 아닌 AWS S3 를 이용하여 저장을 합니다. 먼저 ajax에서 이미지 입력을 받아서 백엔드(스프링)으로 넘겨줘야 합니다. 이때 formData 라는 객체를 사용하게 됩니다. var formData = new FormData(); 해당 객체를 통해 파일 및 일반 데이터(텍스트)를 아작스에 담아서 넘길 수 있습니다. public class testDto { private String test1; private String test2; private MultipartFile[] test3; public String getTest1() { return test1; } public void s..
2021.05.17 -
React - 페이지간 데이터 이동하기 (feat. 모달창 만들기)
리액트를 하면 서로 다른 js 파일끼리 스테이트나 데이터를 주고 받아야 하는 경우가 있다. 이럴 경우에 어떻게 작성하면 될지 알아보고, 리액트에서 모달창을 만들어 보자. 먼저 불러올 화면, 이동할 화면을 만든다. 이전 장에 이어서 test3.js 파일을 만들었고 아래와 같다. import React, { useState, useEffect,useCallback } from 'react'; function Test3({setModal,testdata}) { console.log(testdata) return ( {testdata.map((item,index,a)=>{ console.log(a) return ({index}{item.NICKNAME}) })} close ); } export default T..
2021.05.12 -
Spring - 구글 로그인 구현하기 -2
이제 코드로 들어가서 페이지 상단에 다음과 같이 추가한다. 저 부분에 이전에 발급 받은 클라이언트 ID 를 붙여넣는다. 위 코드를 넣으면 자동으로 api 사용이 가능하다. 이제 구글 로그인 버튼을 원하는 곳에 아래와 같이 만든다. Google Login g-signin2 를 찾아서 자동으로 버튼을 만들어 준다. 이제 onSignIn()의 정의를 아래와 같이 해준다. function onSignIn(){ var auth2 = gapi.auth2.getAuthInstance() if(auth2.isSignedIn.get()){ var profile = auth2.currentUser.get().getBasicProfile(); googleLoginPro(profile) console.log('ID: ' + ..
2021.05.12