본문 바로가기

코딩

 (133)
HealthDuo-Thymeleaf 에서의 Context Path 사용방법 컨텍스트 패스(Context Path)란?WAS(Web Application Server)에서 웹어플리케이션을 구분하기 위한 path이다. 다시말해 상대적인 경로이다. 예를들어 JSP 에서 https://zontae.tistory.com/member/new 인 절대 경로가 있으면 /member/new처럼 /member/new를 상대적인 경로로 사용 할 수 있게 도와준다. 이러한 기능은 Thymeleaf에서 어떻게 사용할까. 타임리프는 @{img/error/500.png} 와 같이 @{}를 사용하여 매핑해주면 상대경로로 자동적으로 매핑해준다. 위 코드로 에러페이지로 접속할때 이미지가 나오질않는다. 나오지 않는 이유는 상대경로로 지정했기 때문이다. @{img/error/500.png} 로 지정했으니 에러가난..
HomeTheater - 결제 페이지 쿠폰번호 입력 후 할인 된 금액과 결제할 금액 업데이트 포인트 사용 후 결제할 금액과 할인 내역 업데이트 결제하기를 누르게 되면 카카오 페이 API가 실행된다. let discountratio = 1; //할인률 초기화 let discountsum = 0; //할인 총합 계산 let nowamount = document.getElementById("nowamount").innerText; let count = 0; //쿠폰은 하나만 등록하기 위한 카운팅 let pay_totalprice = document.getElementById("pay_totalprice"); let m_point = document.getElementById("m_point"); //쿠폰 번호입력시 10프로 할인 함수 const ..
리펙토링 - 뒤엉킨 변경 뒤엉킨 변경 소프트웨어는 변경에 유연하게(soft) 대처할 수 있어야 한다. • 어떤 한 모듈이 (함수 또는 클래스가) 여러가지 이유로 다양하게 변경되어야 하는 상황. • 예) 새로운 결제 방식을 도입하거나, DB를 변경할 때 동일한 클래스에 여러 메소드를 수정해야 하는 경우. • 서로 다른 문제는 서로 다른 모듈에서 해결해야 한다. • 모듈의 책임이 분리되어 있을수록 해당 문맥을 더 잘 이해할 수 있으며 다른 문제는 신경쓰지 않아도 된다. 관련 리팩토링 기술 •“단계 쪼개기 (Split Phase)”를 사용해 서로 다른 문맥의 코드를 분리할 수 있다. •“함수 옮기기 (Move Function)”를 사용해 적절한 모듈로 함수를 옮길 수 있다. • 여러가지 일이 하나의 함수에 모여 있다면 “함수 추출하기..
리펙토링 - 가변 데이터 가변 데이터 • 데이터를 변경하다보면 예상치 못했던 결과나 해결하기 어려운 버그가 발생하기도 한다. • 함수형 프로그래밍 언어는 데이터를 변경하지 않고 복사본을 전달한다. 하지만 그밖의 프로그래밍 언어는 데이터 변경을 허용하고 있다. 따라서 변경되는 데이터 사용 시 발생할 수 있는 리스크를 관리할 수 있는 방법을 적용하는 것이 좋다. • 관련 리팩토링 •“변수 캡슐화하기 (Encapsulate Variable)”를 적용해 데이터를 변경할 수 있는 메소드를 제한하고 관리할 수 있다. •“변수 쪼개기 (Split Variable)”을 사용해 여러 데이터를 저장하는 변수를 나눌 수 있다. •“코드 정리하기 (Slide Statements)”를 사용해 데이터를 변경하는 코드를 분리하고 피할 수 있다. •“함수 ..
리펙토링 - 전역 데이터 전역 데이터 • 전역 데이터 (예, 자바의 public static 변수) • 전역 데이터는 아무곳에서나 변경될 수 있다는 문제가 있다. • 어떤 코드로 인해 값이 바뀐 것인지 파악하기 어렵다. • 클래스 변수 (필드)도 비슷한 문제를 겪을 수 있다. •“변수 캡슐화하기 (Encapsulate Variable)”를 적용해서 접근을 제어하거나 어디서 사 용하는지 파악하기 쉽게 만들 수 있다. 변수 캡슐화하기 • 메소드는 점진적으로 새로운 메소드로 변경할 수 있으나, 데이터는 한번에 모두 변경해야 한다. • 데이터 구조를 변경하는 작업을 그보다는 조금 더 수월한 메소드 구조 변경 작업으로 대체 할 수 있다. • 데이터가 사용되는 범위가 클수록 캡슐화를 하는 것이 더 중요해진다. • 함수를 사용해서 값을 변경..
리펙토링 - 긴함수 짧은 함수 vs 긴 함수 • 함수가 길 수록 더 이해하기 어렵다. vs 짧은 함수는 더 많은 문맥 전환을 필요로 한다. • “과거에는” 작은 함수를 사용하는 경우에 더 많은 서브루틴 호출로 인한 오버헤드가 있었다. • 작은 함수에 “좋은 이름”을 사용했다면 해당 함수의 코드를 보지 않고도 이해할 수 있다. • 어떤 코드에 “주석”을 남기고 싶다면, 주석 대신 함수를 만들고 함수의 이름으로 “의도”를 표현해보자. 사용할 수 있는 리팩토링 기술 • 99%는, “함수 추출하기 (Extract Function)”로 해결할 수 있다. • 함수로 분리하면서 해당 함수로 전달해야 할 매개변수가 많아진다면 다음과 같은 리팩토링을 고려해볼 수 있다. • 임시 변수를 질의 함수로 바꾸기 (Replace Temp with ..
HealthDuo-게시글 쓰기 주소을 다중셀렉트 기능을 통해 해당되는 주소를 저장하려고 맨처음 화면을 이렇게 구성했다. 하지만 홈화면에서 주소를 미리 구분하기 때문에 없어도 되는기능 같다. 따라서 아래 처럼 화면을 변경하였다. 해당되는 주소를 상단에 표시해주고 저장하게되면 분당동에 해당되는 게시판에 저장된다.
HealthDuo-home 화면 http://daplus.net/css-%EB%B6%80%ED%8A%B8-%EC%8A%A4%ED%8A%B8%EB%9E%A9%EC%9D%B4%EC%9E%88%EB%8A%94-%EA%B3%A0%EC%A0%95-%EB%84%88%EB%B9%84-%EB%B2%84%ED%8A%BC/ 버튼 크기를 고정하기 위에 링크에서 나온 해결방법을 적용해봤으나 변하지 않았다.... 나중에 다시 고쳐봐야 겠다. 비동기 통신을 통해 지역에 대한 정보로 xx구에대한 정보를 찾고 구에대한 정보로 xx동의 정보를 얻는다. xx동을 클릭하게 되면 xx동에 해당되는 게시판이 보여진다.

티스토리툴바