import React, { useState } from 'react'; React에서 사용하는 대표적인 변수이다. useState를 사용하기 위해서는 반드시 useState를 import 해야 한다. const [email, setEmail] = useState(""); useState를 사용하는 방법 중 하나이다. 변수명은 앞의 변수명1과 뒤의 변수명2가 있다. 변수명1은 값을 불러올 때 사용한다. 변수명2는 변수명1을 변경할때 사용한다. 변수명1을 변경하고 싶을때는 set변수명2(’변경 값’)으로 사용한다. ex) setEmail(”입력할 email 값”); ⏯️ 사용하기 setEmail(e.target.value)} autoComplete="off"/> 위의 useState를 input에 적용하였..
JavaScript, 현재 시간 가져오기 현재시간 가져오기 JAVASCRIPT에서 날짜로 불러오는 방법은 new Date(); 사용하면 된다. today : Wed Dec 07 2022 00:11:58 GMT+0900 (한국 표준시) Date(); 사용할 경우 결과는 다음과 같이 출력된다. 해당 데이터는 PC 시간 기준으로 결정이 된다. year : today.getFullYear(); // 현재 년도를 YYYY로 불러온다. month : today.getMonth()+1; // 현재 월을 M으로 불러온다. date : today.getDate(); //현재 날짜를 DATE로 불러온다. day : today.getDay(); //현재 요일을 불러온다. (일요일 0부터 시작한다.) 여기서 특이한 부분이 있..
React, axios 사용하기 axios 사용 JQuery에 ajax가 있다면, React에는 axios가 있다. axios를 다음과 같이 import 할 경우, axios를 사용할 수 있다. axios.get('http://localhost:8080/joinAction.ad?Email=MOLLANG101@test456.com&password=mollang') .then(function(response) { alert('성공'); }); axios.get(URL) 할 경우, 해당 action을 호출할 수 있다. axios 사용하기 - 2 function joinAction() { let param = { Email : 'test@mollang.com', Password : '1234' } const j..
JPA, 시간 Default 적용하기 시간 설정하는 방법 SpringBoot 시작할 때, @EnableJpaAuditing을 설정한다. @Entity에도 설정을 해야 한다. @EntityListeners(AuditingEntityListener.class)를 적용한다. @Column에는 화면과 같이 설정을 한다. @CreatedDate와 @LastModifiedDate는 Insert일 경우 등록된다. @LastModifiedDate는 해당 Entity일 경우 실행된다. 해당 JPA를 Insert 할 경우, 다음과 같이 등록된 것을 확인할 수 있다.
DataBase, Character 설정하기 DB Character 설정하기 alter database mollang default character set = UTF8; 먼저 만들어진 DB에 관해서 Character 설정하는 방법은 다음과 같다. 모든 Table의 기본설정을 적용하기 위해 사용한다.
JPA, Not Null 처리하는 방법 - Default 적용 JPA ColumnDefault DB에서 NotNull의 처리는 까다롭다. 해당 칼럼 값 속성이 NotNull일 경우, Null이 값일 때, Insert가 되지 않기 때문이다. 그렇기에 중요한 값일수록 null은 매우 치명적이고, JPA가 Table을 관리하는 만큼 JPA에서 Not Null 설정 시 어떻게 할 수 있는지를 알아봐야 했다. 그러나 이는 약간 일반적인 상식과 거리가 멀었다. @ColumnDefault는 해당 필드가 null일 경우, 적용될 Default 값을 설정한다. @ColumnDefault는 해당 필드가 설정될 경우, Class 위에 @DynamicInsert를 적용해야 한다. Insert할 때 null이 발견될 경우 De..
PostMan 기본 설정 PostMan 기본 URL 설정 데이터만 주고받는 API는 URL을 통해서 Java의 실행 여부를 결정짓는다. 그리고 Test를 위해서 URL을 입력할 수 있지만, 설정에 따라서 port가 변경될 수도 있고, 도메인이 변경될 수도 있기 때문에 그때마다 Test하는 설정을 바꾸는 것은 매우 귀찮은 일이 될 수도 있다. 이를 한 번에 해결 해 줄 수 있는 것이 바로 PostMan 프로그램이다. URL 설정하기 1. Environments를 클릭한다. 2. +(더하기) 버튼을 누른다. 3. 생성된 우측칸에 VARIABLE과 INTIAL VALUE를 입력한다. VARIABLE은 변수명이고, INTIAL VALUE는 VARIABLE를 불러올 때, 가져올 수 있는 값이다. 4. 명칭은 다음..
React, onClick 이벤트 만들기 회원가입 클릭시 회원가입 버튼 눌렀을 경우, Event가 발생되도록 하는 Event를 간단하게 만드려고 한다. HTML하고 비슷하지만 onClick 이벤트의 들어있는 값이 다른 것을 확인할 수 있다. joinAction이라는 명칭을 찾는 것인데, 이는 변수명 혹은 function명 모두 동일하게 적용된다. 해당 코드에서는 function명을 정의하는 코드명이며, joinAction을 찾아서 결과를 출력한다.
회원가입 HTML 회원가입에 대한 Input 생성 시, 자동완성으로 CSS가 깨지거나 값이 자동으로 입력되어 사용자에게 불편한 경우가 발생된다. 이를 해결하기 위해 적용하면 된다. 자동완성 종료 방법 1 autocomplete의 Value값을 off로 지정하면 된다. 위 문구가 html에서 제공되는 일반 기능이다. 방법 2 방법 1번이 적용이 안되었다면, 위 방법을 선택하면 된다. HTML의 기능이 아닌, 브라우저 기능으로 인한 로그인 창 불러올 수도 있다. 방법 3 방법 2가 적용 안 될 경우, Password입력 공간에 new-password를 입력하면 된다. 저장된 비밀번호를 호출하는 것이 아닌, 새로운 비밀번호를 입력하도록 강제를 부여한다. 위 방법은 저장의 개념이 아닌, 반 강제적으로 입력을 강..
Optional Operator mollang.first; // Null일 경우 Error 발생 mollang?.first;//Null일 경우 undefined 반환 JavaScript에서 Null일 경우 Error가 발생되어 JS의 동작이 원활하게 되지 않는 경우가 발생된다. 이를 해결하기 위해서는 객체를 호출할 때, 점 앞에 물음표를 넣기만 하면 된다. 만약, 값이 없을 경우 undefined 를 반환하므로 Error를 무시할 수 있다.
Spring, MyBatis의 resultMap MyBatis란? Spring이 지원하는 DAO, JTBC 기능 중 하나로 DB와 연결되는 부분 중 하나이다. SQL 문법 그대로 사용할 수 있다는 장점이 있어서 인기가 좋으며, 가독성 또한 월등하니 우리나라에서 많이 사용하는 형식이다. MyBatis의 오류 여기서 MyBatis는 해당 Bean 혹은 VO의 위치가 어딧는지를 모른다. 이 글을 읽는 독자 또한 저 TestVO가 무엇인지, 어느 패키지 장소를 구분하기란 어렵다. 이 부분을 해소시키기 위해서 resultMap이 있다. resultMap이 Mybatis에서 사용하는 Type의 위치를 어딧는지, 무엇인지 알려주는 기준점이 된다. 이 resultMap기능을 안 쓸 경우 사용하는 VO가 어딧는지를 명확..
Jquery, Hover 기능 만들기 Hover 기능 특정 영역에 마우스를 올렸을 때 발생되는 Event를 Hover라고 부른다. 카테고리, 메뉴 혹은 마우스 올렸을 때 , 사용자에게 강조하기 위해 많이 사용하며 CSS 외에 Jquery를 통해서 Hover기능을 추가할 수도 있다. Hover 기능 사용하기 //Hover 추가하기 //마우스 올렸을 때 발생되는 이벤트 $(Hover대상).hover(function() { $(this).css('background', 'green'); }, //마우스가 영역 바깥으로 나갔을때 발생되는 이벤트 function() { $(this).css('background', 'white'); }) 만약 Hover대상에 마우스가 올려갔을 경우, 배경이 초록색으로 변한다. 그..
이전의 미니프로젝트는 잠시 멈추고... 길이 다른곳으로 흘러들어가게 된다. 이전에 만들기로 한 React미니프로젝트는 멈추고... 기존의 언어를 사용해서 클론코딩 작업을 착수한다. 하나의 사이트를 모티브로, 코딩을 제작하는 모습이다. 일정 완료 날짜 : 10월 31일 목표로... 열심히 달린다. 갑작스러운 일정으로 인해, 최대한 작업일정을 남기며 작업을 하고 있다. 작업중인 곳. 실제로 운영하는 사이트를 모티브로 작성을 하고있다. 진짜 사이트 100%가 아닌, 90% 비슷하게 만들어서 가짜라는 티를 팍팍 내겠끔 만들었다. 현재는 진짜 사이트처럼 꾸미기 위해 꾸미는 중이다. 마무리 모든 것은 여유있게;;; 매일같이 이짓하면 내 자신을 위한 시간투자가 매우 어렵다. 누군지 모르지만...그분이 매우 밉다.
JiRa 일정관리, 지라를 아십니까? JiRa 프로젝트를 위한 간단한 스케줄러 관리 사이트라고 보면 된다. 키보드 만졌다 싶으면 나오는 이슈, 갑작스러운 버그. 일정은 코앞이고, 해야 할 것은 너무 많아서 일정관리가 매우 피곤해진다. 캘린더, Todo만으로는 일정관리가 어렵다면 지라를 사용해 보는 것을 추천한다. 일정을 좀 더 세분화시키고, 그 세분화를 더 쪼갠다. 현재 하는 일, 못 할 일, 해야 할 일을 구분 지을 수 있다. 위의 사진은 일정에 대해서 간략하게 작업해둔 것이다. 지라의 구분 지라는 크게 4가지로 구분 짓는다. 로드맵, 백로그, 보드, 보고서이다. 이 모든 것은 우리 프로젝트가 현재 진행상황, 이슈사항을 쉽게 알아볼 수 있도록 정리되어있는 기준이다. 로드맵 현재 화면을 로드맵이라고 부른..
Spring, Out of range value column Error 문단제목 갑작스러운 Error 코드가 발생되었다. Out of range value for column 'PLACE_TYPE' 의 ERROR이다. 원인은 다음과 같다. DB의 TYPE과 Java의 Type가 일치 혹은 값을 넘겨받을 수 없을 경우 발생된다. 필자가 이 같은 원인이 나온 이유는 DB는 VARCHAR(String)을 입력해놓고, VO는 int로 설정했었다.