보리밀빵집

<input class="aaa" id="bbb" name="ccc" value="ddd" sujin="eee" />

class로 가져오기

id로 가져오기

name으로 가져오기

사용자 지정 변수로 가져오기

만약 searchList 라는 함수를 찾고싶은 경우

그냥 searchList를 검색하면 함수 선언부가 아닌 함수를 사용하고 있는 부분들도 지나쳐야한다..

가장 잘 쓰고있다!

오류도 못 읽던 시절.. 대방이가 알려준 꿀팁 ㅎㅎ

DB관련 회사에 들어온지 2년반... 웹기반 솔루션 개발을 하고 있지만 뭔가 정체되어있는 느낌을 지울수가 없다..

해서.. 좀더 앞으로 나아가기 위해 계획을 세워 본다.

1. Spring 책 보기

2. https://opentutorials.org/course/743  자바스크립트 공부

3. 데이터통신 책 보기

4. https://www.heroku.com/  웹 서버 구축 ( 스프링 기반, JAVA 1.8 )

5. 자료구조 책 보기

6. 최신 트랜드 찾아보고 블로그에 글 작성하기 (2주에 한번!)

1~5번은 한번씩은 해 봤던 것이지만, 실무를 모를때와 지금은 받아들이는 정도가 다를 것이라고 생각한다.

사실 4번은 취미생활로...  코딩은 재미있어야 하니까!

나는 내가 아는 모든 정보를 데이터화시켜서 웹으로 볼 수 있도록 구현하는게 정말 하고싶은 최종 목표이다.

이번 년도의 목표는 우선 저 6가지를 해내는 것이다.

시작하자!!

더블 셀렉트 박스를 구현해야 해서 매번 첫번째 셀렉트 박스에 따라 두번째 셀렉트 박스를 세팅해줄 때 디비에서 불러오다가, 한번에 불러와서 입출력을 줄여보자는 의미에서 다음 함수를 작성하였다.

==== 스크립트 부분 ====

<script>

//다큐먼트 레디

$(function(){

//Jackson 이용 List<VO> or List<Map<String,String>> 형태 JSON

var ARR = [{"month":"01","year":"2018"},{"month":"02","year":"2018"},{"month":"05","year":"2017"},{"month":"06","year":"2017"},{"month":"07","year":"2017"}];

setFirstSelect(ARR); //년도세팅

setSecondSelect(ARR,$("#year").val()); //월세팅

$("#year").change(function(e){

setSecondSelect(ARR,this.value);

});

});

function setFirstSelect(ARR){

//첫번째 셀렉트 값을 중복제거 후 입력

var ARR_TEMP = new Array();

for(var i=0;i<ARR.length;i++){

var isTF = true;

for(var j=i+1;j<ARR.length;j++){ 

if(ARR[i].year==ARR[j].year){

isTF = false;

}

}

if(isTF){

ARR_TEMP.push(ARR[i].year);

}

}

var appendYear="";

  ARR_TEMP.sort();

for(var i=0;i<ARR_TEMP.length;i++){

appendYear+="<option value='"+ARR_TEMP[i]+"'>"+ARR_TEMP[i]+"</option>";

}

$("#year").empty().append(appendYear);

}

function setSecondSelect(ARR,value){

//첫번째 셀렉트 값에 따라 두번째 셀렉트 값 입력

  var ARR_TEMP = new Array();

  for(var i=0;i<ARR.length;i++){ 

if(ARR[i].year==value){

ARR_TEMP.push(ARR[i].month);

}

}

  var appendMonth="";

  ARR_TEMP.sort();

for(var i=0;i<ARR_TEMP .length;i++){

appendMonth+="<option value='"+ARR_TEMP[i]+"'>"+ARR_TEMP[i]+"</option>";

}

$("#month").empty().append(appendMonth);

}

</script>

==== HTML 부분 ====

<select id="year">

</select>

<select id="month">

</select>

* 정렬 부분이 부족함.. 사용할때 수정해야 할듯

* 중복 제거하는 부분에서 좀더 효율적인 알고리즘이 있지 않을까...

* 이 소스는 year 과 month 두가지로 되어 있으니 사용하시려면 각 키값을 바꿔서 사용하시기 바랍니다.

이클립스 메모리 확인

1. 이클립스를 켜 주시고 상단 Window -> Preferences 로 들어간다.

2. 가장위의 General 탭에 Show heap status 체크박스를 체크 후 Apply를 누르고 Close로 닫아준다.

3. 이클립스 하단에서 메모리를 확인한다. ( 사용중 메모리 of 최대 메모리 ) 

