Karzin Lab

Project.다원 Ensemble_개발(10)_공통코드 화면 개발

으으.. 더워 죽겠는데 혼자서 미션 임파서블 했습니다. (더위 속에 빠르게 개발 끝내기)

덥지만 화면만 빠르게 뽑아내고 자자! 싶어서 ㅋㅋㅋㅋ

이제 월요일 되니 빠르게 누워 잘까 했지만, 덥다보니 잠 못잘게 분명하다보니 조금 더 잡아보자 해서 진행합니다..ㅋㅋ;;;

덕분에 화면은 빠르게 뽑아냈습니다 ㅋㅋ

열일해준 선풍기에게 고마움을 전합니다!

(고마워 선풍기야. 줄게 전기밖에 없구나.. 전기라도 많이 먹어.)

공통코드 화면 (PC)

워낙 심플한 화면이라 뽑아내는건 금방이었습니다. (굳)

현재 DB는 연동한 상태는 아니고, 생각해보니 저장하는 Process는 있는데, 화면이 없어서..

(Modal로 만드려했는데 더워서 정신이 날라간 모양..)

저장하는 화면은 Modal로 만들어서 바로 사용할 수 있게 만들면 될 것 같습니다.

(Modal 만드는건 일도 아니니)

공통코드 화면 (Mobile)

모바일에서 본 화면은 위와 같습니다.

다만, 아무래도 대분류->중분류->소분류 이동하거나 값을 확인하는 부분이 많이 불편할것으로 예상이되어 어느정도의 보완은 필요할 것 같아보입니다.

그런 부분은 조금 고민을 해봐야겠네요. (흠... <대충 고민하느라 나는 소리)

이제 몇 가지 끄적끄적(작업)해주면 grid에 데이터 보이는건 금방 끝낼 것 같습니다.

그리고 Modal을 만들어 데이터 저장 및 삭제해주는것도 그리 어렵지는 않을 것 같구요.

다만, 오늘은 화면만 뽑자! 가 목표였으니.. 목표인 화면뽑기가 마무리 되었으니 빠르게 컴퓨터를 끄도록하겠습니다!!!! (으아아 컴퓨터의 열기!!!)

참고로 Wireframe 및 화면설계서는 아까 올린 Project.다원 Ensemble_설계(11)_공통코드 Wireframe&화면설계서를 참고해주세요!

솔직히 시간걸릴만한 일은 아녔는데,

아무래도 덥다고 의자(심지어 천으로 된 의자라..)에서 일어나서 선풍기와 진득한 허그를 하다(??) 개발하고,

누워있다(???) 개발하고, 정수기에서 물을 마시는건지 뿌리는건지 하다가(????) 개발하고 별짓을 다 하느라(?????) 시간잡아먹혔네요 ㅠㅠㅠ

얼른 취침해야겠습니다 ㅠㅠ

모두들 꿀잠 주무시길 바랍니다!

버전정보 (v1.1)

 - v1.0 2020.08.10 배포

 - v1.1 2020.08.10 내용 수정

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

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

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

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

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

Project.다원은 개인(karzin)이 기획, 분석, 설계, 디자인, 개발, 유지보수 등

모든 부분을 혼자 맡아 진행하는 개인 프로젝트입니다.

Project.다원 Ensemble

Karzin

abbeea@naver.com

Project.다원 Ensemble_설계(11)_공통코드 Wireframe&화면설계서

ㅡ으으으으아!!!! 너무 습하고 더워요!!

제 방에는 에어컨이 없어서.. (거실에만 있는..)

방에 에어컨을 설치할까 생각 안해본건 아닌데.. 실외기가 못버틸거라서 

교체비용 등등 생각하면 그냥 포기네요 ㅋㅋㅋ..

(차라리 에어컨 살 돈이면 아이패드 프로4와 펜+키보드를 사겠..)

더운 나머지 컴퓨터 킬 엄두는 못내고 그냥 조금씩 시간내서 덜 더울때(??) 선풍기 열심히 일시켜놓고 만들었습니다.

