Karzin Lab

기획&설계 - 시스템 설계를 위한 기획, 기획과 설계는 밀접한 관계가 있다.

오늘은 저만의 생각일지도 모르겠지만, 이런 주제를 들고와봤습니다.

 - 시스템 설계를 위한 기획, 기획과 설계는 밀접한 관계가 있다.

저는 몇년간 여러 프로젝트를 진행하면서, 그 프로젝트들 사이에서 주로 개발을, 때로는 설계를 진행해보기도 했는데요,
(어떤때는 혼자 프로젝트를 진행하며 모든걸 해보기도 하고..)

경험속에서 어떠한 상황이 있었고, 이러한 경우에는 어떤 방식을 택해 해결을 해볼 수 있는지 고민해보고자 글을 작성해봅니다!

보통 요즘의 기업들이 에자일 방식(소프트웨어 개발론으로 생각해보자면)을 택하고 있는 이상 기존의 요구사항을 토대로 프로토타입성의 결과물을 만들어내고 이후 추가적인 요구사항을 받아 보완해나아가는 형식을 취하고 있습니다.

에자일 방식은 그만큼 유저가 필요한 기능을 파악하고 검토 그리고 다시 수정을 하기 위한 프로젝트에서 가장 적합한 프로세스이기는 하지만, 문제는 이 에자일 방식에서의 설계 방식에 많은 어려움을 겪기도 합니다.

(에자일방식이라고 해서 설계자료 없이 개발을 할 순 없으니 말이죠.) 

시스템 개발이라는건 상황에 따라서는 기존 개발방식을 깨고 새로운 개발방식이 필요한 경우가 있습니다.

이러한 경우는 기존 요구사항에서 새로운 요구사항으로 변경되면서 어쩔수없이 시스템의 구조가 변경되어야하는 경우인데,

이런 경우에는 개발자들은 리팩토링이나, 그냥 새로 개발하는 경우가 종종 발생하곤 합니다. (그냥 새로 만드는게 더 빠른 경우)

큰 문제는 리팩토링이 되었건, 새로 만드는 만드는 경우가 되었건 시간적, 인력적 코스트는 엄청나게 들곤 하죠..(결국엔 Money!)

그렇다면 설계자는 이러한 경우를 피하기 위해서는 어떻게 해야할까요?

기획의 명확한 의도를 파악하고(요구사항을 정확히 파악), 그 의도에서 새로 생길 수 있는 수정사항을 미리 고려하는 것입니다.

말이 어려울 수 있으니, 쉽게 설명해보자면.. 흠..

기획단계에서 나온 모든 요구사항을 전부 고려를 하는겁니다.

더 쉽게 말하면 확장성을 모두 고려해서 설계를 해야한다는 말이 가장 와닿을 수 있겠네요.

물론, 그 모든 요구사항을 충족할만한 시스템은 만들기 어렵겠지만,

확장성을 고려한 한번의 설계로 나중에도 문제 없이 개발을 진행할 수 있는 견고한 시스템(확장성이 쉬운)이 만들어진다면

개발자에게 있어서는 너무 감사하게도 나중에 생성될 야근시간이(시간적 코스트) 줄어들테고,

투입될 인력적인 부분(인력적 코스트)에 있어서도 많은 최적화를 이뤄낼 수 있을겁니다.

여기서 중요한건 설계뿐만이 아니라는 겁니다.

당연하게도 기획자는 기획의 의도를 명확히 해야할 필요가 있으며,

그 기획의 의도속에서도 추가적인 아이디어가 있다면 미리미리 첨언해준다면(그냥 툭 튀어나온 반영하지 않을 요구사항도 따로 정리해서) 설계에 있어 미리 확장성을 고려할 여지를 남겨두게 된다는 겁니다.

여기서 제 경험상으론 단순 아이디어(그냥 툭 내뱉은 아이디어)는 결코 단순 아이디어가 아닙니다.

