2월, 2020의 게시물 표시

JSP에서 git auto push 하기

JSP에서 Github autopush 환경 만들기 개발환경 Server : Tomcat8 OS : window10 구현 DB에 Data가 갱신될 때 마다 Github 저장소에 auto push 기능을 구현하고자 하였다. 이를 위해서 우선적으로 bat파일을 만들어 jsp환경에서 성공적으로 DB에 Update 시 실행하도록 하였다. batch 파일 코드 F: #batch파일이 존재하는 드라이브 위치 cd 'batch가 위치할 폴더 경로' #batch 파일이 위치 할 폴더 경로 git add . #git에 변경된 사항에 대해서 스테이징 한다. git commit -m "auto push(file upload)" #commit실행 git push origin master #git 저장소에 push jsp에서 Runtime의 exec함수를 사용하여 batch파일을 실행하도록 코드를 작성하였다. <%@ page import="java.lang.Runtime"%> //Runtime import Process process = Runtime.getRuntime().exec("파일경로"); process.waitFor(); //batch파일이 실행되기 까지 대기 //Option : 실행 결과에대해서 알고 싶은 경우 구현 BufferedReader br = new BufferedReader(new InputStreamReader(process.getInputStream())); String line = null; while((line = br.readLine()) != null){ out.println(line); } br.close(); //Option 끝 process.destroy(); //완료된 프로세스 제거 이슈 batch파일을 터미널에서 실행 시 정상적으로 수행되었으나 jsp코드 상 실행 시 무한 loop가 걸리는

React.js Hook 학습

React.js의 Hook에 대해서 학습 및 사용 학습의 경우 공식 홈페이지를 참고하여 진행( 공식홈페이지 ). React 버전 16.8.0이상, React Native 0.59이상에서 지원 등장 배경 기존 React에서 state를 사용하기 위해서는 class형태에서 React.component를 상속하여 사용 상속 없이 import 방식으로 Function이나 const같은 함수에서 state 사용할 수 있도록 지원하는 개념 함수 컴포넌트에서 React state와 생명주기 기능(lifecycle features)을 “연동(hook into)“할 수 있게 해주는 함수. 개념 state를 사용하기 위해 class를 사용하는데 이를 대체하여 class가 아니여도 state관리 및 rife-cycle사용이 가능하게 해주는 API 좀 더 재사용 가능한 컴포넌트를 작성하는데 도움을 주기 위해 나옴 class안에서는 동작하지 않음 문법 중복하여 사용 가능(state, effect 동일) State Hook state를 대체하는 개념으로 useState를 react로 부터 import하여 사용 useState는 2개의 항목을 가지는 배열을 반환. 인자로 주는 값의 경우 초기 변수 값을 나타낸다. 💡 return [현재 변수값, 변수를 바꾸는 setter 함수]; 사용 예시 import React, { useState } from 'react'; //useState가 hook function Example() { // "count"라는 새 상태 변수를 선언합니다 const [count, setCount] = useState(0); //useState는 중복하여 호출가능(각자 독립된 state를 가짐) const [fruit, setFruit] = useState('banana'); const [todos, setTodo

IE8이하 Split Bug

split()함수에 Regex를 사용 시 ""값이 return되지 않는 문제 고객이 네트워크 속도 문제로 인해 필요없는 파일을 load하지 않기로 하였다. 이에 대해서 특정 js파일을 load제외하였는데 그로인해 IE8에서 textsize를 계산할 때 다른점이 발견되었다. 이러한 부분을 조사 중 IE8에서 split()에 정규식 공백문자(" ")를 사용 시 반환되는 배열에 empty string("")값이 제외되는 문제가 발생하였다. String.split() syntax 💡 String.split([separator[, limit]]) separator : 끊을 문자 or 정규식 limit : 몇 개 까지 자를 지에 대한 숫자 만약 " ab c d e fg 123 "와 같은 문자열이 있다고 하자. 이 문자열에 대하여 " " 공백문자를 기준으로 자르고자 한다. 그렇다면 split()함수에 " "공백을 인자로 사용 시 ""을 포함한 배열이 반환 될 것이다. 근데, 만약 정규식을 사용 한다면 어떻게 될까? 보통 정규식을 사용 시 다음과 같이 사용을 할 것이다 💡 var reg = /abc/; var reg = new RegExp("abc"); 두 방식의 차이는 컴파일 시점의 차이로 첫 번째 방식의 경우 스크립트가 load되는 시점에 컴파일 되며 두 번째의 경우는 정규식이 실행되는 시점에 컴파일 된다. 만약, 상수와 같이 고정된 조건에 대해서 사용하는 경우 첫 번째 방식을 사용하며, 조건이 변경되는 경우는 두 번째 방식을 사용하면 될 것이다. 테스트 실행결과의 경우 아래에서 확인 가능하며, 해당 파일은 GitHub 저장소에 업로드되어있다.( 저장소 ) https://angwangho.github.io/sampleFile/window_method/split.html 위 샘플에서 확인하였듯이 spli

slack에 notion 연동하기

