성장기록지

적용 계기다음과 같은 배너를 Custom View로 구현하고자 하였다. (현재는 배너 이미지로 대체하였다. 이유는 아래 서술)모델 이미지의 오른쪽 아래를 보면 배너와 같이 라운딩 처리가 되어있는것을 확인하였다.디자인의 요구사항과 똑같이 라운딩 처리를 해주고자 하였다.적용 과정먼저 이미지뷰에 라운딩 처리를 하는 법을 찾기 위해 구글을 검색하였다.사진과 같이 나오는 래퍼런스들은 많지만, 다 만족스럽지 않았다.clipToOutline을 통해 코드에서 동적으로 할당하거나,CardView를 활용하거나 하여 여러모로 불편한 조건들이었다.그러던 중, 부스트캠프 동료에게서 ShapeableImageView를 사용해보라는 말을 들었다!  ShapeableImageView 적용하는 법은 간단하다.ImageView를 Sha..

data binding기존에 viewBinding을 포함한 기술에선UI 컴포넌트는 Activity나 Fragment에서 코드를 통해 속성을 설정해왔지만,data binding을 활용한다면 xml파일 내에서 view에 할당할 데이터를 선언할 수 있고,데이터가 변경되면 view도 갱신되게 된다. 즉 Layout의 Ui 컴포넌트를 데이터에 binding 할 수 있도록 지원하는 라이브러리이다.data binding의 특징뷰바인딩은 데이터를 뷰(ui)로만 전달이 가능하지만,데이터 바인딩을 사용한다면 양방향으로 데이터를 결합시킬 수 있다.레이아웃에서는 주어진 데이터로 UI를 출력하기에, 데이터만 관리하면 되니 역할분리도 제대로 되어진다!이러한 장점을 통해 MVVM 패턴을 적용할 때 사용되어진다. 그렇다면 view ..

컴포저블 내부에서 호이스팅그림과 같은 예시를 보자.전체 화면을 ConverSationScreen이라고 하고, 메시지가 보이는 목록들이 MessagesList,Jump to Bottom이라고 작성되어있는 버튼을 Button,Hi there! 이라고 적혀있는 입력창은 userInput을 의미한다. 그렇다면 요구사항은 다음과 같을 것이다."Jump to bottom을 누르면 MessagesList 가장 아래로 가게 해줘""새로운 메시지를 send해도 가장 아래로 가게 해줘" 그렇다면 계층구조는 어떻게 되어있을까? 그림과 같이 연결되어 있을 것이다. 여기서 우리는 State hoisting을 이용해 재사용성을 높이고 싶다는 생각이 들 것이다.그렇다면 어느 State를 어디까지 호이스팅 해야할까? 공식문서에서 아..