그저 후보군으로 나왔었던 아이디어더라도, 추후 어떠한 결과로 다시 구현하게 될 지 모르는 암흑속의 존재(?)일지 모르기 때문에

기획자는 번거롭겠지만, 추후에 확장이 될 여지가 단 0.0000001%라도 있다면 설계자에게 어떠한 상황으로든 알려주는 것이 좋습니다.

이런 면에 있어서 저는 보통 기획부분과 설계부분을 엮어서 생각하는 경우가 있는데요,

보통 기획단에서 사용하는 Wireframe을 저는 개발하기에 좀 더 편한 저만의 Wireframe으로 조금 변형을 해서 쓰곤 합니다.

이러한 이유는 기획자의 의도가 개발단으로 넘어가면서 변질되지 않는것을 추구하기 때문이기는 하는데..

사실 개발자(저)의 시선으로 보면 기획 단의 Wireframe은 개발에 참고하기 위한 부분이 많이 부족하다고 느껴집니다. (구체적일수록 좋은데 말이죠..)

화면설계서라는 설계문서가 중간에 들어가기는 하지만, 이러한 화면설계서에서도 단순히 Wireframe과 요구사항만 보고 설계문서를 만들어내기란 쉽지 않기에 사람이 보기 편한 이미지적인 요소인 Wireframe을 좀 더 개발자에게도 확 와닿는 하나의 개발문서가 되었으면 좋겠다는 생각으로 커스텀을 해보게 되었습니다. (제가 본 블로그에 작성한 Wireframe에 관한 내용도 있으니, 하단의 링크를 통해 구경해보셔도 좋을 것 같습니다.)

 -> Wireframe 참고

물론 해당 게시글은 개인적인 감상, 견해가 듬뿍듬뿍 들어가 있으므로, 다른분들은 어떠한 생각이실지 궁금하기는 합니다. 그냥 이런 생각을 하는 사람도 있구나 생각을...ㅋ...

(좋은 글, 좋은 생각이 있으시다면 댓글 달아주세요! 저도 많이 배우고, 또 배워야합니다 ㅠㅠ)

이렇듯 기획과 설계는 거의 한몸(??)이 되어 서로의 생각을 아낌없이(???) 나눠야하며,

최소한의 코스트로 최대한의 완성도가 높은 결과물을 뽑는게 최고의 협업 환경이 아닐까 생각이 듭니다.

버전정보 (v1.0)

 - v1.0 2021.01.02 배포

* 저작권에 위반될 수 있는 컨텐츠(이미지, 동영상 등)나 게시글은 삭제되거나 수정될 수 있습니다.

* 문제의 여지가 될 수 있는 컨텐츠의 경우 댓글 달아 주시면 빠른 시일 내에 조치하도록 하겠습니다.

* Karzin은 항상 공부중입니다. 설명이 틀리거나 잘못된 부분이 있다면 의견내주시는대로 수정하도록 하겠습니다.

Karzin

abbeea@naver.com

[RN] 에러해결 : Check the render method of `ComponentName`.

열심히 RN에 심취해 개발을 하던 도중..

이런 에러가 뜹니다. 헿ㅎ헿ㅎㅎㅔㅎ...

여기서 ComponentName은 어떤 컴포넌트를 렌더하냐에 따라 이름이 바뀝니다. (말그대로 ComponentName입니다.!)

원인

ComponentName에 import한 컴포넌트의 이름이 잘못되었다던가, path(파일 위치)가 잘못되었다던가 등등의 문제로 일어납니다.

해결

우선 위 에러를 보시면 Check the render method of `ComponentName`.에 나온 ComponentName을 선택하셔서 import된 모든 컴포넌트들을 하나씩 체크하시기바랍니다. (방금 추가한 컴포넌트로 인해 위 에러가 나왔다면 그 컴포넌트가 범인입니다. 분명!)

