에스알닷컴

[Handlebars] 사용하기

 - 이 문서는 http://handlebarsjs.com/를 참조하여 작성했습니다.

[Handlebars 사용할 경우]

[프로젝트에 적용해보기]

See the Pen ZVMrVL by seokrae (@seokrae) on CodePen.

[BoostCourse] 프로젝트 3 . 예약관리 시스템 : 메인페이지 (BE)

 - 이전 글

 - 다음 글

 - 프로젝트 제출 컨텐츠에서 개편

[Java Config]

 - 스프링 설정 시

 - reservation v1.4 폴더 내부 구조 상

img 폴더와 reservation-html-base 폴더 하위 폴더인 img 폴더 안에 파일이 겹치는 내용이 있어서 둘다 설정 했었다.

 - 폴더 내용을 확인하면 img 폴더는 상품(Product)의 file_info 테이블에 저장되어 있는 이미지 파일

 - reservation-html-base의 하위 폴더인 img 폴더 내용은 View를 구성하기 위한 컴포넌트 이미지 파일이 저장되어 있다.

 * 피드백 이후 같은 파일을 삭제, resources 하위 폴더인 img 폴더의 폴더명을 수정

 - 또한 setCachePeriod() 메소드는 정적자원에 대한 캐시 주기를 설정 하는 것

 - 숫자 31556926의 의미는 1년, 그렇기 때문에 이 상수 값을 모든 함수에 설정하기에는 중복이 많다.

 * 피드백 이후 상수 선언으로 동일한 설정 정보를 적용

[Logger]

 - 이 내용은 나중에 뒷 부분에서 배우게 된다.

 - 혹시나 잘못된 데이터로 인해 오류 발생 시, 에러난 시점을 쉽게 찾기 위해서 설정

 - Logger에 대한 정확한 내용을 모르고 작성한 내용에 대해 피드백을 해주심

 * Logger에 대한 이론적인 내용을 정리해야할 듯

[Controller]

 - Service Layer를 DI를 통해 사용하기 위해서 설정, 오타가 있었네...

 * 피드백 후 오타 수정 하였습니다.

[이론]

 - DI관련 어노테이션과 방법, 특징, 장단점 정리가 필요

 - 위에 변수 설정이 default로 설정을 아무생각 없이 한 것을 피드백보고 알았다..

 * 피드백 이후 다른 클래스에서 쓸 내용이 아니라서 private 선언으로 수정

[Log]

 - API호출 시 데이터가 제대로 오는지 확인하기 위해서 끄적여 본 내용이다.

 - 생각해보니 DB에서 잘못 가져왔다면 거기서 예외처리를 했어야 했다.

 - "Err"보다 0으로 표시하여 정확한 값을 나타내 주는 것이 좋은 듯 하다.

 * 피드백 후 DAO Layer에서 예외처리 추가 후, 메서드 호출 로그만 나오도록 수정

[Parameter]

 - required 속성이 사실 필요는 없다. 

 - View에서 처리할 내용이긴 한데 혹시나 몰라서 설정을 해봤는데 상세한 피드백이 왔다. (이건 몰랐네)

 * 피드백 후 추가적으로 defaultValue를 0으로 설정하여 카테고리 전체리스트가 0으로 들어오게끔 설정

[logback.xml]

 - Logger 설정을 위한 logback.xml 파일 설정

 - 뒤 프로젝트 강의에서 배우게 된다.

[BoostCourse] 프로젝트 3: 예약관리 시스템 : 메인페이지 (BE)

 - 이전 글

 - 다음 글

[ 변경된 사항 ]

 1. 프로모션(Promotion)

  - 프로모션 API 문서 확인

  - 프로젝트의 클래스 수정

 2. 카테고리(Category)

  - 카테고리 API 확인

  - 카테고리의 클래스 수정

 3. 상품(Product)

  - 상품 API 확인

  - 상품의 클래스 수정

