본문 바로가기

전체 글

(267)
시계 컴포넌트 (사용자 Hook) 에서 10분 단위로 표출하기 (day.js, floor) 현재 상황은 DB에는 10분단위 데이터가 쌓일 예정 하지만 시계는 실시간 정보를 화면에 보여주고 있다. 이러한 이유로 해당 정보에서 0~9분 데이터는 지우고 만약 현재 시간이 16분이라면 10분, 35분이라면 30분 등으로 표시될 수 있게 스크립트를 구현하였다. import { useEffect, useState } from 'react'; import dayjs from 'dayjs'; const useFloorTime = () => { const [clock, setClock] = useState(''); useEffect(() => { const interval = setInterval(() => { let now = dayjs(); let minutes = now.minute(); minutes ..
리액트 - 범위 슬라이더 현재 진행하고 있는 프로젝트는 리액트 + 스프링 부트로 이루어져있다. 일단 리액트를 사용할 줄 아는 선임이 없어 독학하면서 프로젝트 진행 중인 상태이다. 내가 원하는 슬라이더는 배너나 이미지 슬라이더가 아닌 범위 슬라이더이다. 흔히 쇼핑몰에서 검색 필터에 나오는 가격 슬라이더 같은 느낌의 ?.. 구글링을 해보니 리액트에서 많이 사용하는 무한 스크롤이 제일 많이 검색되었고, 그 다음은 라이브러리 위주만 나와서 내가 원하던 정보가 없던 중 input type 요소 중 range 라는 것을 발견 사용 해보니 내가 원하던 슬라이더 바가 나왔다. 이 value 값을 컨트롤 하기 위해 const handleChange = e => { let slider = document.getElementById('myRange..
인텔리제이 커뮤니티 ( IntelliJ Community) 에서 스프링부트 + npm + node.js + 리엑트 환경 실행 결론 : 유료버전 사용하면 고생 안해도 됩니다.. 새로 인수인계 받게 된 프로젝트는 그동안 사용한 Spring + jsp 프로젝트가 아니였다. frame-work : Spring-boot front : React back : Java / node.js 정확한 작동방식은 잘 모르고 일단 프로젝트 실행을 할 때 애 먹어서 기록을 남긴다. 먼저 교육용 혹은 얼티밋 버전을 사용하면 플러그인에서 node.js를 사용하여 node 서버를 띄우는 것이 간단하다. 하지만 커뮤니티 버전에서는 node.js , vue.js 등의 플러그인들은 지원하지 않기 때문에 나는 Terminal을 이용하였다. 먼저 , node.js 같은 경우 package.json 파일이 있을 것이다. 실행될 때 , package.json 안에 있는..
아이바티스 - 항목 별 합계 ( 대분류별 합계 소분류별 합계 ) 게시판을 만들다 보면 항목별 합계가 필요할 때가 있다. 단순히 해당컬럼 값들에 대한 합을 구하면 SUM 한번으로 끝나지만, 소분류끼리의 합을 대분류를 기준으로 해서 끊어서 합을 구할 때 사용한 방법이다. 다음과 같이, 합계는 대분류 끼리 따로 나오게 할 것이다. SUM(b.컬럼1) OVER(PARTITION BY a.대분류코드,a.소분류코드) AS 합을부를별칭 SUM(b.컬럼2) OVER(PARTITION BY a.대분류코드,a.소분류코드) AS 합을부를별칭 SUM(b.컬럼3) OVER(PARTITION BY a.대분류코드,a.소분류코드) AS 합을부를별칭 SUM(b.컬럼4) OVER(PARTITION BY a.대분류코드,a.소분류코드) AS 합을부를별칭 SUM(b.컬럼5) OVER(PARTITION B..
아이바티스 - 날짜 출력 object object 뜰 때 (TO_CHAR) 날짜를 출력하고자 할 때 , 화면에 object object가 들어가있는 것을 볼 수 있다. 테이블에 insert 되어있는 정보가 DBMS에 DATE로 들어가 있기 때문에 바로 출력을 하게 되면 해당화면을 볼 경우가 있다. 이럴 때 가장 쉬운 방법으로는 SELECT 문에서 데이터를 가져올 때 TO_CHAR를 사용해주면 된다. SELECT TO_CHAR(날짜컬럼, 'YYYY.MM.DD") AS 별칭 FROM 테이블명 이런식으로 하게되면 연도.월.날짜로 출력되게 된다. 작은 따옴표 안에 . 과 같은 구분자는 - 나 _ 등 다른 구분자를 사용할 수 있으니 본인이 원하는 출력대로 바꾸어 사용하면 된다!
아이바티스 include 서브쿼리 ( 검색 + 정렬 ) , sql,jqgrid 공지사항 게시판을 출력해주는 SQL문이 있다. 통상적으로 아이바티스의 경우 이런 식으로 해당 쿼리문을 실행할 id와, input, output으로 수행한다. 기본적으로 게시판 selectAll 문에는 serach 즉 검색이 포함되어 있는 경우가 많다. 내가 이 서브쿼리를 사용하게 된 이유는 , 1순위로 공지사항이 최상단에 출력되고, 그 후에 출력 되는 것들은 PK에 의해 출력 되고, 그 후 페이징처리를 위해 cnt값을 넘겨주어야 했다. 먼저 serach를 통해 select 될 아이바티스 sql문을 작성한다. /* DAO.selectList */ SELECT A.컬럼1 , A.컬럼2 , A.컬럼3 FROM 테이블명 A WHERE 1=1 A.조건1컬럼 = #search조건1# A.조건2컬럼 = #search조건2# ..
1 IDE = Eclipse DB = Oracle 11g DB Tools = DBeaver JDK ver = 1.8.0_202 형상관리 : SVN 전자정부프레임워크 사용 + 통합 지하안전관리시스템 모의훈련 관리 페이지
기술면접 준비 각 키워드 ▶ 서버와 클라이언트 - 서버 : 서비스를 제공하는 컴퓨터 (service provider) 서비스를 제공하는 소프트웨어가 실행되는 컴퓨터 - 클라이언트 : 서비스를 사용하는 컴퓨터 (serivce user) 서버에 요청을 보내고 응답을 받는 역할 서버는 클라이언트로부터 요청을 받아 응답을 내려주고 클라이언트는 서버에 데이터를 요청하고 응답을 받는다. 재화와 서브스의 개념에서 가져와 서비스라고 일컫는다. ▶ 웹 접근성을 위한 시맨틱 태그 시맨틱 : 의미를 가지는 등 의미가 있는 태그의 내용을 명확하게 정의해줌 장점 : 검색엔진 최적화 시각장애를 가지고 있는 클라이언트가 스크린 리더를 사용할 때 웹 접근성이 높아짐 애플리케이션 , 기업 및 커뮤니티에서 데이터를 공유하고 재사용 할 수 있다. ▶ 반응형 웹 ..