컴포넌트의 위치가 잘못되어있다던가, 이름이 잘못되어있다던가의 이유로 발생하는 에러이기 때문에, 눈이 아프시더라도 하나씩 확인하시기 바랍니다. (저의 경우 워낙 많이 수정해서 import된 모든 컴포넌트를 전부 주석처리하고 하나씩 주석해제 및 체크하면서 확인했습니다.)

별건아닌데 import양이 많아서 애먹었네요.. 후....

버전정보 (v1.0)

 - v1.0 2020.11.21 배포

* 저작권에 위반될 수 있는 컨텐츠(이미지, 동영상 등)나 게시글은 삭제되거나 수정될 수 있습니다.

* 문제의 여지가 될 수 있는 컨텐츠의 경우 댓글 달아 주시면 빠른 시일 내에 조치하도록 하겠습니다.

* Karzin은 항상 공부중입니다. 설명이 틀리거나 잘못된 부분이 있다면 의견내주시는대로 수정하도록 하겠습니다.

Karzin

abbeea@naver.com

[Git] 터미널에서의 Branch의 관리 (Clone, push, pull, create)

버전관리한다며 Git을 사용한지 꽤 되었지만.. 제게 있어서 아직도 어려운것 같아요 ㅠㅠ

집에서는 GitLab을 설치해서 개인용도로 사용하고 있지만(물론 사무실에서도 버전관리를 위한 Git은 쓰고 있지요!),

혼자쓰거나, 프로젝트의 범위가 작은 경우 Branch를 잘 사용을 안했었는데, 이 참에 좀 정리를 해볼까 합니다.

Branch Clone

저장소_URL에서 Branch_이름을 Clone해옵니다.

예시 : git clone -b branch1 --single-branch https://github.com/*.git

Branch Create & Push

저장소_URL에 Branch를 만들고 Push합니다.

예시 :

   git checkout -b branch1

   git add .

   git commit -m "커밋1 - 변경내용1 수정"
   git push origin branch1

Branch Pull

저장소_URL에 있는 Branch에서 Pull합니다.

예시 : git pull origin branch1

버전정보 (v1.0)

 - v1.0 2020.11.20 배포

* 저작권에 위반될 수 있는 컨텐츠(이미지, 동영상 등)나 게시글은 삭제되거나 수정될 수 있습니다.

* 문제의 여지가 될 수 있는 컨텐츠의 경우 댓글 달아 주시면 빠른 시일 내에 조치하도록 하겠습니다.

* Karzin은 항상 공부중입니다. 설명이 틀리거나 잘못된 부분이 있다면 의견내주시는대로 수정하도록 하겠습니다.

Karzin

abbeea@naver.com

[jQuery] Window의 사이즈 변경 이벤트 함수 (resize)

컨텐츠의 각 size는 static으로 정의해줄수도 있지만, 모니터 화면의 비율에 따라서 Width나 Height값을 변경해주어 좀더 dynamic한 페이지를 만들어줄 수 있습니다.

모바일이나 PC에서 다르게 보이는것이 그 예인데요, 우리는 주로 고정된 화면에서만 사용을 함이 아니기 때문에!

오늘은 Window의 사이즈가 변경이되면 웹내부 컨텐츠들이 사이즈에 맞게 변경을 시켜주는 함수를 알아봅시다! (반응형 웹) 

$(window).resize()

$(window).resize() 함수는 매개변수로 이벤트를 발생할 function을 전달해줌으로써 윈도우의 사이즈가 resize될 때 마다 매개변수로 전달된 이벤트 function을 실행시켜줍니다.

$(window).resize(function() {
	console.log('resize!');
});

위의 함수를 사용하면, 다음과 같은 결과를 얻어낼 수 있습니다. (브라우저의 크기를 줄여보거나 키워보면 log가 찍힙니다.)

역시 정리시간은 재밌네요. 별거아닌거일수도 있지만 ㅋㅋ..