덥고 습하니 빠르게 Wireframe과 화면설계서만 보여드리고 지나갈게요! (빨리해서 방에 있는 PC의 열기를 줄여야겠습니다 ㅋㅋㅋ)

Wireframe (공통코드)

흠.. 공통코드야 크게 기능이 필요한건 아니라 CRUD만 보여주는 화면만 있으면 되서 심플하게 잡았습니다.

다만, grid는 일전에 말한것처럼 TOAST UI의 grid를 사용할 예정입니다.

grid에 제가 원하는 기능들이 있으면 좋겠으나.. 없으면.. 뭐, 개조해야죠. (아마 MIT License라서 수정이 가능할 것 같은데, 특별히 문제 없다 생각하면 어느정도 제 손맛태워야겠습니다.)

화면설계서 (공통코드 - PC)

Wireframe처럼 특별한 건 없습니다.

기능조차도 공통코드를 추가/삭제하는 기능이 있는 정도??

화면설계서 (공통코드 - Mobile)

아이고 더워라..(습해라..)

비는 정말 그칠날없고, 덕분에 습하고 덥고..

PC만 켰다하면 다른방보다 2도정도 더 높은 이 느낌.. 으으으..

개발 바로 들어가서 화면만 적당히 뽑고 오늘은 마무리해야겠네요!

오늘도 고생 많으셨습니다!

버전정보 (v1.0)

 - v1.0 2020.08.09 배포

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

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

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

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

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

Project.다원은 개인(karzin)이 기획, 분석, 설계, 디자인, 개발, 유지보수 등

모든 부분을 혼자 맡아 진행하는 개인 프로젝트입니다.

Project.다원 Ensemble

Karzin

abbeea@naver.com

Project.다원 Ensemble_분석(6)_공통코드 프로세스 정의 (코드 등록)

날은 덥고, 비는 와서 습하고.. 그 와중에 공통코드 하나씩 디비에 밀어넣고 있다보니 극심한 졸음과 함께 귀찮아지더라구요..(으아아!!)

앞으로도 넣어야할 공통코드가 산더미일텐데...

애초에 장비관리부터 시작하는 이유도 저의 업무를 줄이고자 귀차니즘을 해소하기 위해 시작한거였는데!!

(그 귀차니즘은 더 큰 귀차니즘을 불러들이고.. 그 큰 귀차니즘도 결국 더욱 더 큰 귀차니즘으로!!! 무한의 고통!!! ㅁ나ㅣㅓㅇ라ㅣㅡ라ㅣㅇㄴ)

그.래.서

공통코드 부분부터 먼저 만들자! 싶어서 공통코드 분석부터해서 설계-개발까지 빠르게 진행해볼까 합니다.

(어차피 한 페이지 만들거라 그리 오래 걸릴 일은 없을 듯 싶네요.)

실제로 제가 테스트 데이터 밀어넣고 삭제하고 하면서 테스트가 되는것도 덤!!(앗싸!)

버그라도 보인다! 싶으면 바로 제거를 해주는 살충제 기법까지! ㅋㅋㅋㅋ

공통코드만 잘 뽑혀도 넣고 빼는건 더 편해지고!! 아~~~싸!!!

어쨌든 오늘 프로세스 정의하고, 내일은 설계 빠르게 하고 개발들어가면 될 것 같습니다.

사실 설계라고 해봤자, 전에 장비관리 때 공통코드 ER Diagram과 Class Diagram은 이미 설계해놔서(참고),

Wireframe과 화면설계서정도만 만들고 바로 개발진행하면 될 것 같네요.

공통코드 프로세스 (등록)

등록 프로세스 자체는 굉장히 심플합니다.

시스템관리자는 추가하고 싶은 코드를 대분류->소분류(카테고리) 형식으로 내려갑니다.

소위 말하는 트리구조로 생각하시면 됩니다.

장비코드 - 분류 - 모니터

장비코드 - 분류 - 컴퓨터

장비코드 - 분류 - 노트북

...

이런식입니다.

