깃허브 주소 ▼ GitHub - NOGUEN/dilemma_cafe_webContribute to NOGUEN/dilemma_cafe_web development by creating an account on GitHub.github.com 개요이전 포스트 참고 ▼ [React][개발기] 우선 기초적인 것들 부터 학습(HTML, CSS)개요이전 글 참고 ▼ [React][개발기] React! 근데 React를 왜 써?개요 웹을 시작하게 된 이유 기존에 모바일로 개발하던 서비스에 배포 문제가 발생하면서 다 완성을 해도 배포에 시간이 걸리게 됐noguen.com 학습 현황과 방향 이전 포스트에 이어서 기초적인 것들(HTML, CSS, JS) 학습을 마쳤다. 완벽하게 공부한 것은 아니지만 '대략 이렇게 접근하..

깃허브 주소 ▼ GitHub - NOGUEN/dilemma_cafe_webContribute to NOGUEN/dilemma_cafe_web development by creating an account on GitHub.github.com 개요이전 글 참고 ▼ [React][개발기] React! 근데 React를 왜 써?개요 웹을 시작하게 된 이유 기존에 모바일로 개발하던 서비스에 배포 문제가 발생하면서 다 완성을 해도 배포에 시간이 걸리게 됐다. 그래서 그 동안에 배포가 빠르고 모바일 웹, 혹은 데스크noguen.com 본격적으로 앱으로 만들어져있던 기본 서비스를 웹 버전으로 만들려고 했으나, 문제가 있었으니... 바로 필자가 웹 개발을 한 번도 안해봤다는 것이다. 이전 글은 웹 개발을 공부하기 위한..

깃허브 주소 ▼ GitHub - NOGUEN/dilemma_cafe_webContribute to NOGUEN/dilemma_cafe_web development by creating an account on GitHub.github.com  개요 웹을 시작하게 된 이유 기존에 모바일로 개발하던 서비스에 배포 문제가 발생하면서 다 완성을 해도 배포에 시간이 걸리게 됐다. 그래서 그 동안에 배포가 빠르고 모바일 웹, 혹은 데스크톱 웹에서도 쉽게 접근할 수 있게 웹으로 배포하고자 했다. 요즘 세대는 모바일로 접근이 빠르지만, 나를 비롯해 나보다 나이가 조금 있는 윗세대는 아직은 컴퓨터로의 접근이 조금 더 편한것 같았다. 모두가 즐길 수 있는 컨텐츠인데 특정 연령층만 접근이 빠른 것은 서비스의 목적과 맞지 않..

개요Compose로 안드로이드 앱 개발을 할 때 한 가지 불편한 점이 있었다.바로 아래와 같이 앱 모듈 `build.gradle.kts`에 라이브러리를 추가할 때, 버전을 따로 입력해줘야한다는 것이었다. ▼ 매번 버전을 입력해서 추가를 하니까 최신 버전이 나올 때 마다 버전을 입력해줘야하고, 내가 현재 최신버전을 사용하고 있는건지 의문이 들기도 했다.물론 항상 최신버전을 유지하는 것이 좋지 않을 수도 있지만, 웬만하면 이전 버전의 버그가 고쳐진 버전이 배포되기 때문에 특별한 이유나 해당 라이브러리의 세세한 부분까지 알고 있는게 아니라면 최신버전을 사용하는게 좋지 않나 싶다. '자동으로 업데이트가 될 법 한데...' 라는 생각을 하던 도중 Compose BOM이라는 것이 있다길래 이에 대해 알아보게 됐다...

개요안드로이드에서 너무나도 많이 보이는 DI안드로이드 개발 공부를 하다보면 DI라는 용어는 빈번하게 등장한다.소프트웨어 공학에서 나온 용어라서 안드로이드 외의 다른 개발 프레임워크들에서도 많이 사용하기에 엄청나게 생소한 용어는 아니지만, 안드로이드에서는 이를 관리해주는 Hilt라는 라이브러리가 있어 굉장히 많이 거론되는 듯 하다. ▼ StateHoisting을 배우고, State를 Hoisting해줄 ViewModel을 인식하고, ViewModel을 UI의 어느 부분에 저장을 할 지 알아보던 중 DI와 Hilt에 대한 선행 지식이 없으면 안되었기에 더 자세하게 알아보게 되었다.   Dependency InjectionDependency Injection이란Dependency Injection, 줄여서 D..

