본문 바로가기
728x90
반응형

분류 전체보기185

날짜와 시간다루기 jsonobject.tistory.com/191 2021. 1. 1.
[프로젝트] 팝업창으로 지도 띄우기 12/30 분실물을 등록할때 위치를 등록해줘야하기 때문에 팝업창을 띄워서 지도를 띄워줬다. 허용버튼을 누르면 아래와 같이 내위치 정보를 불러온다. 원하는 위치로 지도를 이동해서 클릭하면 마커가 생기면서 그 위치의 주소를 띄워준다. 카카오api를 사용해서 지도를 띄워주는거 까진 순조롭게 성공했는데.. 산넘어 산이다.. 2020. 12. 31.
[Spring] DTO 와 VO DTO(Data Transfer Object) DTO(Data Transfer Object)는 데이터 전송(이동) 객체라는 의미를 가진다. DTO는 주로 비동기 처리를 할 때 사용한다. 계층간 데이터 교환을 위한 객체(Java Beans)이다. DB의 데이터를 Service나 Controller 등으로 보낼 때 사용하는 객체를 말한다. 즉, DB의 데이터가 Presentation Logic Tier로 넘어올때는 DTO로 변환되어 오고가는 것이다. 로직을 갖고 있지 않는 순수한 데이터 객체이며, getter/setter 메서드만을 갖는다. 또한 Controller Layer에서 Response DTO 형태로 Client에 전달한다. VO(Value Object) VO(Value Object)는 말 그대로 .. 2020. 12. 30.
[프로젝트] 게시판 등록 - input box 숫자 체크 12/28 사례금 직접 입력시에 숫자만 입력받아야 하기 때문에 숫자가 아닌 문자는 입력되지 않게했다. 열심히 검색해서 이 방법 저 방법 다 써봤는데 이 방법이 제일 간단했다... 후..!! input box에 숫자만 입력받기 또, 아무래도 금액을 입력하는 칸이라서 천단위로 ,를 생기게 해주고 싶었다. (1,000 / 100,000 / 1,000,000) 입력받은 값에 콤마 생성하기 function cmaComma(obj) { var firstNum = obj.value.substring(0,1); // 첫글자 확인 변수 var strNum = /^[/,/,0,1,2,3,4,5,6,7,8,9,/]/; // 숫자와 , 만 가능 var str = "" + obj.value.replace(/,/gi,''); /.. 2020. 12. 29.
[프로젝트] 게시판 등록 - radio, select (활성화, 비활성화) 12/28 분실 물품을 선택할 때 한가지 물품만 선택할 수 있고, 기타를 체크했을때 직접입력 할 수 있는 인풋 박스가 활성화 되게 바꾸기. 한가지 물품만 선택할 수 있게 하는 방법은 기존에 사용했던 checkbox 를 radio로 바꿔주니 간단하게 해결됐다. 기존코드 * 분실 물품 핸드폰 지갑 가방 책 화장품 기타 변경코드 * 분실 물품 핸드폰 지갑 가방 책 화장품 기타 변경 후 모습 몇시간을 고민했는데 생각보다 아주 간단했다.ㅠㅠ후 사례금 선택 부분도 무료글일땐 사례금 selectbox가 활성화 되지 않고 비활성화 되어야하니, 위와 같은 방법으로 코드를 변경했다. 기존코드 사례금 무료글등록 사례금등록 선택 10,000원 30,000원 50,000원 100,000원 직접입력 기존 모습 변경코드 사례금 무.. 2020. 12. 28.
[CSS] 선택자 선택자는 html 파일을 만들고 태그에 스타일을 줄 때 사용한다. 선택자의 종류 전체 선택자 * { margin: auto; } - 모든 태그에 대하여 적용. 하지만 이 방법은 테스트 용도로만 사용하길 권장한다고 함. 태그 선택자 h1 { color: green; } - h1 태그에 대하여 적용. 클래스 선택자 .className { width: 50px; } - .클래스이름 으로 사용. 아이디 선택자 #idName { position: fixed; } - #아이디이름 으로 사용. 복합 선택자 하위선택자 section ul { text-shadow: none; } - 선택자 사이를 공백으로 나타내며 앞 요소의 자손인 뒷 요소를 선택. 자식선택자 section > ul { text-shadow: none;.. 2020. 12. 28.
[프로젝트] 게시글 등록 화면 만들기 - 2 12/27 오전부터 다시 시작한 작업. 어제까지 상태.. 더보기 padding 을 통해서 아직 부족하지만 전보다는 조금은 정리가 됐다. 오후 내내 끙끙거리면서 대충 정리가 됐다. 근데 분실위치 항목에 인풋박스 옆에 있어야할 인근이라는 글자는 왜 밑으로 가있는걸까.... 결국 도움을 받아서 성공했다!! 더보기 수직축 방향 정렬 align-items stretch (기본값) 아이템들이 수직축 방향으로 끝까지 쭈욱 늘어납니다. flex-start 아이템들을 시작점으로 정렬합니다. flex-direction이 row(가로 배치)일 때는 위, column(세로 배치)일 때는 왼쪽이에요. flex-end 아이템들을 끝으로 정렬합니다. flex-direction이 row(가로 배치)일 때는 위, column(세로 배.. 2020. 12. 27.
[Javascript] Ajax Ajax(Asynchronos Javascript And XML) - 자바스크립트를 통해서 서버에 데이터를 요청하는 것 - 새로고침을 할 필요없이 부분 부분만 로딩되므로 속도가 빠름 -비동기식 동기식 / 비동기식 차이 동기식은 대표적인 예로 우리가 웹사이트 로그인을 할 때 아이디와 패스워드를 입력하여 서버로 전송하고 서버로 부터 응답을 받은 후 로그인 성공, 실패 웹페이지로 이동하는 것, 서버로 데이터를 요청하고 응답이 오는 시간동안 작업을 멈추고 기다리는 것을 뜻함. 비동기식은 서버로 데이터를 요청하고 응답이 오는 시간동안 웹은 자신의 다른 업무를 진행하고 응답이 오면 그 후에 작업을 하기때문에, 사용자의 입장에서는 화면 갱신이 없어 편리하고 빠르게 작업을 처리하는 것처럼 느껴짐 GET / POST 차.. 2020. 12. 27.
[프로젝트] 게시글 등록 화면 만들기 - 1 12/26 오늘 오후부터 본격적으로 만들기 시작한 게시글 등록 화면.. css 공부를 나름 한다고 하긴 했는데 막상 사용하려니 뭘 써야할지 잘 모르겠다. 이렇게 엉망진창인거 하나 만드는데도 굉장히 많은시간이 걸렸다. 부트스트랩 사용해서 버튼과 input 박스를 변경했는데 위치들이 또 이상해졌다.. 내일은 더 그럴싸하게 수정해보자 더보기 DOCTYPE html> Document .header { background-color: black; height: 150px; } .container { margin-left: 300px; margin-right: 300px; width: 950px; } .item1 { display: flex; justify-content: space-between; border-b.. 2020. 12. 27.
728x90
반응형