사실 여기서는 대,중,소로 나뉘어 놨는데, 실질적으로는 하위로 계속해서 추가해갈 수 있습니다. (대, 중, 소, 소소, 소소소 ... - 쉽게말해서 탈것분류 - 자동차 - 전기 - 소형 - SUV ... 이런식으로 카테고리를 하위로 물릴 수 있다는 이야기입니다.)

다만, 굳이 그렇게까지 할 필요도 없어서 UI단에서는 3가지 즉, 대,중소분류로 나눠놓을까합니다.

대, 중, 소분류는 정확히 나누면

대분류 - 메뉴 정보

중분류 - 메뉴에서 사용할 코드의 타이틀

소분류 - 코드의 값

인 느낌이 되겠네요.

지금 생각으로는 공통코드 화면에는 Toast UI GRID를 붙여서 개발을 진행할 것 같으며,

어렵지 않게 코드의 관리가 되지않을까 싶습니다.

장비등록 화면개발하다가 '테스트용 공통코드 몇개만 넣어야지!' 했는데, 본의아니게 노가다를 하고있어서

그냥 덥고 습한나머지 공통코드 먼저 만들어버리자! 해서 후다닥 만들었습니다.ㅋㅋㅋ

사실 코드 등록 프로세스 이외에 코드 삭제, 코드 수정 프로세스도 있겠지만..

등록 프로세스도 심플하기도하고, 솔직히 등록이나 삭제나 수정이나.. 거기서거기.. (결코 졸려서가 아니라!)

어찌되었든 내일은 Wireframe이랑 화면설계서 대충 끄적이고 바로 개발 넘어가야겠습니다.

아! 지금 시간이 02시를 향해 가고있으니 내일이 아니라 오늘이네요 ㅋㅋㅋ

(벌써 이런 시간이;;;)

한숨 자고 다시 시작하도록 해야겠습니다 ㅋㅋ

오늘도 고생 많으셨습니다~

버전정보 (v1.0)

 - v1.0 2020.08.08 배포

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

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

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

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

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

Project.다원은 개인(karzin)이 기획, 분석, 설계, 디자인, 개발, 유지보수 등

모든 부분을 혼자 맡아 진행하는 개인 프로젝트입니다.

Project.다원 Ensemble

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

[Spring Boot] 에러해결 : Invalid bound statement (not found)

 - Project.다원의 Ensemble 개발을 진행하면서 나온 문제입니다.

사실 어제 삼성의 언팩 행사 틀어놓고 Ensemble 개발을 진행했었는데,

블로그에 글이 안올라온 이유가 딱히 보여드릴만한게 없어서(...) 그랬습니다.. (-_-)...

에러 하나가지고 어제 오늘 잡아먹어버렸네요;; 

이번시간에는 해당 에러에 대한 삽질을 하며 결국 어떻게 해당 에러를 해결했는지를 적어볼까합니다.

해결을 하고보니 진짜 별 문제 아닌데 왜 이리 오래걸렸는지.. (항상 그렇죠 뭐.. 삽질 엄청하다가 해결하면 어.... 아..... 하는.. 그런거 ㅋㅋㅋ - 많은 개발자분들이 공감하지 않을까 싶네요.)

DB연동은 예~~~전에 다끝내놨는데 이제와서 Invalid bound statement (not found): ~~~ 에러가 뜨길래 뭐지? 왜 못찾지? 어디가 문제지? 하면서 열심히 찾아다녔습니다.

하지만 열심히 찾아봐도 뭐가 문제인지 모르겠다는 것... (결국 찾아서 해결은 했지만.)

원인

저의 경우 DB 연동이랑은 다 문제없이 잘 되었는데, 결국 찾은 문제는 Mapper의 xml단의 id와 interface단의 function명이 달라 생긴 문제였습니다.

당시 function명을 'getAllCode' (공통코드단에서 모든 코드를 가져오는 함수)로 해두었는데 id는 'getAllCodes'로 한 것. (ㅡ..ㅡ 지금 생각해도 s하나 못본거 때문에 삽질한걸 생각하면..)

해결

function명을 바꾸긴 귀찮아서 (이미 다른쪽에는 다 선언해서 사용중이었..) xml단의 id를 'getAllCode'로 interface와 통일해줌으로써 해결했습니다.

