IT & Tech

기본: element.focus(), <input autofocus/> autoFocus아님

react 간단버전: <input ref = { input =>  input && input.focus() } />

react

import React, { useEffect, useRef } from 'react';

export default function MyComponent(): JSX.Element {
    const inputReference = useRef<HTMLInputElement>(null);

    useEffect(() => {
        inputReference.current?.focus();
    }, []);

    return (
        <div>
            <input ref={inputReference} />
        </div>
    );
}

react useFocus hook 버전

const FocusDemo = () => {
    const [inputRef, setInputFocus] = useFocus()

    return (
        <> 
            <button onClick={setInputFocus} >
               Focus
            </button>
            <input ref={inputRef} />
        </>
    )
}

const useFocus = () => {
    const htmlElRef = useRef(null)
    const setFocus = () => {htmlElRef.current &&  htmlElRef.current.focus()}

    return [ htmlElRef, setFocus ] 
}

<input ref={input => input && input.focus()}/>

select unnest(array[1,2,3]);

unnest

1

2

3

STRING_TO_ARRAY(str text, delimiter text [, null_str text])

SELECT STRING_TO_ARRAY('A|B|C|D', '|') ;

--Results
{A,B,C,D}

SELECT STRING_TO_ARRAY('A|B|C|D', '|','B')

--Results
{A,,C,D}

SELECT 
  MS.SCHEDULE_ID, 
  SPC."CROP_ID" AS CROP_ID, 
  SPC."CROP_PRODUCT_ID" AS CROP_PRODUCT_ID, 
  SPC."FLOW_ID" AS FLOW_ID, 
  SPC."CROP_NM" AS CROP_NM, 
  SPC."CROP_PRODUCT_NM" AS CROP_PRODUCT_NM, 
  SPC."FLOW_NM" AS FLOW_NM 
FROM 
  MDM_SCHEDULE MS, 
  jsonb_to_recordset(MS.CROP_PRODUCT_FLOW :: jsonb) as SPC(
    "CROP_ID" text, "CROP_PRODUCT_ID" text, 
    "FLOW_ID" text, "CROP_NM" text, "CROP_PRODUCT_NM" text, 
    "FLOW_NM" text
  ) 
WHERE 
  MS.USE_YN = 'Y' 
  AND MS.DEL_YN = 'N'

		<if test="cond_alarm_type_cd_list != null and cond_alarm_type_cd_list != ''">
			and C.alarm_type_cd in
			<foreach collection="cond_alarm_type_cd_list" item="item" index="index" open="(" separator="," close=")">
				#{item}
			</foreach>
		</if>

-> cond_alarm_type_cd_list =[]이면 아래와 같이 잘못된 query생성됨

        SELECT 
          FPS.PLT_SCHEDULE_ID AS "PLT_SCHEDULE_ID", 
          FPS.PLT_SCHEDULE_NM AS "PLT_SCHEDULE_NM", 
          FPS.PLT_CD AS "PLT_CD", 
          FPS.ROOM_ID AS "ROOM_ID", 
          FPS.DSC AS "DSC", 
          CASE WHEN FPS.ALL_DAY_YN = 'Y' THEN true WHEN FPS.ALL_DAY_YN = 'N' THEN false ELSE NULL END AS "ALL_DAY_YN", 
          FPS.START_DT AS "START_DT", 
          CASE WHEN FPS.ALL_DAY_YN = 'Y' THEN '종일' WHEN FPS.ALL_DAY_YN = 'N' THEN TO_CHAR(FPS.START_DT, 'HH24:mi') ELSE NULL END AS "START_TIME", 
          FPS.END_DT AS "END_DT", 
          FPS.REMARK AS "REMARK" 
        FROM 
          FARM_PLT_SCHEDULE FPS 
        WHERE 
          FPS.USE_YN = 'Y' 
          AND FPS.PLT_CD IN 
          AND FPS.START_DT BETWEEN ? :: timestamp 
          AND ? :: timestamp + interval '1 day'

<if test="apiKeys.size() > 0">

    <choose>
        <when test="ids==null || ids.isEmpty()">
            1 = 0 <!-- a test returning false, to adapt depending on you DB vendor -->
        </when>
        <otherwise>
            id IN <foreach item="id" collection="ids" open="(" separator="," close=")">#{id}</foreach>
        </otherwise>
    </choose>

참고: https://stackoverflow.com/questions/42995592/how-can-i-skip-query-if-where-in-clause-is-empty-in-mybatis-3

