👩🏻‍💻 Dev

개념 유닉스 타임스탬프(UNIX timestamp)는 1970년 1월 1일 00:00:00 UTC부터 시작하여 경과한 초 수를 나타낸다. UNIX time (= Epoch time, POSIX time)은 UNIX 운영체제를 개발한 벨 연구소에서 정의한 개념인데, UNIX 운영체제의 최초 출시년도가 1971년이어서 근방에 시간을 임의로 잡은 것이다. UNIX time을 취급하는 쿼리에서는 UTC 기준이라는 것을 유의해야한다. 예시 ISO8601 2023-12-15T07:38:37Z 2023-12-15T16:38:37+09:00 위의 시간을 아래의 Unix Time Stamp로 변환하여 저장할 수 있다. Unix Time Stamp 초 단위: 1702625917 밀리초 단위: 1702625917863 도..

ISO 8601은 날짜와 시간을 표현하는 국제적인 표준이다. 이 표준은 전 세계적으로 통용되며, 데이터 교환, 소프트웨어 개발, 국제적인 커뮤니케이션 등 다양한 분야에서 사용된다. 기본 형태 가장 많이 쓰이는 기본적인 형태는 다음과 같다. 2023-12-17T09:00:00+09:00" 2023-12-17: 날짜 T09:00:00: 'T'는 시간이 시작됨을 나타내며, 09:00:00은 오전 9시를 의미. +09:00: 이 부분은 해당 시간이 UTC(협정 세계시)보다 9시간 앞서는 시간대임을 나타낸다. 이 경우, 이 시간은 한국 표준시(KST)나 일본 표준시(JST)와 같은 시간대에 해당합니다. 즉, 이 시간은 UTC 시간으로 변환하면 2023년 12월 17일 00:00:00(자정)이 된다. UTC(협정세..

Context란? : Props Drilling의 대안 Context는 컴포넌트에서 Props를 사용하지 않고 필요한 데이터를 넘겨주는 방식이다. 특정 데이터를 컴포넌트 트리 전체에 걸쳐 쉽게 공유할 수 있게 해준다. Context는 Props Drilling 문제를 해결해 줄 수 있다. Props Drilling : 중첩된 여러 계층의 컴포넌트에게 props 전달. 문제점: 특정 prop을 사용하지 않는 컴포넌트들에게도 해당 prop을 내려주어야 하는 비효율. 가독성 하락. 컴포넌트 결합도 상승으로 불필요한 리렌더링 발생 가능, 코드의 복잡도 증가 context는 리액트 버전 16부터 사용 가능한 리액트 내장 API로, 어떤 리액트 프로젝트라도 리액트를 import 하면 context를 바로 생성하고 ..

React에서 컴포넌트의 생명주기는 크게 세 단계로 구분된다. : 마운팅(Mounting), 업데이트(Updating), 그리고 언마운팅(Unmounting) 각 단계는 컴포넌트의 생성, 업데이트 및 파괴 과정에 해당한다. 1. 마운팅(Mounting) 이 단계는 컴포넌트가 처음으로 생성되어 DOM에 삽입되는 과정이다. 마운트 과정에서는 처음으로 render 메서드가 호출되어 컴포넌트가 화면에 렌더링 된다. 다음과 같은 생명주기 메서드가 마운팅 단계에서 호출된다. (자주 사용되는 생명주기 메서드는 볼드체) constructor(): 컴포넌트의 생성자. 컴포넌트의 초기 상태를 설정한다. static getDerivedStateFromProps(): 컴포넌트가 마운트 되기 전에 호출된다. props에 의해 ..

useMemo 사용 목적 useMemo는 React에서 제공하는 훅(Hook) 중 하나로, 주로 두 가지 목적으로 사용된다. 계산 비용이 높은 연산의 결과를 저장하고 재사용하기 위해 - 만약 컴포넌트가 계산 비용이 많이 드는 연산을 수행하고, 그 결과를 여러 번 재사용해야 한다면 useMemo를 사용하여 해당 결과를 저장하고 필요할 때 재사용할 수 있다. 참조 동일성(Reference Equality)을 유지하기 위해 - React에서 객체나 배열과 같은 복잡한 데이터 타입을 props로 넘길 때, 이 데이터가 매번 새로 생성되면 자식 컴포넌트가 불필요하게 재렌더링될 수 있다. useMemo를 사용하여 이러한 객체나 배열을 저장하면, 컴포넌트의 리렌더링이 발생해도 동일한 참조의 데이터를 유지할 수 있다...

