전체 글
-
GridSatck (Test.html)기초/자바스크립트 2022. 3. 16. 11:30
대쉬보드를 위젯형식으로 만드는 방법을 찾아보다가 좋은 소스를 발견했다. https://gridstackjs.com/# gridstack.js | Build interactive dashboards in minutes. Getting Started Create your first interactive grid by copy-pasting the HTML+JS, as seen below... Code npm install gridstack then in html: .grid-stack { background: #FAFAD2; } .grid-stack-item-content { background-color: #18BC9C; } var items = [ {content: ' gridstackjs.com 사용법..
-
[Docker] 도입서버/DOCKER 2022. 3. 7. 17:04
도입목적 비슷한 프로젝트 도입시 필요한 라이브러리들을 zip으로 옮겨받는게 싫었다. > SVN에 환경설정이라는 파일로 저장 후 해당 프로젝트의 라이브러리들을 올린뒤 다운로드 후 사용했다. 도커 도입전 프로젝트 관리 SVN - 소스 - 라이브러리 - DOCS ( 프로젝트 개발일지 ) - 유지보수 문제점 1. 이렇게 관리하고있었으나 환경설정이 꼬이면 프로젝트를 구성했던 담당자를 찾아가 환경설정을 물어보는 귀찮음이 발생하고있었다. 2. 해당 프로젝트를 수정하고 있으면 다른사람은 수정 할 수 없는 lock조건 발생하였다. 그러던 도중 DOCKER - GITLAB을 발견하고 도입하기로 결정했다. 개선목적 1. 환경설정 동일화 - 그냥 환경설정을 통째로 가져오고 싶었다. 2. 다른 사람이 수정을 간섭하지않고 내 소..
-
[Docker] 기본개념 정리서버/DOCKER 2022. 3. 7. 15:13
유튜브 생활코딩 -docker편 정리 Docker Desktop 설치 Hyper-V ( 가상화 ) 사용 https://www.docker.com/products/docker-desktop 다운 출처 : 생활코딩 Docker 구축단계 docker 확인 docker -v docker registry 설정 images : 설치된 이미지 확인 docker images pull : 이미지 설치 docker pull 이미지이름 : 이미지 설치 rmi : 설치된 이미지 제거 docker rmi 이미지이름 : 설치된 이미지 제거 run : 이미지 → 컨테이너 docker run 이미지이름 : 컨테이너 이름 자동생성 docker run --name 컨테이너이름 이미지이름 : 컨테이너 이름 자동지정 docker run -..
-
[JS] 모자이크 처리기초/자바스크립트 2022. 3. 4. 09:39
테스트 페이지 https://eaststar1129.github.io/mozaic.html 구성도 마우스를 올렸을때 그림에 마우스 영역이 나타나며 모자이크를 클릭시 모자이크 / 되돌리기를 구현 코드 Canvas 활용 Canvas 3개 - 원본 - 마우스 영역 - 수정되는 영역 페이지 로드시 원본, 모자이크영역에 이미지 삽입, hover영역 초기화 마우스 move시 hover 영역에서 사각형을 계속 표시 마우스 out시 hover 영역 초기화 마우스 click시 원본데이터를 가져와 모자이크 / 원본그대로 수정데이터에 삽입 Canvas의 index는 원본 < 수정본 < hover 순 [css] html, body{ margin:0; padding:0; } #divCanvas { position:relativ..
-
[알고리즘]다이나믹프로그래밍-1로만들기알고리즘 2022. 2. 21. 22:30
정수 X에 사용할수있는연산은 다음과같이 세가지 1. X가 3으로 나누어 떨어지면 3으로 나눈다. 2. X가 2로 나누어떨어지면 2로나눈다. 3. 1을 뺀다. 예제 ) 8 , 10 최소 : 8 4 2 1 (3회) 3으로 먼저 나누려는 경우 : 8 7 6 2 1 (4회) 최소 : 10 9 3 1 (3회) 2로 먼저나누려는 경우 : 10 5 4 2 1 (4회) 점화식 구하기 2나 3의 배수일 경우 바로 구한다. 아닐경우 -1을 하여 다시 구한다. public static int[] arr; public static int calc(int n){ if( n== 1 ){ return 0; } if( arr[n] > 0 ){ return arr[n]; } arr[n] = calc( n-1 ) + 1; //2로 나누..
-
[알고리즘] 다이나믹프로그래밍알고리즘 2022. 2. 21. 21:50
Overlapping Subproblem 겹치는 작은 문제 Optimal Substructure 최적부분구조 Optimal Substructure 목적 문제의 정답을 작은 문제의 정답에서 구할수 있다. 모든 문제를 풀며, 모든 문제는 1번만 풀어야한다. 시간복잡도 문제의 개수 : N 모든 문제를 1번씩 푸는 시간 : 1 O(N)의 시간복잡도를 가진다. ex) 서울 > 부산 가장빠른길은 대전과 대구를 거친다의 조건이 있을경우, 대전 > 부산 가장빠른길은 대구를 거친다. 프로그래밍 방법 Optimal Substructure을 만족하면 정답을 메모한다. ( 코드에선 배열 ) Memoization 예제 피보나치수열 피보나치를 구하게 될경우 아래의 코드와 같다. int fi(int n){ if( n
-
[Spring] 시큐어 코딩 가이드기초/SPRING 2022. 1. 3. 14:19
시큐어코딩 요점 1. Front-End의 예외처리는 안전하지않다. Front-End의 예외처리는 사용자의 편의를 위함 Back-End의 Value 예외처리를 통하여 보안을 검증한다. Spring , Spring Boot의 경우 @value를 통하여 Vo의 데이터를 검증할 수 있다. 2. Header의 예외처리는 사용하지않는다. Header값의 변조는 상당히 쉬운것으로 확인되었다. refer, url, cookie등의 검증에서 중요한 데이터를 사용하지 않는다. cookie의 값은 중요한 데이터를 사용하지않으며 session으로 관리한다. InterCeptor 추가 3. 암호화의 중요성 암호화에는 단방향 / 양방향 암호화가 존재한다. 중요한 데이터의 경우 단방향 해쉬함수를 통하여 관리한다. 행안부(2020년..