분류 전체보기
-
Swift - ViewController Lifecycle (생명주기) 02Swift 2019. 7. 8. 16:17
Swift의 ViewController Lifecycle (생명주기) 를 문서로 정리를 해보았는데 가장 중요한 것은 내 눈으로 직접 보는게 아닐까 싶다. * 개념이 아직 안 잡혀있으면 다시 사진과 글을 보고오자 https://tono18.tistory.com/11 Swift - View Controller Life Cycle (생명주기) 앱은 View Controller 로 이루어져 있는데, 이 View Controller 가 여러개일 경우가 대부분 일것 이다. 이 각각의 View Controller 는 생명주기를 가지고 있는데 View Controller 에서는 생명주기는 화면에 보여졌.. tono18.tistory.com 직접 해보는 화면은 다음과 같다. 첫번째 화면(빨간색)에서 버튼을 누르면 두번째..
-
[vue.js] v-forvue.js 2019. 7. 3. 18:53
1. 리스트 렌더링과 v-for v-for 디렉티브를 사용하여 배열을 기반으로 리스트 렌더링을 할 수 있다. 이 디렉티브는 item in array 형태의 특수 구문을 필요로 한다. 이 구문에서 array는 원본 데이터 배열이고, item은 순회되는 배열의 엘리먼트의 별칭이다. 2. 범위를 가진 v-for v-for 디렉티브는 객체나 배열이 아닌 정수를 받을 수 있다. 이때 정수가 전달되면 템플릿이 지정된 수만큼 반복한다. 은 item in array 형태로 작성된 것이다. array에 배열이 아닌 정수가 들어간것. 즉 li태그가 11번 반복 될 것이다. 저 상태에서 그냥 i 만 찍어보면 ( {{ i }} ) 저 상태에서 그냥 i -1을 하면 다음과 같이 나오고 나는 2 x {{ i - 1 }} = {{..
-
[vue.js] v-show, v-if, v-elsevue.js 2019. 7. 3. 18:47
1. 조건부 렌더링 조건부 렌더링이란 조건에 따라 다르게 렌더링 할 수 있는 것을 말하며, v-show, v-if, v-else, v-else-if 가 있다. 2. v-show v-show는 조건 상태값에 따라 결과값이 보이고 보이지 않게 된다.. 즉 display의 css 속성을 토글해 보여주거나 감추는 것이다. v-show="조건상태" 이렇게 쓸 수 있다. 예를 들어 어떤 글자가 꼭 입력이 되야만 생성되는 버튼을 만든다고 한다면 다음과 같이 v-show 디렉티브를 이용해 만들 수 있다. 저번에 포스팅했던 v-model 을 이용해 textarea를 message 변수와 바인딩 해서 메세지를 표시한다. 그리고 button에 v-show="조건상태" 를 입력하여 textarea에 글이 있으면 버튼이 보이게..
-
[vue.js] v-modelvue.js 2019. 7. 3. 18:36
1. v-model v-model 디렉티브는 양방향 데이터 바인딩을 통해 예를들어 사용자가 입력한 엘레멘트 안의 내용을 벼경할 때 메세지 값을 동적을 변경해준다. 화면을 띄우면 이렇게 내가 데이터 객체에 message의 속성값으로 적은 문자가 나온다. 이때 내가 input창에 다른것을 입력한다면 h1태그의 메세지도 똑같이 바뀌는 것을 볼 수 있다. input창 내용을 지우면 지우는대로 바꾸면 바꾸는 대로 h1태그의 내용도 바뀐다. 이것이 양방향 데이터 바인딩이며, 양방향 데이터 바인딩은 뷰에서 모델의 값을 변경하면 모든 것이 최신으로 유지되는 것을 의미한다. 2. 만약 이것을 jQuery로 한다면? 입력 엘리먼트를 만들고 id 나 class를 지정하여 원하는 엘리먼트 입력값과 일치하도록 변경하는 함수를 ..
-
[vue.js] Mustache(이중중괄호), v-bindvue.js 2019. 7. 3. 18:32
1. Mustache 구문 - 이중 중괄호 데이터 바인딩의 가장 기본 형태는 'Mustache' 구문 (이중 중괄호)을 사용한 텍스트 보간이다. 화면에 문자열을 출력하는 간단한 경우에 쓰인다. 화면에서는 다음과 같이 나온다. Mustache 태그는 해당 데이터 객체의 msg 속성 값으로 대체된다. 또한 msg 의 속성이 변경될 때마다 갱신된다. 즉 내가 msg: 고친다. 라고 한다면 화면에 이렇게 변경된 msg의 값이 나온다. 2. 디렉티브 화면에 문자열을 출력하는 간단한 경우에는 {{ }} 이중중괄호를 쓰면 되지만, 만약 html 속성 내에서 vue 내에 선언된 값을 사용하고 싶어진다면? 그때는 v-bind 라는 디렉티브를 쓰면 되는데, 이때 디렉티브란 v- 접두사가 있는 특수 속성을 말하며 여러가지 ..
-
vue.js 란?vue.js 2019. 7. 3. 18:23
vue.js 란? vue.js 란 프런트엔드 웹 프레임워크다. 프레임워크는 건축을 할 때 뼈대를 두고 살을 붙이는 작업이라기 보다는 건축을 할 때 필요한 재료들(이미 재단이 되어있는 재료들)을 제공을 해주어서, 우리가 그것들을 가지고 이리저리 합치고 뭉치고 해서 건물을 만드는 것이라고 한다. - vue.js 는 구글에서 일하던 에번 유가 개발했는데, 구글에서는 AngularJS 라는 프레임워크를 이미 개발한 상태였다. 이미 AngularJS 가 있음에도 vue.js 를 개발한 이유는 다음과 같은 이유여서이다. 1. AngularJS 는 배우기 쉬운 프레임워크가 아니다. 2. AngularJS 는 양방향 데이터 바인딩 기능을 사용하는 싱글 페이지 어플리케이션 개발인데, 작성해야하는 프로그램의 크기가 거지기..
-
Swift - View Controller Life Cycle (생명주기)Swift 2019. 7. 3. 18:14
앱은 View Controller 로 이루어져 있는데, 이 View Controller 가 여러개일 경우가 대부분 일것 이다. 이 각각의 View Controller 는 생명주기를 가지고 있는데 View Controller 에서는 생명주기는 화면에 보여졌다가 사라지는 주기를 말하는 것이다. View Controller Life Cycle 을 이미지로 본다면 다음과 같은 이미지로 볼 수 있다. 이미지 출처: https://subscription.packtpub.com/book/application_development/9781783550814/6/ch06lvl1sec60/uiviewcontroller-lifecycle-methods 불러오는 중입니다... 1. loadView() : 화면에 띄워줄 view..
-
Swift 로 iOS 앱 만들기 - 05 : 코드로 view 생성하기 (Then 사용)Swift 2019. 7. 3. 13:45
[예제] SnapKit을 이용하여 Label, TextField, Button 을 만들어보자. - 03 [추가] 코드로 view 생성하는 3가지 방법 1. 가장 기본적인 방법 : viewDidLoad() 안에 작성 버튼과 텍스트 필드에서 색을 지정 해주는 부분에서 각 코드는 주석과 같다. UIColor.blue 부분에서 UIColor 를 지우고 쓸 수 있는데, 그 이유는 backgroundColor 변수의 타입 자체가 이미 UIColor 이기 때문에 굳이 UIcolor.blue로 쓰지 않아도 되기 때문이다. self.changeButton.backgroundColor = .blue //self.changeButton.backgroundColor = UIColor.blue self.nameTextField..