Reference

 - api.jquery.com/resize/

버전정보 (v1.0)

 - v1.0 2020.11.14 배포

* 본 게시글의 이미지에 들어간 글씨체는 네이버 나눔 글씨체인 나눔스퀘어 Bold를 사용했습니다.

* 본 게시글의 이미지는 전부 (이미지 내의 픽토그램 등) 직접 제작했음을 명시합니다.

* 저작권에 위반될 수 있는 컨텐츠(이미지, 동영상 등)나 게시글은 삭제되거나 수정될 수 있습니다.

* 문제의 여지가 될 수 있는 컨텐츠의 경우 댓글 달아 주시면 빠른 시일 내에 조치하도록 하겠습니다.

* Karzin은 항상 공부중입니다. 설명이 틀리거나 잘못된 부분이 있다면 의견내주시는대로 수정하도록 하겠습니다.

Karzin

abbeea@naver.com

[Xcode] 문제해결 : Splash 화면이 동작하지 않는 이슈 (iOS14)

문제 정의 : Splash(시작) 화면이 동작하지 않는 이슈(Black Screen)

                 -> 정확히는 검은 화면(Black Screen)만 보이는 이슈

문제가 확인된 기종 : iPhone X, iPhone XS, iPhone XS Max, iPhone 11 Pro, iPhone 11 Pro Max

문제가 발생한 운영체제 : iOS 14.1, iOS 14.2

같은 노치에서도 iPhone XR, iPhone 11에서는 발생하지 않는 문제인데, 유독 iPhone X나 iPhone 11 Pro와 같은 OLED를 탑재한 폰에서만 문제가 일어났습니다.

본 문제에 대해서 정리를 하자면

1. 운영체제가 업데이트 되면서 (iOS 13 -> iOS 14)

2. 노치가 있지만 LCD모델(iPhone XR, iPhone 11)이 아닌, OLED모델(iPhone X 이상)에서 발생하며

3. 시뮬레이터에서도 동일한 증상을 일으키고 있음

이에 대한 저의 판단은

-> Splash화면에 이미지를 사용하고 있기 때문에 이미지 관련 이슈일 것 같았고,

-> LCD모델이 아닌 OLED모델에서 일어나는 문제이기 때문에 해상도와 관련이 있지 않을까 였습니다. (실제로 LCD모델이 OLED모델보다 해상도가 낮음을 확인하실 수 있습니다.)

원인

여러 삽질끝에 이슈를 찾아보다가 다음과 같은 이슈를 발견했습니다.

-> 현재 iOS14에서 일어나는 이슈중 하나로 이미지의 해상도가 너무 큰 경우 이미지를 보이지 못하는 이슈가 있나봅니다. 따라서 어떤분은 해상도를 2400x2400이하로 처리하는것을 권장한다고 봤는데 (워낙 여기저기 검색하고 돌아다녀서 소스는 정확하지 않음) 저는 해결로는 안전빵으로 좀 더 낮추기로 결정했습니다.

해결

-> LCD모델의 경우 해상도가 낮아 이미지셋에서 2x이하의 이미지를 사용하게 되어있지만, OLED모델의 경우 해상도가 높아 이미지셋에서 3x이미지를 사용하게 처리되어있는게 아무래도 문제였던 모양입니다. 편한 해결을 위해 그냥 2x이미지를 3x이미지로 복사&교체하는 방식으로 해결하였습니다. 물론 임시방편으로 해결한 방법이고, 추후에 운영체제단에서 해당 문제가 fix되면 다시 원본이미지로 교체해두려고 합니다.

iOS13버전에서는 일어나지 않다가 iOS14버전부터 일어나는 문제다보니 많이 당황스럽긴 했었습니다.

그래도 편하게 해결되어서 좋네요. (임시방편이지만)

혹시라도 저와 동일한 문제를 안고계신분이 있다면 위와 같은 방법으로 해결할 수 있으므로 조금이나마 도움이 되었으면 좋겠습니다.