4. 이클립스 설정파일에서 최대, 초기 메모리를 확인할 수 있다. 

- Xms256m     ->  시작시 256M

- Xmx1024m   ->   최대 1024M 까지 증가

초기에 256으로 시작하고 부족하면 늘어난다.

신논현역 근처에서 좀 걸어야 나오는 카페다.

지도를 보면서 걷다보면 어느새 지나쳐 있기 때문에 코알라 간판을 잘 살펴야 한다.

영업시간을 물어봤더니 24시간이라고 하셨다.

위치는 이곳이다.

밖에서도 커피를 즐길 수 있다.

내부는 좁지만 인테리어가 잘 되어있다.

아기자기한 물건들이 많이 있다.

나와 친구는 원형탁자에 앉았다.

액자에도 귀여운 코알라가 있었다.

명함도 귀여웠다.

뒷면에는 쿠폰을 찍을 수 있었다.

음료 크기는 기본으로 라지사이즈가 나오는 것 같다.

나는 민트초코를 시켰는데 맛도 괜찮았다.

민트초코는 맛이 없는 곳도 많은데 맛도 양도 마음에 들었다.

곰돌이들이 있어서 찍어보았다.

와플도 시켜먹었다.

와플이 굉장히 달았다.

그래도 생크림은 찍어먹었다.

배부른 상태에서 먹어서 남겼지만, 달달함은 딱 내 취향이었다.

몬스타엑스 컵홀더를 주는 이벤트를 하고 있었다.

한 명당 다섯개씩 줬다.

가격대는 4천원~6천원 정도이다.

다른 곳에서 레귤러 사이즈 가격인데 양이 많이 나오니 가격대비 만족스러웠다.

정말 귀여운 요소들이 많이 있는 카페였다.

너무 이쁜 가게이고, 좀 좁아서 잠시 쉬다 가기 좋은 카페다.

근처 가게에서 테이크아웃을 많이 해가는 것 같다.

홍대와 신논현에서 이렇게 몬스타엑스에서 생일이 다가오는 맴버를 위해 팬들이 열어준 이벤트를 진행하고 있었다.

홍대에 가봤더니 이런 문구가 적혀있었다.

홍대쪽엔 사람이 많아서 금방 소진되었나보다.

26일 이후에 간 친구는 컵홀더를 얻었다고 한다..

생일 선물로 로지텍 마우스를 받아서 리뷰를 작성합니다.

포장 박스. 깔끔하게 사진과 함께 모델명이 적혀 있네요.

포장을 뜯으면 플라스틱으로 다시한번 포장이 되어 있습니다. 다행히도 손으로 열 수 있도록 되어 있어요.

플라스틱 포장을 뜯은 모습입니다.

마우스 선이 아래쪽으로 들어가 있습니다.

마우스 선은 동그랗게 말려서 포장되어 있습니다.

그리고 꼬이지 않는 재질로 되어 있네요.

선은 가벼워서 고정시키지 않아도 책상 아래로 떨어지거나 하지 않을 듯 합니다.

특이한 부품이 하나 같이 들어 있었는데요 마우스를 무겁게 해주는 추 같습니다.

저는 가벼운 쪽을 선호하기 때문에 사용하지는 않을겁니다.

드디어 마우스 풀샷입니다. 그립감도 아주 좋고, 제 손이 큰 편인데도 딱 손에 맞네요. 

참고로 제 손은 중지 ~ 엄지가 F1 ~ F11키에 꽉 들어찰 정도입니다.

휠 바로 아래에는 휠 고정 버튼이 있는데요, 고정을 풀면 피젯 스피너마냥 휠이 가볍게 돌아갑니다.

제가 원했던 기능이라 아주 만족스럽습니다.

왼쪽엔 페이지 이동 버튼과 약간 위쪽을 보면 마우스 감도 버튼이 있습니다.

예전에 쓰던 마우스는 자꾸 감도버튼이 눌려서 좀 그랬는데, 확실히 버튼이 구분되어 있어 좋네요.

마우스 클릭감은 많이 튀지도, 뻑뻑하지도 않은 보통 느낌이구요

마우스 조명도 눈부시지 않고 딱 멋있는 정도 입니다.

역시 이름값 하는 로지텍G502 마우스네요.

전체적으로 만족스럽습니다.

요약 평가 ( 5점 만점 )

키 구성 4점

그립감 5점

이동감도 4.5점

클릭감 3.5점

외관 4.5점

평균 4.3점 

(수진) 아 선물 고마워!! 진짜 잘쓸게!!

2018년 1월 7일

서현에 초밥을 먹으러 갔다.