이미지
slack에 notion 연동하기 notion 저장소 생성 좌측 상단의 현재 저장소의 이름을 선택하면 리스트 창이 나타나며 가장 하단의 생성 버튼을 선택 저장소 이름을 입력 후 'Next'버튼을 클릭 상단 버튼을 클릭 시 아래에서 선택한 템플릿으로 저장소 생성, 하단의 문자열을 선택 시 빈 템플릿으로 시작 새로운 페이지를 추가하고자 할 시 좌측 사이드바의 Templates을 선택 다음과 같이 Modal창이 나타나며 우측 사이드바에서 원하는 탬플릿을 선택 후 'Use This Template'버튼을 클릭 ex) 'Full Template Gallery'를 선택 시 사용자가 등록한 템플릿 사용 가능 생성 완료 시 좌측 사이드바에 해당 템플릿이 등록된 것을 확인할 수 있습니다. 새로운 글 등록 시 양식을 선택하여 생성할 수 있으며 '∨'버튼을 클릭하여 해당 창에서 선택할 수 있습니다. 또한, 해당 양식에 대해서 수정이 가능하며 양식 창에서 말줄임표를 선택 시 창이 나타납니다. 이 창에서 Edit 선택하여 나타난 Modal창에서 양식을 수정 할 수 있습니다.   slack과 연동하기 현재, 연동과 관련하여 가이드가 존재하며 이를 참고하여 진행하였습니다.( 링크 ) 상단의 Updates를 선택 후 'Connect Slack Channel' 토글을 활성화 합니다. 연동하고자 하는 slack채널을 선택 후 'Allow'버튼을 클릭합니다. 연결 완료 시 다음과 같이 변경 되며 slack의 채널에 연결 성공 메시지가 나타납니다. 다음과 같이 테스트용 글을 생성 시 알림이 발생하는 것을 확인 할 수 있습니다.(일정 시간이 지난 후 알림이 발생되고 있는것을 확인)

slack에 github 연동하기

이미지
Slack에 github 연동하기 slack에 github App 추가 좌측 사이드바에서 Apps선택 후 'Browse App Directory'버튼 클릭 github 검색 후 결과창에서 선택 'Add to Slack'버튼 클릭 'Continue'버튼 클릭하여 진행 'Select channels'카테고리 3개 중 1개를 고른 후 Install 진행 (추후 설정 변경 가능) 진행 시 다음과 같은 이미지가 보이게 되며 완료 시 " open this link in your browser. "문구를 클릭하여 slack으로 이동 slack이 이미 활성화되어 있는 경우 현재 창을 닫아도 무방 진행중 완료 시 이미지 정상적으로 GitHub App이 설치된 경우 좌측 사이드바에 GitHub라는 항목이 추가 된다. GitHub관련 알람을 변경하고자 할 때 GitHub페이지의 About을 선택한다. Settings를 선택 기존 설치단계에서 설정했던 채널관련 수정이 가능하며 필요 시 수정한다. GitHub 저장소 연결 및 알림설정 GitHub 저장소 연결을 하기 위해서는 다음과 같은

[프로그래머스] 파일명 정렬 javascript

[2018 KAKAO BLIND RECRUITMENT] [3차] 파일명 정렬 javascript 조건 files 는 1000 개 이하의 파일명을 포함하는 문자열 배열이다. 각 파일명은 100 글자 이하 길이로, 영문 대소문자, 숫자, 공백("  ), 마침표( . ), 빼기 부호( -")만으로 이루어져 있다. 파일명은 영문자로 시작하며, 숫자를 하나 이상 포함하고 있다. 중복된 파일명은 없으나, 대소문자나 숫자 앞부분의 0 차이가 있는 경우는 함께 주어질 수 있다. ( muzi1.txt ,  MUZI1.txt ,  muzi001.txt ,  muzi1.TXT 는 함께 입력으로 주어질 수 있다.) 제한사항 파일명은 크게 HEAD, NUMBER, TAIL의 세 부분으로 구성된다. HEAD는 숫자가 아닌 문자로 이루어져 있으며, 최소한 한 글자 이상이다. NUMBER는 한 글자에서 최대 다섯 글자 사이의 연속된 숫자로 이루어져 있으며, 앞쪽에 0이 올 수 있다.  0 부터  99999  사이의 숫자로,  00000 이나  0101  등도 가능하다. TAIL은 그 나머지 부분으로, 여기에는 숫자가 다시 나타날 수도 있으며, 아무 글자도 없을 수 있다. 파일명 HEAD NUMBER TAIL foo9.txt foo 9 .txt foo010bar020.zip foo 010 bar020.zip F-15 F- 15 (빈 문자열) 파일명을 세 부분으로 나눈 후, 다음 기준에 따라 파일명을 정렬한다. 파일명은 우선 HEAD 부분을 기준으로 사전 순으로 정렬한다. 이때, 문자열 비교 시 대소문자 구분을 하지 않는다.  MUZI 와  muzi ,  MuZi 는 정렬 시에 같은 순서로 취급된다. 파일명의 HEAD 부분이 대소문자 차이 외에는 같을 경우, NUMBER의 숫자 순으로 정렬한다. 9 < 10 < 0011 < 012 < 13 < 014 순으로 정렬된다. 숫자 앞의 0은