분류 전체보기
러스트 (Rust) 열거형 3 - if-let 키워드
if-let 을 이용한 열거형 흐름 제어 let some_u8_value = Some(0u8); if let Some(3) = some_u8_value { println!("three"); } 어떤 값이 3일 때만 실행되는 if let 구문 let some_u8_value = Some(0u8); match some_u8_value { Some(3) => println!("three"), _ => (), } 어떤 값이 3일 때만 실행되는 match 구문 생각해볼 점 열거형의 variants 의 케이스별로 로직을 나누는 것이 아닌, 특정 경우에만 수행될 로직을 작성하고 나머지 로직에서는 별다른 처리가 일어나지 않길 원한다면 if let 이 더 명확한 의도를 갖는 코드이다. 다만, if let 을 사용하면 m..
러스트 (Rust) 열거형 2 - match 키워드
match 흐름 제어 연산자 match 는 패턴을 이용해 패턴에 매칭된 경우, 실행될 코드를 작성할 수 있게 해준다. 동전 분류기에서 동전을 작은 구멍부터 넣어보아 크기에 알맞은 구멍으로 쏙 들어가게 하는 것과 같다. 여기서 좋은 점은 놓치는 variant 가 없다는 것이다. 예제 1: variants 별로 처리하기 enum Coin { Penny, Nickel, Dime, Quarter, } fn value_in_cents(coin: Coin) -> u32 { match coin { Coin::Penny => { println!("Lucky penny!"); 1 }, Coin::Nickel => 5, Coin::Dime => 10, Coin::Quarter => 25, } } variants 하나마다 ..
러스트 (Rust) 열거형 1 - 기본 문법
열거형 (enumerations, enums) 이란? 하나의 타입이 가질 수 있는 값의 경우의 수가 제한적일 때 사용할 수 있다. ex) 손가락이라는 타입은 일반적으로 '엄지', '검지', '중지', '약지', '새끼' 중에 하나이다. 러스트에는 Option, match, if let 과 같은 키워드를 통해 열거형을 효과적으로 표현할 수 있다. 열거형은 많은 언어에 존재하지만, 각 언어마다 열거형으로 할 수 있는 것들이 다르다. 러스트의 열거형은 F#, OCaml, Haskell 과 같은 함수형 언어의 대수 데이터 타입과 비슷하다. 열거형이 적절한 경우 variants 라 불리는 한정적 경우의 수 중 하나만 될 수 있을 때 적절하다...
자바에서 코틀린으로 5장 - 빈에서 값으로 요약
자바 빈 최초에는 GUI 개발을 지원하기 위해 태어났다. GUI 에서의 많은 프로퍼티 (패딩, 높이, 너비 등) 를 적절하게 컨트롤하기 위해 Getter 와 Setter 가 기본으로 장착됐다. 이 당시엔 UI 툴킷과 일반 객체 모두 가변 컴포넌트 모델이 옳다는 사고관을 가지고 있었다. 근래엔 객체로 표현하고 싶은 대부분의 대상에는 '자바빈즈' 보다는 '값(불변)' 이 더 낫다고 여겨진다. 자바에서의 가변 객체들은 최근 복잡도를 높이는 문제가 되어가고 있다. 값 혹은 불변을 선호해야 하는 이유 가변 객체보다 추론이 쉽다. 맵의 키, 집합 원소로 활용 가능하다. (의미론적 동치 판단이 쉽다.) 컬렉션으로 사용하는 경우, 원소가 달라질지 염려할 필요가 없다. 초기 상태를 복사하지 않고도 다양한 시나리오를 탐험..
자바에서 코틀린으로 4장 - 옵셔널에서 널이 될 수 있는 타입으로 요약
Null 의 표현 방식 기존 자바 ...OrNull 이라는 네이밍 사용 @Nullable, @NotNullable 애노테이션 사용 자바 8 Optional 등장 코틀린의 Null 처리 전략 null 을 포용한다. 코틀린에서는 Optional 을 쓰면, Null 가능성을 지원하기 위한 설계를 활용할 수 없다. Optional 과 String? 는 큰 차이가 있음 String? 는 String 의 하위타입이지만, Optional 은 String 의 하위 타입이 아님. Optional 때문에 코드가 번잡해지고, 리팩토링 시에도 고쳐야 할 코드가 많아짐. 코드 보기 리팩토링 전 (자바) public class Legs { public static Optional findLongestLegOver( List le..
자바에서 코틀린으로 3장 - 자바클래스에서 코틀린 클래스로 요약
요약 생성자의 형태가 다르다. 자바 버전 public class EmailAddress { private final String localPart; private final String domain; public EmailAddress(String localPart, String domain) { this.localPart = localPart; this.domain = domain; } public String getLocalPart() { return localPart; } public String getDomain() { return domain; } public static EmailAddress parse(String value) { var atIndex = value.lastIndexOf('@..
CSS 접기 펴기 애니메이션 만드는 방법 (height: auto 일 때 문제 해결)
접기, 펴기 애니메이션 만드는 방법 CSS transition 을 이용하여 애니메이션 효과를 입힌다. JS 를 이용해 height 값을 동적으로 조정해준다. div { transition: 3s; height: 500px; /* -> 50px 와 같이 변경하면 애니메이션이 적용된다. */ } 그런데 위의 방법의 경우, height 값이 auto 일 때 애니메이션이 적용되지 않는 문제가 생긴다. 해당 엘리먼트에 들어올 값이 유동적이어서 height 값이 auto 여야 하는 경우엔 max-height 을 이용해줌으로써 애니메이션을 적용할 수 있다. 주의! height 쓰지 말고 오직 max-height 만을 이용해서 크기를 제어해야 애니메이션이 먹힌다. 레퍼런스 https://stackoverflow.com..
CSS Box-sizing (박스 사이징) 이란?
Box-Sizing 이란? box-sizing 은 width 와 height 이 계산되는 방식을 지정한다. box-sizing: content-box 의 의미 box-sizing: content-box 인 상태에서 width:100% 를 지정한다면, 이는 부모 엘리먼트의 border 와 안쪽 너비를 포함한 공간을 의미한다. 부모 엘리먼트의 경계선과 안쪽 여백에 대한 고려를 하지 않는 방식이다. 이 때문에, 아래에 추가적으로 설정된 10px 는 부모 엘리먼트를 뚫고 나온다. #childContainer { box-sizing: content-box; width: 100%; border: solid #5b6dcd 10px; padding: 5px; } box-sizing: border-box 의 의미 이는 ..
리액트 네이티브 Failed to launch emulator 에러 해결하기
증상 npm run android 실행 시에 에뮬레이터는 켜지나 아래와 같은 에러가 뜬다. error failed to luanch emulator. Reason: emulator exited before boot... warn Please launch an emulator manually or connect a device. Otherwise app may fail to launch 원인 에뮬레이터의 Use detected ADB location 설정이 켜져있어서, adb.exe 파일을 제대로 못찾아서 그렇다. 해결 켜진 에뮬레이터에서 ... 아이콘을 클릭하고 Settings 항목에 들어가 Use detected ADB location 을 체크 해제하면 된다.
리액트 네이티브 푸시 알람 보내는 방법
개요 리액트 네이티브에서 푸시 알람을 보내는 방법을 알아보자. 푸시 알람의 종류 푸시 알람의 종류는 2가지가 있다. 로컬 푸시 알람 푸시 서버를 타지 않고, 앱 자체에서 폰으로 보내는 푸시 알람이다. 로컬 알람도 아래에서 설치하게 될 react-native-push-notification 패키지를 통해 보낼 수 있다. 그러므로 로컬 알람과 원격 알람을 따로 설정할 필요 없다. 원격 푸시 알람 푸시 서버를 타고 보내는 푸시 알람이다. 요즘은 FCM (Firebase Cloud Messaging) 이라는 도구를 이용해 푸시 알람을 보내는 것이 일반적이다. 푸시 알람 개발 프로세스 리액트 네이티브에 알맞은 푸시알람 npm 패키지 설치 FCM (Firebase Cloud Messaging) 에서 키 발급 bui..
CSS Functional Notation 이란?
CSS Functional-notation 이란? CSS 값 의 일종으로 특별한 데이터 처리 혹은 계산을 하거나 복잡한 데이터 값을 표현하는데 이용된다. 문법 selector { property: functional-notation([argument]? [, argument]!); } 함수의 종류 애니메이션 타임라인 아직은 scroll() 밖에 존재하지 않는다. 이마저도 Experimental 이다. scroll() 변환 요소의 모양을 변환시키는 함수들이다. matrix() ... 수학 수학적인 계산을 도와준다. calc() 필터 이미지 등에 필터를 걸거나 색상을 변경하는데 유용하다. blur() 색상 다양한 기준을 통해 특정 색상을 잡는데 유용하다. hsl() 이미지 태그가 유효할 때..
CSS @keyframes (키 프레임) 란?
@keyframes 란? CSS At-rules 의 일종이다. 애니메이션의 시퀀스를 정의할 수 있다. transitions 으로 정하는 것보다 더 세부적으로 제어가 가능하다. 예제 from, to 사용 @keyframes slidein { from { transform: translateX(0%); } to { transform: translateX(100%); } } 퍼센티지 사용 @keyframes identifier { 0% { top: 0; left: 0; } 30% { top: 50px; } 68%, 72% { left: 50px; } 100% { top: 100px; left: 100%; } } 주의사항 @keyframes 내부의 !important 키워드는 무시된다.