에스알닷컴

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

 - 이전 글

 - 다음 글

 - Pass

 - Feedback

FeedBack 중

이래저래 일이 많아서 이제야 통과합니다...

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

 - 이전 글

 - 다음 글

 - 기능 구현은 했으나 상세부부분을 수정해서 다시 제출하도록 한다.

 - 구현 방식을 정리

Project3 설정 및 구조 설계.pdf

1. List<DTO> 방식으로 JS에서 리턴받아 String 방식으로 처리했으나 Map 방식으로 API 수정

 - /api/promotions

 - /api/categoeis

- /api/products

2. API 호출과 결과값을 받는 JS 쪽 구조 변경

 - 공통 모듈로 사용할 수 있는 코드로 최대한 작성

3. 자바스크립트 구조 변경 및  Promotions 캐러셀 슬라이드 구현

 - 작성중

 - 찾아본 참조 사이트

  1) https://freefrontend.com/css-carousels/

  2) http://hong.adfeel.info/frontend/%EA%B0%84%EB%8B%A8%ED%95%9C-carousel-%EC%98%88%EC%A0%9C/

  3) https://www.cssscript.com/top-10-javascript-css-carousels/

 - 결국 그냥 내가 하던데로 하게됨... CSS 적용 되게 하기가 힘듬..

자바스크립트 구조

1. commons.js, validations.js, ajax.js

2. scriptStart.js

3. categories.js, promotions.js, products.js

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

 - 이전 글

 - 다음 글

리뷰 결과 -> Fail

다시 제출

1. 슬라이드

  - 캐러샐 방식으로 구현해야 하는데... 다시 하게 되었다...

 2. Java 컨벤션

  - 내가 보기편하려고 띄어쓰기로 여러 줄 맞춰 놓은게 문제가 될 줄이야...

 3. .gitIgnore 파일 생성

  - eclipse workspace에 생성해 놓았다.. 프로젝트 안에 생성해야 하는데 그 위에 생성해 놓았을 줄이야..

 - 코드 리뷰

 * 찾아본 코드 컨벤션

  - 코드 컨벤션에 대한 피드백은 뭐가 맞는지 잘 모르겠다.

https://www.oracle.com/technetwork/java/javase/documentation/codeconventions-141270.html#18761

 5. 주석!?!?

 6. js 파일명.. 

 7. 스크립트쪽 주석

  - 그래.. 가독성이 안좋을 수 있지.. 제출할 땐 지워야 겠네..

 8. 이건...

   - Oracle nvl 함수의 기능을 생각한거였는데 ...

   - null이 아니면 그 문자열 그대로 출력하기 위함

   - 유효성 검사를 위한 함수는 아니었기에 피드백에 의아함을 느낀다..

9. 추가로 공부해야 할 사항

 - JUnit Test를 공부할 것

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

 

 

프로젝트 3 (메인페이지) - 요구사항 정의서.xlsx

다운로드

 

[요구사항 - 기능 요구사항]

[요구사항 - 기술 요구사항]

[요구사항 - 코드 작성 규칙(FE)]

[요구사항 - 코드 작성 규칙(BE)]

결과 화면

 - 부족한 점

 1. 슬라이드 캐러셀로 구현해야함

 2. 자바스크립트 부분에서 반복되는 부분 줄여야 함

 3. 언어간 데이터 전달은 오브젝트로 할 것

 4. 무조건 JSP로만 해야한다는 생각을 버릴 것 (어떻게 하든 방법은 많으니...) 

 5. 부족한게 너무 많다..

 - 프로젝트 3. 예약관리 시스템: 메인페이지 - 시연영상

[BoostCourse] 프로젝트 2 : To-Do List 구현

긴 기다림 끝(아마 갑자기 제출한 사람이 늘어서 그런듯)에 리뷰 결과가 왔습니다.

제출한 프로젝트의 피드백을 상세하게 써주셔서 무엇을 고쳐야 하는지 알게 되었습니다.

[BoostCourse] 오프라인 스터디

피드백을 받는 것도 좋지만 진행하면서 내가 생각한 것 외에 이런저런 생각을 들어보면서 진행하고 싶어서

7월 시작부터 부스트코스 오프라인 스터디를 시작습니다.

To-Do List Project 2를 Pass 했지만 스터디에서 "어떻게 생각하고 코딩했는지"에 대해서 이야기 하면서

 - Event Listener를 더 효율적으로 쓸 것

 - 중복되는 소스를 공통 작업으로 할 수 있는 로직으로 바꾸기

 - 반복되는 함수의 호출을 줄여 메모리를 효율적으로 사용하기

등에 대해서 들어, 이미 완료 했더라도 다시 생각해 보고 수정하는 시간을 갖고 있습니다.

프로젝트 2까지는 그나마 강의 들으면서 그 내용을 이용하면 되지만 

프로젝트 3은 지금까지와는 다른 수준의 프로젝트라 스터디를 많이 이용해서 진행해야 할 것 같습니다.

[BoostCourse] 프로젝트 2 : To-Do List 구현

리뷰 결과 -> Fail

또 Fail

> 다수의 사용자가 사용할 수 있는 프로그램이라 가정하지 않고 코드를 짜다보니 이런 문제가 생겼다.

> 이런 해결 방법까지 가이드 해주신다. 

! 아 그래서 TODO에 있는 카드를 한번 눌렀을 때 DOING과 DONE 컬럼에 모두 생기는 오류가 발생 할 수도 있구나

[BoostCourse] 프로젝트 2 : To-Do List 구현

리뷰 결과 -> Fail

어떤 문제가 있는지 확인해보자

1. 화면 레이아웃

 - 여백을 구현할 때는 br태그 대신 CSS로 구현 할 것을 권장

 > 확인 및 수정됨 (br 태그 삭제 후 CSS margin을 이용하여 여백을 구현)

2. 메인페이지 - 카드노출

 > DB 쿼리문을 descending > default(ascending)으로 바꿔 각 컬럼당 먼저 등록된 순서로 노출 확인

3. 메인페이지 - 카드이동

4. Event, DOM, Ajax의 표준 API사용

5. Servlet

> parentElement.parentElement와 같은 중복 함수를 사용에서 closest() 함수를 이용하여 한번에 상위 엘리먼트를 찾음

6. 그 외에 수정이 필요한 부분

 > CSS rgb()에서 16진수로 수정 완료

 > CSS inline-block으로 처리한 부분을 모두 float로 처리 (position:absolute, float:right ...) 이러한 속성을 추가

 > 사용되지 않는 태그들의 스타일 지정 삭제 완료

> parentElement.parentElement와 같은 중복 함수를 사용에서 closest() 함수를 이용하여 한번에 상위 엘리먼트를 찾음

> 완료된 기능의 로그 주석처리

[부스트코스] 프로젝트2: To-Do List 구현