개요Compose의 Stateless선언형 UI인 Compose의 장점은 Stateless함에 있다.UI와 State의 상호 의존성을 끊을 수 있다면, UI요소를 재사용하여 더 효율적으로 코드를 작성할 수 있다.또한 UI를 개별적으로 테스트 할 수 있어, 유닛 테스트에 용이하다. 요약하자면 Compose Stateless의 장점은 아래의 두 개가 된다.UI 재사용성UI 테스트로 Unit Test 하지만 State와 종속되는 요소도 있다그러나 Stateless를 유지하고 싶지만, State를 UI에 저장을 해야만 할 때가 있다.Compose 요소 자체에 State가 저장되게 설계가 되어 나온 것으로 `TextField`가 있다. 아래와 같은 식으로 `remember` 키워드를 이용하여 상태를 저장해줘야한다..

개요 레이아웃하나의 컴포저블 요소에 다른 요소들이 들어갈 수 있는 것이고, 그렇게 들어간 요소들은 아무런 규칙없이 들어가는 것이 아니라 레이아웃이라는 규칙을 따라 들어가게 된다. 아래의 화면도 아무런 규칙이 없이 배치가 된 것 처럼 보이지만, 레이아웃 규칙에 따라 배치가 된 것이다. ▼  Compose에서 제공하는 레이아웃Compose의 레이아웃으로는 크게 Column, Row, Box의 3가지가 있다. ▼ 각각 모두 이름 그대로의 기능을 하기에 알아보기가 쉽다.셋 다 컴포저블이기에 내부에 컴포저블 요소들을 배치할 수 있다.그러나 다른 컴포저블들과는 다른 점은 여러 개의 컴포저블들을 배치할 수 있다는 것이다.또한 이들 모두 컴포저블이기에 서로가 서로에 중첩되어 들어갈 수 있다. 이번 포스트에서는 이 3가..

개요JetPack Compose란?JetPack Compose는 네이티브 UI를 빌드하기 위한 Android의 최신 권장 도구 키트이다. ▼  JetPack Compose를 사용하는 이유기존의 빈번한 작업 컨텍스트 전환 해결XML 기반의 UI를 개발하려면 XML Layout을 정의한 후, 코드 레벨(Java, Kotlin, Swift)에서 View를 연결하여 UI를 관리한다.XML과 코드 구조를 각각 연동시켜야하기 때문에 빈번한 작업 컨텍스트 전환이 요구된다. JetPack Compose는 이러한 불편함을 해결해 줄 수 있으며, 직관적이고 단순하게 UI를 구현할 수 있게 해준다. 개념 이해와 빠른 개발기본적으로 JetPack Compose를 사용하면 XML과 Kotlin 코드를 따로 작성하지 않고 Kot..

개요 글 순서를 위해 미리 추가 내용은 추후 추가...

제어 흐름Swift는 여러 가지 제어 흐름 구문을 제공한다.while, if, guard, switch, break, continue가 제어 흐름 구문에 해당한다.Swift는 Array, Dictionary, ranges, String 등을 쉽게 다룰 수 있는 for-in 구문도 제공한다.Swift의 switch 구문은 C언어의 것보다 더 강력한 기능들을 제공한다.case들을 tuple, 특정 타입에 대한 cast를 포함해서 좀 더 많은 패턴으로 구성할 수 있다.Switch의 case 일치 값은 임시 상수 혹은 변수에 담길 수 있다.복잡한 조건은 각 케이스의 where 절로 표현될 수 있다.  For-In Loopsfor-in loop 구문은 Array의 값들, String의 Character 값들과 같..