[BoostCourse] 프로젝트 4. 예약관리 시스템 : 상세페이지 (BE)

 * 이 글은 웹 프로그래밍 과정을 진행하면서 "개인적인" 생각을 정리한 글입니다.
 * 잘못된 부분이나 더 좋은 생각이 있으신 분들은 댓글 남겨주세요.

 - 다음 글

 - 프로젝트 4의 예약하기 기능을 구현하기 위한 기획서를 분석하여 작성

 - 설계서(구글 프레젠테이션)

 [목차]

 1. 기존 프로젝트 3 소스 수정

  - 기존 :: Controller에서 List<VO>포맷을 JSON 파싱 후 String 리턴하는 방식

  - 신규 :: Controller에서 Map<String, Object>로 리턴하는 방식

  - Dao에서 단일 데이터 호출 Service 단계에서 트랜잭션 데이터 만들도록 정리

 2. 요구사항 정의

  2.1 프로젝트 4 기능요구사항 정의

  2.2 프로젝트 4 기술요구사항 정의

  2.3 프로젝트 4 소스코드 작성 규칙

 3. 상품 전시 정보 보기 기능 Sequence Diagram

  - Proejct 3 메인페이지 작성 내용을 기준으로 사용자가 특정 상품을 눌렀을 때 상세 상품 전시 정보 페이지를 보여주는 기능을 구현

 4. 프로젝트 3 리펙토링

  4.1 카테고리 UI 구현

  - 템플릿을 이용하여 동적으로 갯수가 추가되도록 구현

  4.2 프로모션 UI 구현

  - 슬라이드 구현 방식을 캐러셀 방식으로 구현

 5. DisplayInfo API 구현

 - Swagger에 작성된 문서를 통해 Model과 API 작성

6. 프로젝트4. 예약관리 시스템: 상세페이지 구현 순서

7. 프로젝트4. 예약관리 시스템: 상세페이지

 - 상단

 - 중단

 - 하단

8. 프로젝트 4. 예약관리 시스템: 상세페이지 - 시연영상

 - 수정

[BoostCourse] 웹개발 - Handler 라이브러리를 활용한 Template 작업

 - handlebars.js 라이브러리 등록

[ 1. 단일 데이터 ]

[ 2. 단일 데이터 + 다중 댓글 ]

[ 3. 다중 데이터 동적 조작 ]

See the Pen BvYpEe by seokrae (@seokrae) on CodePen.

[ 4. 다중 데이터 핸들러 생성 ]

See the Pen QzQpLb by seokrae (@seokrae) on CodePen.

[장난감] VAMILO VA87M PANDA EDITION

 - 기계식 키보드 저소음 적축

키보드가 필요 했다. 사무실에서 엔터, 스페이스 칠때 세게 치는 경향이 있어서 소리가 안나는 키보드를 찾아보았다.

소리가 적은 키보드 방식

추천 받은 브랜드

타건 매장가서 직접 쳐보는게 100%이긴하지만...

유튜브 타건 동영상을 며칠에 걸쳐서 마음에 드는 소리를 찾아봤는데 레오폴드와 바밀로소리가 그나마 괜찮았다.

바밀로 매화가 독특했지만 너무 핑크핑크하고 다크그레이는 때가 덜 탈것 같기도 하지만 칙칙해서 그냥 바로 판다 에디션을 질렀다.

잘 산건지는 두고봐야 겠지만.. 저소음 적축 소리가 부드러워서 좋다.

 - 펀키스 공식 사이트

 - 바밀로 구매 사이트

[키보드 세트]

 - VA87M 키보드

 - 연결 선

 - 키캡 여분

 - 인형(?)

 - 장패드

충격이었던건.. 장패드 없는 줄 알고 따로 주문했는데. 판다 에디션용 장패드가 있더라...

판다 에디션에 판다인형이 있다면 매화 에디션에 뭐가 들어있을까 궁금하네 갑자기..

[키보드 테스트]

 - 바밀로 키보드 테스트 사이트

기계식 키보드를 구입하면 처음으로 해야하는게 제대로 작동되는지 테스트가 필요하다고해서 찾아보니 

바밀로는 자체적으로 테스트 사이트가 존재하더라(다른 브랜드는 있는지 안써봐서 잘...)

