이번 시간에는 Node.js기반의 Ajax 통신의 꽃 Axios를 배워보겠다 Node.js기반으로 움직이는 것들은 대부분 사용 가능하다고 생각한다 1. Axios Install 하기 npm install axios 2. Axios Import App.js에서 아래의 코드를 입력한다 import axios from 'axios' 3. 데이터 준비 아래의 링크에서, 간단하게 받아올 데이터를 준비한다 https://jsonplaceholder.typicode.com/ JSONPlaceholder - Free Fake REST API {JSON} Placeholder Free fake API for testing and prototyping. Powered by JSON Server + LowDB As of D..
이번 시간에는 댓글을 삭제하는 기능을 만들어 보겠다 이번에도 Ajax를 이용한다 앞서 【삭제】 버튼의 함수를 확인해보자 그리고 Java Script에 함수를 적어보자! 함수를 만들어준 다음 Ajax를 추가한다! 그다음 path와 view를 만들어 준다! urls.py views.py ID를 넘겨서, 그 ID를 이용해 reply 객체를 찾고, 그다음 delete() 함수를 이용해 삭제를 한다 그리고, 완료했다는 메시지? 를 보낸다 이제 HTML에서는 동적으로 댓글을 삭제하기 위해서 요소를 찾게끔 tr태그에 class를 붙여주자 그다음은 Ajax의 성공 부분으로 간다 ok일 때만 실행되게 하고, tr요소를 찾아서 remove() 함수를 이용해 tr태그를 제거하는 코드를 작성한다 이제 브라우저에서 확인하자! ..
이번 시간에는 Ajax를 이용해서 댓글 수정을 해보겠다 일단 【수정】 버튼을 만들어 준다. 삭제도 나중에 추가할 거라서 【삭제】 버튼, 【취소】 버튼 등을 만들어 주도록 한다 {{ item.id }} 를 이용해서 class명을 고유하게 번호 ( reply의 Id )를 붙여 준다 ( 그래야 선택한 요소를 찾을 수 있음 ) onclick=함수에도 고유한 번호 ( reply의 Id )를 넘겨 주도록 한다 그리고 【진짜 수정】 버튼과 【취소】 버튼은 처음에는 안 보이도록 하게 한다 {% if item.member.id == session %} {% endif %} 이거 같은 경우는 게시판의 【수정】, 【삭제】, 【진짜 수정】, 【취소】와 다를 것이 없다 그리고, onclick에 있는 함수 이름 그대로 함수를 작..
원래 13강으로 마무리 짓고 끝내려고 했는데 댓글 정도는 필요할 거 같아서 한번 해보겠다 일단 댓글 테이블이 필요할 것이다, 그러니 한번 만들어보자 content : 댓글 내용 member : 누군인가? 댓글적은 사람이 누구인가 말인가! board : 어떤 게시글인가? 어떤 게시글에 적었냐 말이다! 이렇게 model를 생성하고, terminal에서 코드를 입력하자 그래야 자동으로 적용이 되고 자동으로 테이블을 생성해 줄 것이다 python manage.py migrate 그리고 상세화면 HTML로 가서 코드를 작성해 준다 브라우저를 보면 아래 화면과 같이 폼이 생겨날 것이다 디자인은 신경 쓰지 말자 우리는 개발자이니깐 ㅠ 그리고 해야 할 일이 어떤 방식으로 전송할 것인지 정해야 한다 나는 Ajax로 전송..
이번 시간에는 Django에서 비동기식 통신을 해보려고 한다 흔히 Ajax라고 하더구나 Ajax는 보통 JQuery에서 쓰이는 $.ajax 를 많이 쓰더라 그래서 이번에는 JQuery의 Ajax를 이용한 비동기식 통신을 해보겠다 일단 Test 할 페이지를 만들어 보자 일단은 입력값을 넣어서 버튼을 눌렀을 때 POST형식으로 데이터를 주고받게끔 하겠다 중요한 점은 JQuery라이브러리를 넣어주자 그리고 친절하게 body 안에 있는 코드를 넣어주겠다 반갑다능 ★ 이제 Ajax를 쓰기 위해 Java Script코드가 필요하다 처음 할 때는 꾀나 어려울 것이다. ( 본인은 Ajax 통신하려고 3일 고생했었음.ㅠㅠ ) 버튼을 눌렀을때 실행되는 함수를 만들어주기 위해, 버튼 요소를 찾아준다 let btnAjax =..
