Dev Diary 💻

Intro 안녕하세요. 이번 시간에는 DOM 접근을 통해 CSS Module의 classname을 가져오는 방법에 대해 알아보겠습니다 . How to solve the problem 저는 next.js 에서 특정 className 을 가져와서 제거해줘야 했습니다. CSS Module을 사용했기 때문에 파일 컴포넌트마다 아래의 형식으로 styles을 가져와서 스타일을 적용해줬습니다. import styles from './styles.module.css' 참고로 css module 내부 프로세스는 css 클래스나 css 파일을 통해 그 클래스의 이름을 고유하게 바꿔주는 역할을 합니다. 따라서 import하는 모든 css 파일을 고유하게 만들어 줍니다. 더 자세한 내용이 궁금하신 분들은 이 글 [React ..

Intro ptyhon API Server 사용 중 아래와 같은 에러가 발생했습니다. Error: That port is already in use. Why? 1. 이미 띄어놓은 서버가 종료되지 않아서 같은 포트에 띄어 놓을 수 없을 때 해당 에러가 발생합니다. 2. 동일한 포트로 다른 서비스가 사용 중일 때 해당 에러가 발생합니다. How to solve the problem 저의 경우 1번 케이스였기 때문에 사용 중이였던 8000 포트와 관련된 모든 프로세스를 종료하고 다시 실행시켜주었습니다. 아래 명령어를 이용하시면 해당 에러를 해결할 수 있습니다 :) sudo lsof -t -i tcp:8000 | xargs kill -9

Intro 안녕하세요. 이번 시간에는 코틀린에서 현재 날짜 DateTime 에서 시간 추가하는 법에 대해 알아보겠습니다. How to implement 우선 LocalDateTime 을 통해 현재 날짜 및 시간을 구합니다. 그 이후 plusHours 메소드를 통해 원하는 값만큼 시간을 더해주면 됩니다. import java.time.LocalDate import java.time.LocalDateTime fun main(args: Array) { val todayDateTime: LocalDateTime = LocalDateTime.now() println("Current date and time: $todayDateTime") println("Add 9 Hour date and time: ${today..

Intro 안녕하세요. 드디어 저도 구글 애드센스를 승인받았습니다 :-) 저는 티스토리 플랫폼을 이용하여 구글 애드센스를 신청했고, 3번의 시도 후 승인을 받을 수 있었습니다. Process 우선 제 블로그는 개발 관련된 정보를 담은 블로그입니다. 수익형 블로그로도 키우고 싶고, 동시에 그날 배웠던 IT 개발 정보들을 정리하고 싶은 마음에 티스토리 블로그를 시작했어요. 사실 개발 블로그로 다른 플랫폼을 오랫동안 사용해 왔는데요, 수익을 발생시킬 수 없는 플랫폼이어서 참 아쉽더라고요. 이미 써놓은 포스팅글이 아깝긴 했지만, 새로 티스토리 블로그를 시작해 보기로 결정했습니다. 2022년 8월 처음 티스토리 블로그를 개설했고, 2022년 10월까지는 포스팅을 열심히 하진 않았습니다. 11월부터 1일 1 포스팅..

Intro 안녕하세요. 이번시간에는 스프링 JPA에서 pageSize 페이지 사이즈를 최대값으로 지정하는 방법에 대해 알아보겠습니다. How to set to maxSize @PageableDefault 어노테이션을 활용하여, size를 Integer.MAX_VALUE로 설정하면 됩니다. size를 확인해보면, 2000으로 설정된 것을 볼 수 있습니다. public SomeResponseObject getSomething( @PageableDefault(size = Integer.MAX_VALUE) Pageable page ) { return someService.getSomething(page); } https://stackoverflow.com/questions/23751193/spring-data-..

Intro 안녕하세요. 이번 시간에는 스프링부트의 Pageable 페이지네이션 객체에 대해 알아보도록 하겠습니다. 제 경우 Task를 진행하던 도중 페이지네이션을 추가해야 하는 요구사항이 들어옸습니다. 페이지네이션을 구현하는 방법은 여러가지가 있는데요, 그중에서도 저는 Spring Data JPA를 이용했습니다. Spring Data JPA를 이용하면 Pageable 객체를 사용하여 페이지네이션(pagination) 정보를 쉽게 관리할 수 있기 때문입니다. JPA Query 메서드의 파라미터로 Pageable을 넘겨서 DB에 쿼리를 날릴 수 있습니다. 즉, 알아서 잘 해주기 때문에 매우 편하게 사용이 가능합니다 :-) Pageable Pageable는 Pagination 요청 정보들을 담기 위한 추상 인..

Intro 안녕하세요. 이번 시간에는 스프링부트 + 몽고(mongo)에서 OR 쿼리 query 사용하는 방법에 대해 알아보겠습니다. How to do Criteria API를 사용하여 아래와 같이 사용하면 됩니다. Criteria criteria = new Criteria(); criteria.orOperator(Criteria.where("A").is(10),Criteria.where("B").is(20)); Query query = new Query(criteria); mongoOps.find(query, .class, "collectionName"); +) 참고로 Criteria 은 기준값이라는 의미힙니다. find 메소드 안에서 { age: { $gt: 18 } } 와 같은 조건문을 입력하는 부분..

Intro 안녕하세요. 이번시간에는 MongoDB 몽고디비에서 게시글 읽음(read)/안읽음(unread) 표시상태를 처리하는 방법에 대해 알아보도록 하겠습니다. How to do 우선 제 상황의 경우 공지사항 Collection(게시글 Collection라고 봐도 무방), 그리고 사용자 Collection이 존재합니다. User user collection은 다음과 같습니다. _id, userId, userName 필드를 갖고 있습니다. { _id: user_uniqueId, userId: senderId, userName: userName } Notice notice collection은 다음과 같습니다. _id, noticeId, title, contents 필드를 갖고 있습니다. { _id: us..

Intro 안녕하세요. 이번 시간에는 React에서 기존 데이터에서 더보기 버튼 클릭 후 새로 불러온 데이터 합치는 방법에 대해 알아보겠습니다. 공지사항 목록 조회 기능을 구현하던 도중 리스트가 많아질 수 있을 것 같아 더보기 버튼 UI를 추가하기로 결정했습니다. 참고로 API는 스프링부트의 Pageable 를 사용했습니다. 즉 기존 데이터에서 더보기 버튼 UI를 클릭할 때마다 page 가 +1 씩 증가하면서 새로 불러온 데이터를 화면에 보여줘야 했습니다. How to implement 아래와 같이 NoticeList 컴포넌트가 있다고 가정해봅시다. fetchNotice라는 함수를 불러올 때마다, 기존 데이터에 새로 불려진 데이터를 추가해줘야 합니다. 하지만 위 코드에서는 새로 불려진 데이터만을 setN..

Intro 안녕하세요. 이번 시간에는 Springboot 스프링부트 JPA에서 프로젝션 하는 방법에 대해 알아보겠습니다. Projection? 먼저 들어가기에 앞서 간단하게 프로젝션에 대한 의미를 살펴볼게요. 프로젝션은 엔티티의 속성이 많을 때 일부 데이터만 가져오는 방법을 의미합니다. 더 자세한 내용이 궁금하시면 일전에 제가 정리해놓은 포스팅 참고 바랍니다 :) [MongoDB] 프로젝션 (Projection) 이란? projection query 사용법 How to do 아래의 User domain 객체를 참고하여 설명해보겠습니다. @Document(collection = "user") class User( val userId: String?, val userName: String?, val user..