눈이 나빠져서 그런가.. (사실 안경써야하는데, 안경이 오래되어 뿌옇게 보여가지고 안쓰게되요. 아.. 안경(블루라이트 차단, 도수있는)값 너무 비쌉니다.ㅠㅠ)

그거 하나를 못 찾아서 몇 시간을 날려먹었네요.

어제 이거 해결하고 자겠다고 새벽 3시쯤 잤는데..

오늘은 시작한지 한시간(...?)걸려 해결했습니다. (하하..)

어찌되었든 끙끙거리다 해결은 되었으니, 또 다음 스탭으로의 개발로 나아갈 수 있을 것 같네요.

버전정보 (v1.0)

 - v1.0 2020.08.06 배포

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

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

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

Karzin

abbeea@naver.com

[2020.07] 자전거 현황

7월은 자전거 펑크나고나서부터는 손도 못대고있네요 ㅠㅠ

바쁜건 둘째치더라도 비가 이렇게 많이오니...

비가 안오는날이더라도 지면이 젖어있는 경우가 많아 잘못하면 사고 위험도 높아지기도 하구요.

우선 펑크부터 고쳐야 하긴하는데.. 문제는 결국 비...ㅠㅠㅠㅠㅠㅠ

2020년 7월 자전거 출퇴근 현황 (회사-집 편도 약 6Km)

 - 아낀 버스 금액 : 8,750원 (2020년 8월 - 대전 기준 - 카드 - 편도 1250원 계산)

 - 펑크 이후 고치지 못함 + 장마기간

어휴.. 장마가 얼른 끝났으면 좋겠습니다..ㅠㅠㅠㅠㅠㅠ

피해도 많은 것 같은데 다들 조심하시기 바랍니다.

Project.다원 Ensemble_개발(9)_장비등록 화면 디자인 변경

흠.. 내일은 중요한 회의가 있어서 오늘 좀 일찍 자려했는데..

잠깐 잡아보자 해놓고선 벌써 00시 30분이 넘었네요;;

(뭐.. 사실 샤워하고 내일 회의 준비하고 프로젝트 시작한게 00시 10분쯤..ㅋㅋㅋ;;;)

그냥 시간배분 고려해서 잠깐 할만한거 생각하다가

그제 메뉴 디자인 바꾼김에 후다닥 장비등록 화면 디자인이나 변경하자 해서 변경했습니다. ㅋㅋㅋ

변경 전 화면 (링크)

누누히 말하지만 저는 딱히 파란색 좋아하는거아닙니다 ㅋㅋㅋㅋ

그냥 귀찮아서 빠르게 만든다는게..(결국 엎었지만..)

변경 후 화면

보시면 팍!하고 아시겠지만, 설명을 덧붙이자면 에메랄드 빛의 input상자류는 필수값을 나타냅니다.

추가로 앞으로 별 다른거없다면 save 버튼은 초록색으로 통일할까 하구요.

음.. button류에는 전부 shadow 처리를 해줬는데 생각보다 별 차이는 없어보이네요.

일단은 이정도..?

오늘은 위에서 말한것처럼 일찍 취침들어가야하므로 디자인변경만 하도록하겠습니다 ㅋㅋ (본업중시 - 문제는 잠이 안와서 이러고 있지만.... 오늘 커피를 엄청마셨더니 잠이 안옵...ㅠㅠㅠ)

내일은 DB연동작업이나 시작해야겠네요.

흠.. 이제 좀 졸리나 싶었지만 안졸리네요. 앙대...ㅠㅠㅠ

누워서 양이라도 좀 세고 있어야 겠습니다 ㅋㅋㅋㅋㅋㅋㅋ

버전정보 (v1.1)

 - v1.0 2020.08.04 배포

 - v1.1 2020.08.04 내용수정

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

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

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

Project.다원은 개인(karzin)이 기획, 분석, 설계, 디자인, 개발, 유지보수 등

모든 부분을 혼자 맡아 진행하는 개인 프로젝트입니다.

Project.다원 Ensemble

Karzin

abbeea@naver.com