State hoisting?Hoisting은 번역하자면 "끌어올림"이라는 뜻이다.그럼 상태를 끌어올린다는 뜻인데, 상태는 무엇인지, 어떻게 끌어올린다는건지 감이 안 올 수 있을것이다. 그럼 우선 상태에 대해 알아보고 가자. State란?상태를 이해하기 위해선 다음 예시코드를 읽어보자.앱을 실행시킨 후, 이 코드의 텍스트필드에 타이핑을 한다면 어떻게 될까?정답은 아무 일도 일어나지 않는다. 텍스트필드에는 아무런 텍스트가 표시되지 않는다.@Composableprivate fun HelloContent() { Column(modifier = Modifier.padding(16.dp)) { Text( text = "Hello!", modifier = Mo..

이전에 Data Class를 학습하며 ComponentN() 함수를 다뤘다.간단하게 알아봤던 구조분해를 조금 더 자세히 알아보고자 한다.디스트럭쳐링(Destructuring)객체가 가지고 있는 여러 값을 분해해서 여러 변수에 한꺼번에 초기화할 수 있다.data class Person(val name: String, val age: Int)fun main() { val person = Person("Hoon", 28) // 구조 분해 val (name, age) = person println("Name: $name, Age: $age")}위의 Data Class의 예시처럼 여러 변수를 괄호를 묶게 되면 내부에서는 각 변수를 초기화하기 위해 componentN이라는 함수를 호출하게 된다..

부스트캠프를 통하여 Compose 프로젝트를 진행하였지만, 제대로 된 xml 프로젝트 경험이 없기에, 새로운 프로젝트를 하나 해보기로 결정하였다.쇼핑앱 프로젝트를 진행하려고 마음먹었고, 개인 프로젝트지만 디테일하게 만들어야 한다 생각하여디자인도 볼만하게 만들고, 목업 데이터도 괜찮은 것을 사용하자고 생각하였다. 디자인 선정 과정 - 크몽우선 작성자는 디자인을 엄청 못한다.따라서 디자인 키트를 구매하기로 생각하였다.우선 스마트스토어 할 때 많이 쓰던 크몽을 둘러보았다,하지만 커스텀 UI 이다보니 기본 가격부터 만만치 않았다.아래 첨부 사진처럼 2페이지에 10만원은 가볍게 넘는 경우가 많았다...디자인 선정 과정 - Figma Ui Kit취준생에게는 상당히 부담이 되는 가격이였기에 다른 방법을 찾아보기로 결..

Sealed class의 기능적 특징sealed 클래스는 자기 자신이 추상 클래스이고, 자신을 상속받는 여러 서브 클래스들을 가질 수 있다.enum 클래스와 달리 상속을 지원하기 때문에, 상속을 활용한 풍부한 동작을 구현할 수 있다.제일 중요한 것은, 자신을 상속받는 서브 클래스의 종류를 제한할 수 있다.어떻게 자신을 상속받는 서브클래스를 제한할 수 있을까? 우선, sealed 클래스의 서브 클래스들은 반드시 같은 패키지 내에 선언되어야 한다.(sealed 클래스의 서브 클래스를 상속한 클래스들은 같은 패키지 내에 없어도 된다.)또한 sealed 클래스는 기본적으로 abstract 클래스이고,sealed 클래스는 private 생성자만 갖게 되기 때문이다.Sealed class의 등장 배경그렇다면 왜 s..

개인 프로젝트 기획mock api 등을 이용한 쇼핑몰 프로젝트로 부스트캠프에서 습득한 이론적 지식을 실무에 가까운 환경에서 적용하고, 새로운 기술적 도전을 통해 안드로이드 개발 역량을 한층 더 성장시키고자 한다. 단순 기능 구현을 넘어 성능 최적화, 사용자 경험 개선과 같은 종합적인 개발 역량을 키우는 것이 목표이다.키워드 검색디바운스를 통한 API 호출 최소화사용자가 검색어를 입력할 때마다 API를 호출하면 불필요한 네트워크 트래픽이 발생한다. Kotlin Flow와 debounce 연산자를 활용하여 입력이 일정 시간 동안 없을 때만 실제 API 호출이 이루어지도록 구현하여  효율적인 API 통신을 구성한다. 검색 결과를 리사이클러뷰로 노출DiffUtil을 활용하여 데이터 변경 시 효율적으로 UI를 업..

프로젝트 진행할 때 적용하였던 클린아키텍쳐를 설명하기 위해선먼저 안드로이드 권장 아키텍쳐를 설명하는것이 좋다고 생각하여서정리하는 글을 작성해보고자 한다.  일반적인 아키텍처 원칙앱 아키텍처는 앱의 부분과 그 각 부분에 필요한 기능 간의 경계를 정의하는 것이다. 따라서 몇가지 특정 원칙을 준수하여야 한다.1. 관심사 분리Activity,Fragment와 같은 UI 기반 클래스에는 UI 및 운영 체제 상호 작용을 처리하는 로직만 포함하여야 하는 것처럼각자의 관심사에 맞게 책임을 가진 코드를 분리하여야 함을 의미한다.Activity와 Fragment는 OS와 애플리케이션을 이어주는 클래스이므로, 메모리부족과 같은 경우에 프로세스 킬이 일어날 수 있다. 따라서 관심사 분리 없이 해당 컴포넌트에 모든 코드를 넣게..

네트워크 프로토콜이란?네트워크 통신을 하기 위해서 통신에 참여하는 주체들이 따라야하는 형식, 절차, 규약이다.프로토콜은 기능에 따라 여러 계층으로 분리가 돼서 동작을 한다. 네트워크 계층구조 대표적으로 OSI model (7 layer) , TCP/IP stack(4 layer) 가 있다.OSI model은 범용적인 네트워크 구조이고, TCP/IP stack은 인터넷에 특화된 네트워크 구조이다. OSI 7 LAYER아래 그림과 같이 7계층이 있다.아래에서부터 L1~L7이다.각 레이어에 맞게 프로토콜이 세분화되어 구현되어있다.각 레이어의 프로토콜은 하위 레이어의 프로토콜이 제공하는 기능을 사용하여 동작한다.Application Layer애플리케이션 목적에 맞는 통신 방법을 제공해준다.대표적 프로토콜로는 H..