API 네이밍을 하다가 고민이 생겼다.[PUT] /urls/{id}/move과 [PUT] /urls/move/{id} 중 어떤 게 더 나은지 말이다.이를 위해 구글링을 하다가, REST API URI를 디자인하는 규칙 혹은 컨벤션이 존재한다는 것을 알게 되었다.  REST API와 URIREST API는 Representational State Transfer (표현 상태 전송)의 약자이며, 웹 기반의 시스템 간 통신을 위한 아키텍처 스타일이다. 이 방식은 자원(Resource)의 상태를 HTTP 메소드(GET, POST, PUT, DELETE 등)를 사용하여 전송하는 방식으로 구현된다. 각 자원은 특정한 URI(Uniform Resource Identifier, 통일된 자원 식별자)에 의해 식별된다.U..

배포된 페이지에 대해, 새로고침 시 특정 페이지 (페이지 A로 지칭) 로 이동되는 이슈가 발생했다. 프론트를 로컬에서 실행했을 때는 새로고침해도 페이지가 유지되고 있었고 .. 프론트 코드에서 페이지 A로 라우팅 되는 모든 코드들을 살펴보았지만 원인을 찾을 수 없었다. (location.href, router.replace 등등 ...) 네트워크 속도를 천천히 하고 네트워크 탭에서 요청들을 살펴보다 다른 페이지에서 새로고침을 실행했을 때 페이지 A로 이동하기 전에 '로그인' 페이지를 아주 빠르게 거쳤다가 페이지 A로 이동한다는 것을 발견하게 되었다. 해당 프로젝트는 next.js를 사용하는 프로젝트이고, pages 바로 아래 있는 index.tsx가 로그인페이지이며 처음 접속되는 페이지였다. 이를 발견하고..

application.properties 스프링 프레임워크에서 application.properties 파일은 애플리케이션 구성 설정을 정의하는 데 사용된다. 이 파일에는 애플리케이션 실행에 필요한 환경별 설정, 외부 서비스 연결 정보, 다양한 커스텀 설정 값 등이 포함될 수 있다. 주요 역할은 다음과 같다: 데이터베이스 설정: 데이터베이스 연결 정보, 사용자 이름, 비밀번호 등 데이터베이스 관련 설정을 지정한다. 서버 구성: 서버 포트, 콘텍스트 경로, 세션 타임아웃 등 서버 관련 설정을 정의한다. 로깅 설정: 로그 수준, 로그 파일 경로와 같은 로깅 설정을 관리한다. 애플리케이션 매개변수: 애플리케이션 내부에서 사용할 매개변수를 정의하여 코드에서 참조할 수 있게 한다. 스프링 부트 자동 구성: 스프링..

vscode으로 spring을 사용할 때, 터미널에서 출력되는 로그 메시지에 색상이 없어 가독성이 너무 떨어져 세팅방법을 알아보았다. (스프링 개발을 할 때 인텔리제이를 쓰시는 분들이 많은줄로 알지만 라이선스 문제로 vscode를 사용하는 경우도 있는 걸로 알고 있다. 인턴을 진행중인 회사에서도 vscode 개발환경을 사용하시고 이에 따른 extension으로 세팅하는 걸 권유하셔서 vscode를 사용중이다.) settings.json으로 안 될 때 블로그 포스팅을 보고 위와 같이 시도해보았지만, background, foreground 관련 색상만 적용되고 INFO, WARN, ERROR 등의 색상에는 적용되지 않았다. (참고로 자바스크립트 사용 중지를 하면 드래그 불가능한 곳에서도 코드 드래그가 가..

특정 부분에서 수정 (PUT) 요청을 할 시 500 에러가 뜬다는 이슈가 있었다. 이슈를 재현하고 로그를 확인하니 WARN NullPointerException ~~ 이렇게 떠있었다. 1. 발생하는 부분을 try catch로 묶어서 NullPointerException 시 로그를 띄워주었다. 로그 메시지는 아래와 같았다.20231114 10:45:48.808 [http-nio-8090-exec-9] ERROR c.i.l.a.f.s.FileComponentUrlServiceImpl - NullPointerException caught: java.lang.NullPointerException: null at com.api.filecomponenturl.service.FileComponentUrlService..