• alt + shift + f: 소스자동정렬
• alt + shift + o: remove unused import
• ctrl + g: 특정 행으로
• ctrl + (+)/(-): Zoom in/out
• ctrl + /: commentize

IFNULL 함수

• oracle) nvl
• mysql) IFNULL
• PostgreSQL) COALESCE 함수로 사용

string->integer

• postgreSQL) ::INTEGER

ordering

• alphabetical
• numeric
  • order by REVERSE(SPLIT_PART(REVERSE(RECIPE_PARAMETER_ID), REVERSE('RP'), 1))::INTEGER

JS

remove white space

https://codingbeautydev.com/blog/javascript-remove-all-spaces-from-string/
str.replace(/ /g, '')): To match and remove whitespace characters (spaces, not tabs and not  newlines)
str.replace(/\s/g, ''): To match and remove all whitespace characters (spaces, tabs and newlines)

\s

스페이스, 탭, 폼피드, 불 바꿈 문자등을 포함한 하나의 공백 문자와 매칭됩니다.

([ \f\n\r\t\v​\u00a0\u1680​\u180e\u2000​-\u200a​\u2028\u2029\u202f\u205f​\u3000] 와 동일)

/\sbar/는 "foo bar"의 " bar"에 매칭됩니다.

 \S

공백이 아닌 하나의 문자와 매칭됩니다.

([^ \f\n\r\t\v​\u00a0\u1680​\u180e\u2000​-\u200a​\u2028\u2029\u202f\u205f​\u3000] 와 동일)

/\S+/는 "foo bar"의 "foo"에 매칭됩니다. (가장 먼저 오는 공백아닌 문자열)

/g 전역검색의 의미

g 플래그를 이용하여 매칭되는 모든 문자열을 가져올 수 있습니다. 만약 g 플래그를 사용하지 않는다면 처음으로 매칭되는 값만을 가져오게 됩니다.

출처: https://beomy.tistory.com/21 [beomy:티스토리]

예제)

• 핸드폰번호 정규식 var regExp = /^\d{3}-\d{3,4}-\d{4}$/;
• 일반 전화번호 정규식 var regExp = /^\d{2,3}-\d{3,4}-\d{4}$/;
• 비밀번호 정규식
• 특수문자 / 문자 / 숫자 포함 형태의 8~15자리 이내의 암호 정규식
  • var regex = /^.*(?=^.{8,15}$)(?=.*\d)(?=.*[a-zA-Z])(?=.*[!@#$%^&+=]).*$/;
• 숫자와 문자 포함 형태의 6~12자리 이내의 암호 정규식
  • var regex = /^[A-Za-z0-9]{6,12}$/;
• 이메일 var regExp = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$/i;

- / / 안에 있는 내용은 정규표현식 검증에 사용되는 패턴이 이 안에 위치함
- / /i 정규표현식에 사용된 패턴이 대소문자를 구분하지 않도록 i를 사용함
- ^ 표시는 처음시작하는 부분부터 일치한다는 표시임
- [0-9a-zA-Z] 하나의 문자가 []안에 위치한 규칙을 따른다는 것으로 숫자와 알파벳 소문지 대문자인 경우를 뜻 함
- * 이 기호는 0또는 그 이상의 문자가 연속될 수 있음을 말함

문제현상)

• vsCode > fetch시 다음에러 발생 This repository has no remotes configured to fetch from.
• vsCode > 다시불러오기 아이콘 클릭시 No remotes found in the git config file.
• vsCode > 마우스오른쪽버튼눌러 gitHistory 보기 클릭시

backend는 성공 -  vscode > git history

근데 왜 frontend는 실패? vscode > git history (branch가 main으로 잡히는 것이 문제인듯)

vsCode에서뿐 아니라 gitBash에서도 frontend소스만 자동으로 main이라는 브랜치로 잡힘

https://git.cj.net/에서 branch 확인시

main이라는 브랜치가 있기는 한데, 유휴상태인듯

• Active branches: develop
• Stale branches: main (3개월간 작업이 없는 브랜치)

참고로 stale brach삭제하려면

git remote prune origin

문제해결)

숨김폴더 보기해서 .git상태 확인해보니 

•  factoryone-farmos: .git 있음 
  • factoryOne-FARMOS(backend): .git없음
  • farmos-web-app(frontend)  .git있음 -> 없앴더니 해결됨