개발 공부 일지

[React-Native 공부일지] [알게 된 것] Image 컴포넌트 source속성에 {url: "주소"}로 외부 이미지를, require("경로")로 로컬 이미지 삽입 가능 resizeMode 속성 - cover: 부모 객체를 이미지로 채움, contain: 전체 이미지를 보여줌. 이미지의 실제 크기를 조절하기 보다는 부모 View로 한번 감싸고 resizeMode 속성을 이용할 것. 태그의 style 속성으로 직접 꾸밈 요소를 넣으려면, { }로 한번 감싸야함 [결과 화면] [공부 자료 및 출처] https://yuddomack.tistory.com/entry/5React-Native-%EB%A0%88%EC%9D%B4%EC%95%84%EC%9B%83-%EB%94%94%EC%9E%90%EC%9D%B..

[React-Native 공부일지] [알게 된 것] 기본 Button 위젯은 환경마다 사용자에게 다르게 보여진다. 이보다는 TouchableOpacity를 사용하여 통일할 것. style 속성은 배열의 형태로 여러가지 속성을 입힐 수 있다. 속성이 중복될 경우 제일 나중에 들어온 속성값이 우선. defaultProps는 부모 컴포넌트에서 속성을 입력하지 않았을때 기본 값으로 동작한다. static defaultProps = {};​ [결과 화면] [공부 자료 및 출처] https://yuddomack.tistory.com/entry/5React-Native-%EB%A0%88%EC%9D%B4%EC%95%84%EC%9B%83-%EB%94%94%EC%9E%90%EC%9D%B8-3%EB%B6%80-%EC%BB%..

[React-Native 공부 일지] 알게 된 사실 React-Native의 주축은 세로다. height, width 속성과 flex 속성을 같이 사용하면, 앞의 두 속성의 값 분배 후 남은 공간에 한해 flex 비율이 정해진다. 이때, height 속성의 값을 px로 하면 에러가 난다. 반드시 %로 분배할 것. flex와 %는 부모의 크기에 영향을 받는다. 크기 지정 필수. 화면 전체를 감싸는 container의 경우 부모 요소는 화면 전체가 된다. 자주 쓰일 속성 justifyContent: 자식 요소에 대한 주축(main-axis)의 정렬 방식 alignItems: 자식 요소에 대한 교차축(cross-axis)의 정렬 방식 공부 자료: https://yuddomack.tistory.com/entry..

현재 시간을 띄우기 위하여, 현재 날짜 정보를 호출하는 메서드가 필요했다. 이게 처음에는 잘 기억이 나지 않아 Date, Date.now(), Date.now().hour(), 등등을 막 입력했었는데, 결국 답을 찾지 못했었다. Nico의 강의영상을 보며 작성했던 초기 코드를 다시 복습하면서 글을 남긴다. Date()를 입력하면 현재 날짜를 얻어올 수 있고, 아래와 같이 특정 변수에 동적할당을 해주어야 getHours(), getMinutes(), ...와 같은 메서드를 쓸 수 있는 듯하다. 이것저것 다 해봤지만 그 외에는 불가능했다. 구체적인 이유는 더 찾아봐야할 것 같다 ㅜㅜ function getClock() { const date = new Date(); const hour = String(dat..

실제 Momentum처럼 배경에 랜덤한 이미지를 설정하고 싶었는데 이미지를 지정하면 자꾸 아래와 같이 여러 장의 사진이 반복되는 상황이 펼쳐졌다. 이미지의 해상도가 낮을 수록 여러개의 이미지가 반복되었다. img 폴더에는 있는 모든 이미지들이 0.jpg, 1.jpg, ... 이렇게 규칙적으로 되어있어, 이미지파일의 이름들을 담은 배열을 별도로 생성하지 않았다. JS로 body의 배경 이미지를 변경하는 코드는 다음과 같이 작성하였다. (사실 Nico는 JS에서 style을 건드리는걸 별로 좋아하지 않는다고 했던 것 같은데, CSS에서만으로도 랜덤한 이미지 설정이 가능한지 몰라서 그냥 작성하였다ㅎㅎ) /* js/backgound.js */ const imgNum = Math.floor(Math.random(..