알바하던 시절 알바하기 전엔 항상 대방이와 만나 서현에서 놀다가 우연히 발견한 맛집이다.

위치는 건물 내에 있어서 잘 찾아봐야 된다.

사실 우리만 항상 헷갈린다. 친구들은 잘 찾아갔다.

밖에서 이 간판을 잘 봐줘야 된다.

영업시간은 오전 11시부터 오후 10시까지다.

주문 마감은 오후 9시... 언젠지 모르겠다. 9시 전에 미리 하면 직원들도 좋고 손님들도 좋은 것 같다.

우리는 쥬만지 보기 전 11시쯤에 와서 의자에 앉아있었다.

대기 현황판도 있으니 줄이 길어도 문제없다.

서현과 정자에도 있다.

안에서 밥 먹다 봤는데 영등포에도 있다고 했던 것 같다.

영등포점은 이름이 달랐던 것 같은데 기억이 안 난다.

너무 오래전에 갔다 온 것 같다.

기다리는 동안 마시라고 숭늉이 있다.

지나가는 길에도 마시라니 주인분이 대천사다.

우리도 너무 추워서 조금씩 마셨다.

맛있었다.

오픈해서 자리에 앉았다. 메뉴판만 봐도 가성비 넘친다.

예전에 스시생선가게 세트를 먹었었는데 피자 먹을 땐 정말 배불렀던 기억이 있다.

그땐 위도 컸을 때인데.. 그래서 이번엔 스시생선가게 초밥 2개를 시켰다. 

모자라면 더 시키자!고 했는데 이걸 봤다.

정말 친절한 것 같다.

우리도 배불러서 더 시키지 못했다.

사진 돌리는 걸 깜빡했다.

너무 귀여워서 찍었다.

음식에만 관심이 있어서 주인분 얼굴을 본 적이 없었는데, 안경을 쓰셨나 보다.

드디어 나왔다.

스시생선가게 초밥!

참소라 2개, 문어 2개, 유부 2개, 한치 2개, 초새우 2개,

생새우 2개, 묵은지 광어 2개, 참치 2개, 연어 2개, 광어 2개

2명이라 2개 있는 게 아니니까 혼자 다!! 먹으면 된다.

서비스 우동이다. 국물도 진하고 너무 맛있다.

내가 와사비를 좋아해서 와사비를 주인공으로 찍었다.

다들 진짜 먹음직스럽게 생겼다.

먹어보면 진짜 먹음직하다.

생새우는 먹고 나면 귀까지 간질간질한 느낌이 들지만 제일 좋아하는 스시라 한 컷 더 찍었다.

예전에는 그냥 김치만 있는 줄 알고 맛있다고 먹었는데, 이번에 보니까 안에 광어가 들어있었다.

대방이가 말 안 해줬으면 또 그냥 묵은지만 있다 생각하고 먹었을 것 같다.

이후로는 먹느라 정신이 없어서 사진을 못 찍었다.

쥬만지 진짜 너무너무 재밌고 인생 영화다.

나는 이런 재밌는 요소가 중간중간 들어가 있는 게 너무 좋다.

가디언즈 오브 갤럭시랑 이번에 나온 토르도 재밌게 봤다.

글 쓰는데도 북소리가 들리는 느낌이다.

아무튼, 영화를 보고 베스킨라빈스를 갔다.

대방이가 좋아하는 신거..랑 사랑에 빠진 딸기랑 쿠앤크다.

이 글을 보고 다음에 민트초코를 먹었으면 좋겠다.ㅋㅋ

2018년 1월 4일

신림에 고구마 붕어빵을 먹으러 갔다.

전에 친구가 노량진 고구마 붕어빵 맛있다고 얘기해서 열심히 찾으러 다녔다.

검색해보니까 노량진이랑 신림이랑 숙명여대에 있다고 했다.

숙명여대는 가보지 않아서 모르겠지만, 노량진이랑 신림에 있는 것은 확인했다.

전에 발견한 후로, 고구마 붕어빵을 먹으려고 주말에 몇 번 찾아갔었다.

노량진도 신림도 항상 닫혀있어서 못 먹고 헛걸음했었는데, 드디어 먹었다.

평일에 대방이가 신림에서 놀다가 열려있어서 영업시간을 물어봤었다.

영업시간은 11:00~23:00이고, 재료가 떨어지면 일찍 닫을 수도 있다고 한다.

주말에 갔을 때는 항상 닫혀있었는데, 재료가 떨어져서 닫은건지 주말은 쉬는건지는 모르겠다.

위치는 신림역 7번 출구에서 나오면 판도라라는 가게가 나오기 전에 있다.

