본문 바로가기
반응형

전체 글266

메모 삭제하기 - deleteOne 함수 개발 스펙 확인 - DELETE API 사용해서 메모 삭제 Delete API 를 활용하여 메모 삭제 function deleteOne(id) { $.ajax({ type: "DELETE", url: `/api/memos/${id}`, success: function (response) { alert('메시지 삭제에 성공하였습니다.'); window.location.reload(); } }) } 2021. 7. 20.
메모 변경하기 - submitEdit 함수 개발 스펙 확인 - 작성 대상 메모의 username과 contents 를 확인 - 작성한 메모가 올바른지 확인 - 전달할 data 를 JSON으로 바꾸기 - PUT /api/memos/{id} 에 data를 전달 function submitEdit 1. 전과 같은 방법으로, 크롬의 검사를 통해 해당 영역의 id 확인 2. 해당 id로 아래의 코드를 삽입. let username = $(`#${id}-username`).text().trim(); let contents = $(`#${id}-textarea`).val().trim(); 3. 작성한 메모가 올바른지 확인 if (isValidContents(contents) == false) { return; } 4. 전달할 data를 JSON으로 변경 le.. 2021. 7. 20.
메모 조회하기 - GetMessage 함수 개발 스펙 확인 - 기존 메모 제거하기 (전에 로드된 메모 제거) - GET API 사용해서 메모 목록 불러오기 - 메모마다 HTML 만들고 붙이는 함수 만들기 기존 메모 제거하기 1. 개발자 도구를 통해 id값 확인 - card-box 임을 확인할 수 있음. 2. jQuery를 이용하여 기존 메모를 제거한다. $('#cards-box').empty(); 3. 이 함수는 HTML문서를 로드할 때마다 실행해야 하기 때문에 ready 함수 안에 실행되도록 한다. $(document).ready(function () { // HTML 문서를 로드할 때마다 실행 getMessages(); }) 4. Temp HTML 생성 let tempHtml = ` ${modifiedAt} ${username} ${conte.. 2021. 7. 20.
메모 생성하기 - WritePost 함수 생성 개발 스펙 확인 - 사용자가 입력한 메모 내용 확인 - POST API를 사용하여 메모 신규 생성 사용자가 입력한 메모 내용 확인 - 미리 구성해놓은 Html 페이지에서, 사용자가 입력한 메모를 가져와야 한다. - 크롬의 개발자 도구를 통해 텍스트 박스의 id를 가져와서 val을 통해 메모를 가져와보자 POST API를 사용하여 메모 신규 생성 1. jQuery를 사용하여 값을 가져오기 let contents = $('#contents').val(); 2. 메모가 올바른지 판단 if (isValidContents(contents) == false) { // return을 통해 function의 아래 내용을 진행되지 않게 함. return; } 3. genRandomName을 통해 username 부여 -.. 2021. 7. 20.
클라이언트 설계, 구성 클라이언트 설계 접속하자마자 메모 전체 목록 조회하기 GET API 사용해서 메모 목록 불러오기 메모 마다 HTML 만들고 붙이기 메모 생성하기 사용자가 입력한 메모 내용 확인하기 POST API 사용해서 메모 신규 생성하기 화면 새로고침하여 업데이트 된 메모 목록 확인하기 메모 변경하기 사용자가 클릭한 메모가 어떤 것인지 확인 변경한 메모 내용 확인 PUT API 사용해서 메모 내용 변경하기 화면 새로고침하여 업데이트 된 메모 목록 확인하기 메모 삭제하기 사용자가 클릭한 메모가 어떤 것인지 확인 DELETE API 사용해서 메모 삭제하기 화면 새로고침하여 업데이트 된 메모 목록 확인하기 2021. 7. 20.
Timline Project Spring 설계 Domain Package Memo.java package com.sparta.week03.domain; import lombok.Getter; import lombok.NoArgsConstructor; import javax.persistence.*; @NoArgsConstructor // 기본생성자를 만듬 @Getter @Entity // 테이블과 연계됨을 스프링에게 알려줌 public class Memo extends Timestamped { // 생성,수정 시간을 자동으로 만들어줍니다. @GeneratedValue(strategy = GenerationType.AUTO) @Id private Long id; @Column(nullable = false) private String username;.. 2021. 7. 19.
타임라인 프로젝트 계획 타임라인을 구축하는 프로젝트를 시행한다. 타임라인 API (CRUD) 기능 Method URL Return 생성하기 POST /api/memos Memo 조회하기 GET /api/memos List 변경하기 PUT /api/memos/{id} Long 삭제하기 DELETE /api/memos/{id} Long Spring Data JPA 공식 홈페이지 - 자유롭게 Query문을 생성하고 싶을때 - Repository를 변경하고 싶을때 - 예를들어 findAll을 생성시간순으로 정렬하여 찾고 싶을때 등 방법을 찾을수 있다. - 메소드 이름을 잘 맞추어 주면 자동으로 처리해준다. - 아래의 링크는 위의 말한 예시의 방법이 적혀있는 곳이다. Spring Data JPA - Reference Documentat.. 2021. 7. 19.
환경윤리 환경윤리의 시작 ◆ 서양 ▪ Rachel Carson 『침묵의 봄』(1962) : 환경 위기에 대한 인식 시작, 환경에 대한 경각심, 과학의 한계 인식 ▪ Lynn White (논문, 1967) : 환경 위기의 근원은 인간중심주의 → 환경 윤리에 대한 관심 촉발 → 환경윤리학으로 발전 ▪ 유엔환경개발회의 개최(1992, 브라질 리우) : 리우선언, 의제21, 지구온난화방지 협약, 생물다양성협약 등 ◆ 한국 ▪ 반공해운동(1980년대) → 환경운동으로 변화(1990년대) 환경 위기의 원인 1. 인구증가 ▪ 대표자 : 하딘(Garret Hardin), 에리히(Paul. Ehrlich) ▪ 거주지, 식량 수요 증가 → 야생지 파괴 ▪ 이 입장에 대한 제 3세계 학자들의 저항 : 대량생산 대량소비 체제의 화석연.. 2021. 7. 18.
[ 스팀 ] STEAM DECK 발표 안녕하세요! 이번에는 스팀 덱 소식으로 왔습니다. 닌텐도와 닮은 스팀 덱이 발표되었습니다! 스팀의 회사인 밸브가 콘솔 게임기를 개발중이라는 소문이 존재했는데, 이번에 스팀 덱이 발표되면서 사실로 드러났습니다. Valve Steam Deck 발표 APU CPU와 GPU의 혼합 칩을 말하는 용어입니다. AMD 사의 Zen2와 RDNA2 기반의 APU입니다. APU : Zen2 (4c/8t, 2.4~3.5Ghz) + RDNA2 (CUs, 1.0 - 1.6Ghz) PS4 정도의 그래픽 성능이라고 합니다. 디스플레이 - 1280 * 800. 16:10 비율의 디스플레이 - 60hz 화면재생 빈도 - 400니트의 밝기, 조도센서 탑재 - 터치스크린 - 7인치 컨트롤러 - 왼쪽 : D-Pad - 오른쪽 : ABXY .. 2021. 7. 18.
반응형

티스토리툴바