전체 글

요즘 REST API 가 굉장히 유행하고 있다. 서버와 클라이언트를 완전히 분리하고, 서버 주소로만 통신하니 역할분리가 확실하게 되더라. 이때 사용하는게 비동기 통신 라이브러리 axios 이다. axios를 사용하면서 비동기 처리에 대해 공부하게 되었는데, 이해한 내용들을 간단하게 정리해보았다. 비동기란? 비동기, 동기는 원래 통신과 관련된 용어다. 물론 통신에서의 개념을 끌고 오지는 않고... 아주 간략하게 설명하자면, 동기란 이전 작업이 끝나야 다음 작업이 실행되는 것, 순차적으로 실행되는 것이고 비동기는 이전 작업 수행 중에도 다른 작업을 수행 할 수 있게 하는 것, 작업이 순차적으로 실행되지 않는 것이다. 예시를 들자면, a 작업 -> 서버 통신 -> b 작업 -> c작업이 있을 때 서버 통신을 ..

이사할 일이 생겨서 전월세 대출을 알아보다가 카카오청년전월세대출을 선택했다. 왜 하필 카카오 청년 전월세 대출을 선택했고 전세를 포기했는지 적어보려고 한다.. 1. 카카오 청년 전월세 대출 선택한 이유 나는 재직 기간이 짧아서 신용대출은 불가능했고, 중소기업 청년 전월세 대출은 근저당 있는 집 + 재직기간이 잛은 점 때문에 거의 60% 이하밖에 지원해주지 못한다 해서 포기했다. (요즘 근저당 없는 집이 어디있냐고....) 그런데 카카오 청년 전월세 대출은 재직 기간이 짧고 근저당이 있어도(많으면 심사 불이익 있을 수 있음.) 최대 90% 까지 지원해주고 1.8% 정도의 이자만 내면 된다니... 심지어 카카오 대출은 비대면 신청에 빠른 심사로 유명하다. (중기청은 심사만 2~3주 넘게 걸려서, 그동안 다른..

[start project] 연락처 앱 마크업하기 - 1. 화면 설계 [start project] 연락처 앱 마크업하기 - 2. 메인화면 [start project] 연락처 앱 마크업하기 - 3. 상세화면 [start project] 연락처 앱 마크업하기 - 4. 정리 연락처 앱의 간단한 화면들을 만들어보며 margin, flex, hover, border-radius... 등등 여러 css 속성들을 써보았고 fontawsome 이라는 아이콘 라이브러리도 써보았다. 나는 마크업을 전문적으로 배운 사람은 아니다.... 야매로 익힌 것들이지만, 누군가에게는 도움이 되었으면 좋겠어서 적어봤다. 그러니 '실무에선 저렇게 안 쓰는데?!' 라며 돌을 던지지는 말고 .... ㅎㅎ 다들 우스갯소리로 웹 프로그래머,특히..

[start project] 연락처 앱 마크업하기 - 1. 화면 설계 [start project] 연락처 앱 마크업하기 - 2. 메인화면 [start project] 연락처 앱 마크업하기 - 3. 상세화면 [start project] 연락처 앱 마크업하기 - 4. 정리 ✨ 파일 생성 - main.html : 메인 화면 - detail.html : 상세 화면 - style.css : 공통 스타일과 main.css, detail.css 를 import 하는 파일 - main.css : 메인화면 스타일 - detail.css : 상세화면 스타일 ✨ 전체 프레임 전체 프레임은 이전에 만들었던 대로 만들면 된다. ... Phone Book ... ✨ 뒤로가기 버튼과 상세 정보 컨테이너 화면 설계에는 없었지만.. ..

화면이 넘어갈 때 위로 휘리릭 이동하고 옆으로 휘리릭 사라지는 애니메이션을 넣어보자. 나는 이전 화면이 페이드아웃되고 다음 화면이 페이드인되는 애니메이션을 넣어볼 것이다. 1. 애니메이션 만들기 기본적으로 안드로이드 스튜디오에는 animation 폴더가 없어 만들어줘야 한다. res 에 'anim' 혹은 'animation' 이라는 이름으로 directory 를 만들자. 이름은 반드시 두개 중 하나여야 한다. 만든 애니메이션 폴더에 fade_in.xml, fade_out.xml 파일을 추가한다. 자동으로 애니메이션 파일 옵션이 생길 것이다. 아래처럼 입력하자. duration 은 1초 동안 애니메이션을 실행하겠다는 의미고 fromAlpha 는 시작 알파값, toAlpah 는 끝 알파값이다. 0 ~ 1 만..

어플을 키면 제작사 로고가 잠깐 나타났다가 사라진 후 메인 화면이 보인다. 이 화면을 스플래시 화면이라고 한다. 스플래시 화면은 단순히 보여주기 용도로 넣는 경우도 있지만, 주로 앱에서 필요한 리소스들을 다운받을 때 대기 화면 용도로 사용한다. 만드는 방법은 간단하다. 스플래시 액티비티 화면을 따로 만들고, 메인 액티비티로 넘어가면 된다. 1. 스플래시 액티비티 생성 첫 화면으로 사용되므로 보통은 제일 처음 만들어지는 MainActivity 를 활용한다. 만약 별도의 스플래시 액티비티를 생성했다면, 첫 화면에 띄우기 위해 AndroidManifest.xml 에 다음과 같이 입력하자. ... ... intent-filter 부분이 바로 해당 액티비티를 첫 화면으로 쓰겠다는 의미다. 2. 타이틀과 액션바 없..

[start project] 연락처 앱 마크업하기 - 1. 화면 설계 [start project] 연락처 앱 마크업하기 - 2. 메인화면 [start project] 연락처 앱 마크업하기 - 3. 상세화면 [start project] 연락처 앱 마크업하기 - 4. 정리 ✨ 파일 생성 - main.html : 메인 화면 - detail.html : 상세 화면 - style.css : 공통 스타일과 main.css, detail.css 를 import 하는 파일 - main.css : 메인화면 스타일 - detail.css : 상세화면 스타일 ✨ 전체 프레임 연락처 화면을 화면 한 가운데에 띄울 것이다. 먼저 html 을 아래처럼 작성하자. root 는 화면 전체를 차지하는 빈 공간이다. root 안에 메인..

[start project] 연락처 앱 마크업하기 - 1. 화면 설계 [start project] 연락처 앱 마크업하기 - 2. 메인화면 [start project] 연락처 앱 마크업하기 - 3. 상세화면 [start project] 연락처 앱 마크업하기 - 4. 정리 ✨ 프로젝트 목표 위 화면을 html, css 로 구현할 것이다. 애니메이션 등의 고급진 스킬들은 다루지 않는다. 앞서 정리한 box model, position, flex, margin auto 등등만을 이용해 구현할 계획이다. ✨ 화면 구성 메인 화면 - 헤더 - 내 프로필 - 검색바 - 연락처 리스트 상세 화면 - 프로필 - 상세 정보 - 옵션메뉴