버전정보 (v1.0)

 - v1.0 2020.11.13 배포

* 저작권에 위반될 수 있는 컨텐츠(이미지, 동영상 등)나 게시글은 삭제되거나 수정될 수 있습니다.

* 문제의 여지가 될 수 있는 컨텐츠의 경우 댓글 달아 주시면 빠른 시일 내에 조치하도록 하겠습니다.

* Karzin은 항상 공부중입니다. 설명이 틀리거나 잘못된 부분이 있다면 의견내주시는대로 수정하도록 하겠습니다.

Karzin

abbeea@naver.com

[MariaDB, MySQL] 에러해결 : Multiple primary key defined

2개의 컬럼을 기본키로 설정하려 드니 에러가 나오더군요.

ERROR 1068 (42000): Multiple primary key defined

원인

저의 경우 filed1은 이미 primary key로 지정이 되어있었고, filed2를 추가로 primary key로 지정하려 했는데 위 에러가 뜨더라구요.

확인을 해보니 field2의 not null설정이 안되어 있어 일어나는 문제였습니다. (null가능 상태)

해결

위 에러가 나온다면 우선 설정하고 싶은 primary key의 값이 null이 가능한지 아닌지를 확인하시고,

null이 불가능한 상태에서도 변경이 이루어지지 않는다면, 기존에 설정된 primary key를 제거 후 다시 설정해주세요.

예) table에 field1, field2, field3가 있으며, field1이 primary key로 잡혀있을 때 field1과 field2를 묶어 primary ket로 설정하고 싶을 때

 - field2의 Null 허용 상태가 NO인지 YES인지 체크를 합니다.

desc [table name];

 -- 만약 filed2의 Null 허용 상태가 YES라면 NO로 변경해줍니다.

alter table [table name] modify [field name] [field type] not null;

 - table의 설정된 primary key를 제거해줍니다.

alter table [table name] drop primary key

- field1과 field2를 primary key로 지정합니다.

alter table [table name] add primary key([field1], [field2]);

생각보다 별거 아닌거가지고 에러를 많이 만나네요 ㅠㅠ

버전정보 (v1.0)

 - v1.0 2020.08.15 배포

* 저작권에 위반될 수 있는 컨텐츠(이미지, 동영상 등)나 게시글은 삭제되거나 수정될 수 있습니다.

* 문제의 여지가 될 수 있는 컨텐츠의 경우 댓글 달아 주시면 빠른 시일 내에 조치하도록 하겠습니다.

* Karzin은 항상 공부중입니다. 설명이 틀리거나 잘못된 부분이 있다면 의견내주시는대로 수정하도록 하겠습니다.

Karzin

abbeea@naver.com

[Spring Boot, Mybatis] 문제해결 : Select 해온 값의 VO객체가 null일 때

오늘은 신나는 에러의 날..인 동시에 바로바로 해결을 하는 날!

DB에서 Select해온 VO객체를 확인해보니 null로 들어오더라구요?

어?? 이상하다?? 해서 유심히 보니...

원인

DB에서는 _(언더바)를 이용해서 컬럼명을 선언했고,

VO 객체에서는 변수를 카멜케이스로 선언을 해서 생기는 문제였습니다.

생각해보니 Mybatis 설정에 _(언더바)를 camelcase로 맵핑해주는 설정을 세팅안해놨더라구요.

해결

Mybatis 설정 중 map-underscore-to-camel-case 설정 값을 true로 세팅해서 해결했습니다.

mybatis.configuration.map-underscore-to-camel-case=true

다른 해결방법으로는 VO객체의 변수를 DB와 같은 _(언더바) 형식으로 통일시켜주면 됩니다. (반대로 해도 되고..)

 예) Table의 컬럼명이 case_id라면 VO객체의 값을 받을 변수는 카멜케이스(caseId)가 아닌 컬럼명과 동일하게 case_id로 변수명을 통일해주시면 됩니다.