가격은 3개에 천원이다.

우리 집 앞 팥 붕어빵이랑 가격이 같다.

다 달라고 하고 싶었지만, 저녁 먹기 전 애피타이저라서 참았다.

이천 원 어치만 샀다.

역시 밥 먹기 전엔 붕어빵 3개 정도는 먹어줘야 된다.

붕어빵 먹고 저녁 먹어서 많이 못 먹을 줄 알았는데 더 많이 먹었다.

붕어빵 먹기 전에 한 컷 찍으려고 했는데, 정신 차려보니 붕어빵이 이미 먹혀있었다.

물론 다음 붕어빵도 있었지만, 손 시려서 찍고 나서는 먹기만 했다.

예전에 역 앞에서 홍보용 대일밴드를 받아서 가지고 다녔는데, 이번에 종이에 베어서 사용했다.

성남 성모윌병원 감사합니다.

안에 고구마 앙금이 너무 맛있다.

반죽도 분홍색인데 진짜 쫀득쫀득하고 그냥 너무 맛있다.

그냥 아무나 세상 사람들 다 먹고 흥했으면 좋겠다.

그래서 우리 동네까지 가게 많이 생겼으면 좋겠다.

5일에 대방이가 사다 줘서 또 먹었는데 너무 맛있었다.

식었는데도 맛있었다.

팥 붕어빵은 식어도 맛있는데, 고구마 붕어빵은 식어도 진짜 맛있다.

그래도 붕어빵들은 따뜻할 때가 가장 맛있다.

친구가 놀러 오면 노량진 고구마 붕어빵 사준다고 했었는데, 결국 사 먹었다.

그래도 겨울 지나기 전에 한 번 놀러 가야겠다.

예전에 이렇게 생긴 고구마빵을 팔았었는데, 지금은 파는 곳을 못 찾겠다.

집 앞 붕어빵집에서 붕어빵 팔다가 고구마빵으로 바뀌었는데, 다시 붕어빵집으로 바뀌고는 본 적이 없다.

고구마빵 먹을 생각에 매년 겨울이 설렜는데 ㅠㅠ 아쉽다.

맛은 고구마 붕어빵이랑 똑같지만, 고구마같이 생겨서 더 맛있어 보인다.

한 입 베어 물면 이렇게 생겼다. 너무 맛있었는데 ㅠㅠ 그립다.

개발하는 도중에 사용자의 입력을 막으려고 disabled를 사용했던 적이 있었다.
그런데 잘 동작하던 기능이 disabled를 넣었더니 동작하지 않았다.
콘솔 창을 봐보니 컨트롤러로 값이 넘어오지 않는 문제가 있었다.
그때는 disabled를 사용하면 입력을 할 수 없다는 것만 알고 있어서 문제점을 찾지 못했다.
알고 보니 입력만 막고 값은 넘기는 readonly 기능이 있었다.
또, 개발 중에 다른 사람이 disabled를 사용하여 문제가 되는 부분을 발견했다.
해당 변수에 값을 받아오지 못해 기능을 나누어 복잡하게 구현해 놓았다.
그러다 보니 중복체크 해야 할 값들이 많았고, 제대로 체크가 되지 않아서 오류도 많이 났다.

'disabled 값이 안 넘어와요', '컨트롤러로 값 전달' 등 여러 가지 검색해봤는데 다른 에러들에 대한 설명이었다.
저 같은 사람들이 이 글을 확인하고 오류를 해결했으면 좋겠습니다.

위의 코드를 실행해보면 아래와 같은 화면이 나타난다.

기본은 그냥 텍스트박스여서 수정이 가능하다.

disabled인 경우는 사용자가 입력을 할 수 없고, 값이 아예 전달되지 않는다.
컨트롤러로 값을 전달해서 사용할 수 없다.

readonly인 경우는 사용자가 입력을 할 수 없고, 값이 전달된다.
disabled는 아예 값을 사용하지 못하게 하는데, readonly는 값을 읽어올 수 있다.

마지막으로 readonly에 style을 씌웠다.
readonly는 입력을 막는 느낌이 없어서 disabled처럼 수정할 수 없어 보이게 스타일을 주었다.
눈속임이지만 고정된 값이라는 느낌이 오는 것 같다.

아직 해보진 않았지만, selectbox인 경우에는 readonly 기능이 없어서 컨트롤러에 값을 보내기 전에 disabled를 해제하고, 사용 후에 다시 disabled를 적용해주면 된다고 한다.

대방이는 hidden으로 하나 만들어서 selectbox 값을 복사한다고 한다.
다음에 필요한 경우에 사용해봐야겠다.