혹시나 잘못 눌러서 키보드 기능을 잘못 켰을까봐 키보드 옵션부터 찾아보았다.

처음에 이것저것 눌러보다가 윈도우 키 잠금, Fn키 잠금을 걸어서 다시 푼다고 시간을 썼다...

[키보드 기능 및 단축키]

 - 바밀로만의 키보드의 특수 기능, 기능잠금, 켬

 - 노트북을 위한 Function Key 키 관련 기능

 - 백라이트(?)가 필요할 지는 모르겠지만 기능에 있다.

[API Document] Swagger

Swagger란?

 - Web API 문서화 도구
 - API들이 가지는 명세(Spec)을 관리하기 위한 프로젝트

Swagger의 기능

1) API Design
2) API Development
3) API Documentation
4) API Testing
5) API Mocking and Virtualization
6) API Governance
7) API Monitoring
8) OpenAPI & Swagger

Web API를 만들지 않고 명세화하기 (Guide)

Create new API (Link)
 1. 왼쪽 사이드 바에서 Create New API를 누르고 선택

 2. API 정보를 입력해야 하는 대화 상자가 표시됨

 3. Create API 누르기

Code Editor

1. 상단 프로젝트 제목 및 설명

2. get method

3. post

4. Models

[문서정리] 에버노트

내게 필요한 기능

[일상]

 - 하루 업무 정리

 - 주간 업무 정리

 - 연간 스케줄 관리

[개인]

 - 개인 프로젝트 작업 정리

 - 블로그 게시물 작업 정리

[회사]

 - 회의록

 - 회의안건

 - 프로젝트

 - 일간 보고

 - 주간 보고

 - 월간 보고

 에버노트 툴을 활용해서 업무의 효율성을 높일 수 있도록 해보자

[플래너 작성]

월

 - 한 달의 목표치를 설정 후 주별로 분량 조절한다.

주

 - 한 주에 정해진 학습 분량을 일간 단위로 자세하게 계획을 세운다.

 - 한 주에 계획을 세울 때 중요도를 체크하여 실천가능한 순으로 분류한다.

일

 - 일간 단위로 계획을 세울 때 무리하게 세우는 것보다는 내가 할 수 있는 선에서 계획을 세운다.

 - 하루 계획을 세웠다면 구체적으로 해야하는 일의 양을 정한다.

[블로그 작성]

 - Headline(제목) 작성시 '도입부'를 읽도록 유도하는 역할

 - Opening(도입부) 작성, 본문의 3~4 문장을 읽음으로 본문 전체를 다 읽도록 하기 위함

 - Half-Width Image(이미지), 라인당 글자수(character per line)을 줄여 독자가 글을 읽는 것이 수월해지도록 함

 - Sub-Head1(소제목1)은 첫 번째 단락을 읽게 하는 역할로 본문에서 무너가 얻는 만한 정보가 있다는 확신을 심어주는 역할

 - CTA1(콜투액션1)은 본문에 대한 요약문장을 제공하거나 트위터, 페이스북 등의 공유 버튼을 삽입으로 백링크^[각주:1]로서의 역할을 함

 - Sub-Head2(소제목2)은 구체적이고 확실한 해법·결론을 제시하면서 마지막 단락으로 이어지게 함

 - Content2(본문2)은 단순하고 실행 가능한 해법을 제시함으로써 독자들에게 확실한 소득을 안김

 - CTA2(콜투액션2)은 포스팅의 최종목표(구매, 가입, 구독) 등으로 글을 마무리

참고사이트 - http://www.marketology.co.kr/seo/블로그-글-작성-요령-기본-포맷-이해하기/

[개인 프로젝트]

 - 프로젝트 미션

  - 비즈니스 문제를 해결하기 위한 목적(Purpose)

 - 프로젝트 목표

  - 프로젝트에서 생성할 제품이나 서비스의 내용을 기술

  - 프로젝트 미션을 달성하기 위해 구체적으로 무엇을 해야 하는지, 무엇을 제외해야 하는지

 - 프로젝트 성공 기준

  - 비즈니스 가치(Value)를 구현

- 개별 프로젝트

[회의]

 - 회의 안건

 - 회의록