Dog foot print

서론 App의 컴포넌트 트리가 혹시 길어지는 것을 경험 해본 적이 있는가 ? 짧은 토이 프로젝트의 경우 컴포넌트 노드의 레벨이 3정도 될 것이다. 이런 경우 root component에서 최 하위 컴포넌트 노드에게 정보를 전달 해주기 위해, props를 각 레벨의 컴포넌트 노드에게 전달 해준 경험이 존재 할 것이다. 그렇게 어려운 일도 아니고, props를 각 컴포넌트에게 전달 하면 장땡이다 ! 이처럼 짧은 거리의 컴포넌트에게는 props로 데이터를 전달해주는 것은 충분하다. 그러나 트리의 높이가 4이상을 넘어가게 되면, props로 상위 컴포넌트의데이터를 전달해주는 것은 매우 힘들다 . 불가능하다는 이야기가 아니다. 코드가 지저분해지고, 이를 하위 프롭스로 전달하는 과정에서, 개발자의 실수로 유지하지 ..

서론 : 기존에 자바스크립트에서 Stack강의에 자세한 설명이 존재하기 때문에 자료구조에 대한 정의 및 함수는 이번 포스트에서 다루지 않았습니다. 코드 : class Stack { private var __stack : [T] = []; private var count : Int = 0; private var maxCount : UInt = UInt.max; init(count : Int) { maxCount = UInt(count) } func push(_ element : T){ guard count != maxCount else { print("over flow danger") return ; } __stack.append(element) count += 1; } func peek() -> T{ g..

서론 : 어쩌다 보니, 회사 일 때문에, IOS에 대한 공부를 시작하게 되었고 현재 계속 스위프트를 공부 중이다. 스위프트는 볼만 하지만, 스위프트를 이용한, 코코아 터치 프레임워크 및 코어 데이터를 사용하는 것이 완전 지옥이다. IOS LIFE CYCLE IOS 라이프 사이클은 다음과 같은 4개의 상태를 가지며 Fore ground 상태에서는 2개의 상태로 나뉜다. Not Running : 프로세스가 KILL되어 있는 상태. 즉 앱이 종료된 상태를 말한다. Fore ground : 현재 앱이 화면 전면 부에서 실행 되고 있는 상태. 즉 사용자가 현재 사용중인 어플리케이션. IOS에서는 1개의 어플리케이션만이 Fore ground 상태를 가질 수 있다. - Inactive : 앱이 실행중이지만, 아무런 ..

해당 포스팅은 큐와 트리를 이해했다는 가정하에 작성되고 있습니다. 큐와 트리에 이해도가 없는 분들은 본 포스팅을 보기 전 큐와 트리에 대한 포스팅을 먼저 읽어주시기 바랍니다. 우선순위 큐란 ? 우선순위 큐는 일반적인 큐와 거의 동일하다. 큐는 해당자료구조에 들어온 순서대로 배출이 된다. 다만 우선순위 큐는 우선순위큐는 먼저나가는 순서를 들어온 순서 뿐만 아니라 다른 조건에 의하여 들어온 데이터에 우선순위를 부여해 순위에 맞게 배출한다. 어찌보면 일반적인 큐도 우선순위큐가 될 수 있는데 배출되는 순서를 해당 큐에 들어온 순서에 의거하여 우선순위를 부여하여 배출하기 때문이다. 우선순위 큐의 사용 예 우선순위 큐는 우리의 일상에서도 친근하게 사용되고 있다. 유니버셜 스튜디오랜드같은 해외 외국 놀이공원에서는 일..

전 포스팅에서 prevMonth , nextMonth 버튼을 구현하지 않았는데 해당 버튼과 토,일의 스타일을 구현 하도록 해보겠다. buildCalendar 수정하기 prevMonth와 nextMonth에서 today만 변경해서 buildCalendar에서 알아서 변경하게 하고 싶어 전역변수 몇 개를 buildCalendar내부로 옮겼다.. 그리고 기존의 buildCalendar에서 일부 달의 경우 setDays가 아직 lastDate에 도달하지 못했음에도 row를 못 만들었기 때문에 함수끝에 제어문을 두도록 변경했다. function buildCalendar(){ let firstDate = new Date(todayYear, todayMonth-1,1); let lastDate = new Date(t..

오늘 낮에 position 속성에 관한 내용을 자스민 회원분이 업로드 하였는데 잘 이해하지 못하고 포스팅 한 것 같아서 아쉽다. 중요한 속성인 만큼 조금 신경을 써서 포스팅을 해야겠다. position 속성 positon은 어떤 것을 기준으로 상대적으로 옮겨질지 정하는 속성이다. 여지껏 position 속성을 몰랐다면 해당 margin 값을 이용해서 해당 html 요소를 옮겨왔을 것이다. 그러나 positon 속성을 쓰면 화면내에서 꽤나 자유롭게 요소를 배치할 수 있게 된다. positon의 value는 다음과 같다. static : 기본값 , top, left, right, bottom을 줘도 움직이지 않는다. relative : 자신이 static이었을때 위치에서 이동한다. absolute : 부모가..

우리 자스민 그룹원들이 공부를 매일 안 해서 조금 걱정이다... 아마 내가 이 글을 오늘 단톡방에 올려도 클릭해서 보지 않을 것 같다. 만약 이글을 자스민 그룹원들이 본다면 호형 멋쟁이라고 카톡에 올려주길 바란다. box-sizing box모델은 다음과 같이 ''content, padding , border, margin " 으로 이루어져 있다. 우리는 box모델의 크기를 제어하기 위해서 width 나 height를 적용한다. 그러나 해당 box모델에 padding 값이나 border 값을 할당한다면 우리가 주었던 width와 height 값을 넘어서 padding + border + width 값으로 해당 box 모델이 결정된다. 그러나 개발자가 padding을 사용하더라도 boder + padding..

state 와 props란 ? 리액트는 모든 뷰의 단위가 컴포넌트라고 하였다. 각 컴포넌트는 상위 컴포넌트에서 하위 컴포넌트를 import 하여 연결 되어 있는 구조인데 import 되어 있는 하위컴포넌트에게 상위컴포넌트가 값을 전달 하여 하위컴포넌트에서 사용 할 수 있다. 이것이 바로 props이다. 그리고 각 컴포넌트는 스스로 state라는 값을 가질 수 있는데 이는 개별적인 컴포넌트에서 각기 다르게 상태를 가질 수 있다. state란 ? state는 각 컴포넌트가 가지고 있는 개별적인 상태값이다. 클래스형 컴포넌트를 작성할때는 해당 클래스 내부 맨 위쪽에 작성하는 것이 일반적이며 state는 객체이다. import React, { Component } from 'react' export defaul..