목록전체 글 (364)
seong
코드 리팩토링 resource에 static 폴더를 만들어준다 앞으로 여기에 css,js,assets등등 필요한 것 들을 넣어 둔다 1. JS 파일 내부에 JS파일 생성 (User를 다루기 때문에 user 생성) 2. 이제 JSP 내부 JS 코드 -> JS 파일로 모두 옮겨주기 script 내부 코드들 모두 Ctrl + x 에 경로 넣어주기 src = "/js/users.js" users.js에 붙여넣기 서버 실행해 개발자 모드로 확인 하기 나머지도 JSP 파일들도 모두 똑같은 방식으로 쭉 실행 JS 코드 내부 실행 함수 메서드화 시켜주기 이 부분을 메서드화 시켜준다. -> Ctrl + x 잘라서 내부엔 메서드만실행 메서드 만들어주기 가장 아래로 이동해 function 메서드명(){} {} 내부에 아까 ..
로그인 만들기 1. Jsp 파일 Form태그 수정 및 Ajax 작성 로그인 2. Controller수정 @PostMapping("/login") public @ResponseBody CMRespDto login(@RequestBody LoginDto loginDto) { Users principal = usersService.로그인(loginDto); if(principal == null) { return new CMRespDto(-1, "로그인 실패", null); } session.setAttribute("principal", principal); return new CMRespDto(1, "로그인 성공", null); } 결과 업데이트 만들기 id 바인딩 시켜서 가져오기(hidden 타입 때문에 클..
Ajax Ajax는 JavaScript로 비동기 통신을 하며, Json데이터를 주고 받을 수 있다. HTML의 부분적인 Reload가 가능하고, 비동기적 통신이 가능 하다. 지금 까지는 Form 태그를 사용해 임시로 데이터들을 통신을 했었다. PUT은 값을 전송을 하지 않고 클라이언트의 요청을 그대로 받기 때문에 Form을 사용할 수 없다. DELETE는 URI에 해당하는 리소스를 제거 하는 요청이기에 Form을 사용 할 필요가 없다. 메서드 FORM태그 전송 AJAX (JS) GET 가능 주소창,하이퍼링크로도 가능 가능 POST 가능 가능 PUT 불가능 가능 DELETE 불가능 가능 가끔 찾다 보면 POST에 Form을 쓰는 사람, Ajax를 쓰는사람이 있는데 모두 사용이 가능하다 Ajax를 통해 Us..
아래 코드를 바닐라, JQuery 두가지 방식으로 객체 생성 해보기 ${id} 1. 바닐라 자바스크립트로 객체 생성 하기. 1 2. JQuery로 객체 생성하기 1
JQuery 참고 사이트 https://www.w3schools.com/jquery/jquery_get_started.asp jQuery Get Started W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more. www.w3schools.com JQuery CDN을 통해 사용 아래 코드를 header사이에 붙여 넣어준다 익명함수( 람다식 ) () =>{} 어차피 실행 될 함수 라면 굳이 이름을 만들지 않고 익..
Node.js 는 간단하게 JS 해석기라고 할 수 있다. 1. Node.js 검색 후 다운로드 - Windows Installer 클릭 2. msi 클릭 - Next 클릭 3. 설치가 완료 되면 cmd를 켜서 node -v 를 입력해 버전 확인 4. JS 작성 let num = 10; console.log(num); 5. 실행 후 결과 확인 node hello.js 실행 중 에러 Visual Studio를 켜둔 채로 node.js를 다운로드 하고 바로 실행 하면 환경 변수를 못잡아 에러가 난다. Visual Studio를 재시작 해두면 제대로 실행이 된다.
JSON의 기본 형태 - { "key" : "value" } 데이터를 다룰 땐 자기 자신의 Object를 만들어 다루는 것이 편하다. 하지만 데이터를 전달할 때는 JSON 형태로 바꾸어 전달 하고 자기 자신의 Object로 변환 해 데이터를 사용 한다. 그럼 전달할 때 자신의 Object -> JSON으로 변환 후 전송 받은 JSON -> Object로 변환 후 사용 하는 방식이 된다. JS Object Json let josonUser =`{ "name" : "홍길동", "age" : " 10", "hobby" : ["축구", "농구"] }`; 콘솔로 확인 콘솔로 확인 해 알 수 있는 점 1. JSON은 모두 문자열 형태이다. Object 데이터 찾는 방법 JSON을 Object로 바꾸기 JSON.pa..
만드는 순서 1. 엔티티 만들기 2. Dao 만들기 3. Mapper(쿼리문) 작성 4. Service 만들기 - 만들면서 필요한 Dto 생성 5. ApiController로 테스트 1. 엔티티 만들기 package site.metacoding.red.domain.boards; import java.sql.Timestamp; import lombok.Getter; import lombok.NoArgsConstructor; import lombok.Setter; @Getter @Setter public class Boards { private Integer id; private String title; private String content; private Integer usersId; private T..