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 안녕하세요. 이번 시간에는 파이썬의 None 키워드에 대해 알아보도록 하겠습니다. 기존 파이썬으로 되어 있는 API 소스 코드를 분석 중, 쿼리 조회시 None이라는 키워드를 사용하는 것을 발견했습니다. Null 이랑은 다른 개념인가 싶어 구글링을 해보았습니다. None 변수에 None 키워드를 사용하면, 해당 변수에는 아무 값이 없는 것을 의미한다고 합니다. 저희가 익히 알고 있는 Null과 같은 개념입니다. 다만 파이썬에서는 None 이라는 데이터 타입으로의 객체로 존재합니다. None Characteristic bool 평가 시 false 반환 빈 문자열, 0, False 와 다름 None 그 자체의 데이터 타입을 지님 None 만이 only None이 될 수 있음 Example vari..

Intro 안녕하세요. Html Input 태그를 사용하던 도중 아래와 같은 에러가 발생하였습니다 . Password field is not contained in a form Why? 구글링을 해보니, Input 태그가 From 태그 안에 위치하지 않아 생기는 문제였습니다. 사실 경고(warning) 표시라서 코드 수정을 해주지 않아도 문제가 되지 않지만, 콘솔창에 계속 warning 표시가 되어있는 것이 마음에 걸리기 때문에 수정을 해보도록 합시다! 🙃 How to solve the problem 아래와 같이 Html 코드를 수정하면 더이상 다음의 오류는 발생하지 않습니다. Conclusion Html은 쉬우면서도 어렵고, 어려우면서도 쉬운 존재인 것 같습니다.😇

Intro 안녕하세요. 이번 시간에는 JavaScript 에서 Object array 를 정렬하는 방법에 대해 알아보겠습니다. How to do 아래의 오브젝트 어레이가 있다고 가정해봅시다. const objectArray = [ { name: 'aa', year: 2008 }, { name: 'bb', year: 2004 }, { name: 'cc', year: 2003 }, { name: 'dd', year: 1996 }, { name: 'ee', year: 1995 }, { name: 'ff', year: 2015 } ]; javascript의 sort() 메서드를 통해서 year 필드 기준으로 오름차순 정렬을 해보겠습니다. objectArray.sort((x, y) => x.year - y.yea..

Intro 안녕하세요. 이번 시간에는 코틀린에서 내림차순으로 정렬하는 방법에 대해 알아보겠습니다. How to do 코틀린 내장 함수인 sortedByDescending 를 사용하면 되는데요, 내림차순에 사용하고자 하는 특정 필드 값을 넣어주면 됩니다. result.sortedByDescending { it.date } https://kotlinlang.org/api/latest/jvm/stdlib/kotlin.collections/sorted-by-descending.html

Intro 안녕하세요. 이번 시간에는 코틀린 문자열 (string)의 특정 인덱스 문자 바꾸는 방법에 대해 알아보겠습니다. How to do 인덱스 문자 바꾸는 많은 방법이 있겠지만, 저는 substring() 메서드를 사용하여 진행해보겠습니다. 아래와 같이 "20230116"이라는 문자열이 있다고 가정해봅시다. 여기서 인덱스 4 위치에 "12"로 바꾸기 위해 아래와 같이 구현하였습니다. substring() 함수를 사용하여 교체할 문자를 분리하고, + 연산자를 통해 나머지 문자열을 더해줍니다. println()을 통해 나온 결과는 "20231216" 입니다. "01"이 "12"로 잘 바뀌어 동작하고 있네요 :) fun main() { var string = "20230116" val char = "12..

Intro 안녕하세요. 이번 시간에는 코틀린에서 mutableList 를 수정 및 삭제하는 방법에 대해 알아보겠습니다. MutableList 코틀린에서 수정 및 삭제 등과 같은 작업을 하기 위해서는 List가 아닌, mutableList로 선언해줘야 합니다. 기본적으로 val, var 변수를 제공하고 있는데요, val는 읽기만 가능하고, var은 읽기 및 수정이 가능합니다. How to do 아래 코드와 같이 수정 혹은 삭제가 가능합니다. 수정하고 싶을 경우, 해당 인덱스에 새로운 값을 넣어주면 되고, 삭제를 하고 싶을 경우 removeAt() 메소드를 활용하여 삭제하고자 하는 인덱스 번호를 넣어줍니다. fun main() { val list: MutableList = mutableListOf() lis..

Intro 안녕하세요. 이번 시간에는 코틀린에서 시작일부터 종료일까지 하루씩 증가시키는 방법에 대해 알아보겠습니다. How to do datesUntil() 메서드와, plusDays() 메서드를 활용하여 시작일부터 종료일까지 1씩 증가시켜줍니다. /** * You can edit, run, and share this code. * play.kotlinlang.org */ import java.time.LocalDate; fun main() { LocalDate.of(2023, 1, 14) .datesUntil(LocalDate.of(2023, 1, 19).plusDays(1)) .forEach { it -> println(it) } } 코드 실행 결과는 아래와 같습니다. 2023-01-14 2023-0..