뭐 이런 초보자같은 실수만 연발하는지..

아마도 세팅을 한다고는 해도 꼭 몇몇개씩 빼먹고 진행해서 그런 것 같네요.

워낙 세팅보다는 개발에 더 많은 시간을 쓰다보니...

저번에 DB 연동할때 여러 테스트도 진행을 할 걸 그랬네요. (쩝..)

그냥 연동시켜놓고 된다! 하고 끝냈었으니... 이제와서 이런 문제가..

어쨌든 이걸로 이제 RestController에서 DB와 연동되어 받는 값들은 문제 없이 받아지고 있습니다. (아싸)

버전정보 (v1.0)

 - v1.0 2020.08.06 배포

* 저작권에 위반될 수 있는 컨텐츠(이미지, 동영상 등)나 게시글은 삭제되거나 수정될 수 있습니다.

* 문제의 여지가 될 수 있는 컨텐츠의 경우 댓글 달아 주시면 빠른 시일 내에 조치하도록 하겠습니다.

* Karzin은 항상 공부중입니다. 설명이 틀리거나 잘못된 부분이 있다면 의견내주시는대로 수정하도록 하겠습니다.

Karzin

abbeea@naver.com

[Mybatis, MariaDB, MySQL] 에러해결 : Table ~~~ doesn't exist

오.. 앞서 Mapper 관련 에러 게시글 작성 끝내고 바로 또 진행하면서 생긴 에러..!

Table ~~~ doesn't exist

테이블이 왜 없지 하고 봤더니... (이것도 결국 진짜 별거 아니었다고 하죠..)

저는 DB도 워낙 여러개를 다루다보니.. (Oracle, Tibero, Mysql, MariaDB는 기본이고 MongoDB, SQLite 등등..)

매번 헷갈립니다 ㅋㅋㅋㅋ (언어도 ㅋㅋㅋㅋㅋ)

이게 저거였는지 저게 이거였는지.. (혼용으로 인한 폐허)

덕분에 별거 아닌 문제를 많이 보게되는데, 이번에도 비슷한 별거아닌 문제네요 ㅋ;;

원인

종종 사용하는 Oracle에서는 대소문자를 딱히 구분하지 않아도 테이블의 검색이 가능했으나(어쩌면 옵션의 설정으로 바꿨을지도 모르구요),

아마 MariaDB도 옵션에서 설정을 해줄수 있는걸로 아는데, 제가 설치한 MariaDB에서는 대소문자를 구분하여 table 명을 검색합니다.

덕분에 없다고 나온거구요.

보통 Table ~~~ doesn't exist 에러가 나오면 테이블이 없다고 봐야하는데, 저는 분명히 만들었는데도 없다고 에러를 뿜어내면.. 뭐.. 원인은 대소문자 구분이죠. ㅎ..

해결

앞으로는 대소문자 구분해주는걸로 해결을 봤습니다.

옵션 변경을 해줄까 고민했는데, 나중에 대소문자 구분해서 쓰게 될 경우가 생길 것 같아서 패스했습니다.

음.. 에러를 만나 해결하는 건 즐겁지만, 

왜 이렇게 별거 아닌거에서 걸리는지...ㅋㅋㅋㅋㅋㅋ;;

버전정보 (v1.0)

 - v1.0 2020.08.06 배포

* 저작권에 위반될 수 있는 컨텐츠(이미지, 동영상 등)나 게시글은 삭제되거나 수정될 수 있습니다.

* 문제의 여지가 될 수 있는 컨텐츠의 경우 댓글 달아 주시면 빠른 시일 내에 조치하도록 하겠습니다.

* Karzin은 항상 공부중입니다. 설명이 틀리거나 잘못된 부분이 있다면 의견내주시는대로 수정하도록 하겠습니다.

Karzin

abbeea@naver.com