728x90 티스토리챌린지11 삭제 기능 만들기 2 (Ajax 추가 내용과 에러 처리) 0:47 삭제기능 만들어오라던 숙제를 같이 해보도록 합시다.나중에 혼자 코드짤 때도 제 코드 따라칠 것입니까 잘 안되어도 혼자 이것저것 뭐라도 해보는 과정에서 실력이 늡니다. 코드 따라치는건 학습이 아니고 타이핑 실력만 향상됩니다.기능부터 한글로 설명해보면 1. 삭제버튼 누르면 서버로 삭제요청 보냄 (URL, method도 정하기)2. 근데 어떤 게시물 삭제할지 게시물 _id도 보내야 삭제를 정확히 잘해줄듯요 3. 서버는 요청 들어오면 DB에서 그 게시물 삭제해줌 이러면 될 것 같으니 이거 그대로 코드로 옮겨봅시다. 1. 삭제버튼누르면 서버로 삭제요청보냄 ajax 이용해서 삭제버튼을 누르면저 URL (/api/post/delete) 로DELETE 메소드로 요청을 보냄. 이제 저 경로로 요청하면 서버 기능을 실행하.. 2024. 11. 11. 삭제 기능 만들기 1 (Ajax) 글마다 삭제버튼을 만들고누르면 글을 DB에서 삭제하는 기능을 만들어봅시다.작성, 수정기능 만들 때 했던 내용과 비슷할 것 같아서 여러분이 알아서 하면 되는데 근데 이번엔 삭제시 글목록에서 글이 사라지는 UI 애니메이션같은걸 넣어봅시다.저기다가 버튼을 각각 만들고 그 다음에 버튼을 누르면 글이 삭제가 되는 기능을 만들어 볼 것. 삭제버튼누르면 애니메이션 넣으려는데 ▲ 글목록에 삭제버튼 하나 만들고삭제버튼 누르면 그게 담긴 박스를 서서히 사라지게 만들자는겁니다. 근데 그런 애니메이션을 만들기 위해선 자바스크립트 기능이 좀 필요할 것 처럼 보임. 저기 list/page.js 로 간다음에 저 내용들을 클라이언트 컴포넌트로 좀 바꿔줘야 할 것 같음. list/page.js 파일에다가클라이언트 컴포넌트로.. 2024. 11. 10. 수정기능 만들기 2 저번시간 숙제로 내드린 기능을 완성해봅시다.답안 따라쳐봤자 손가락만 아플 뿐이고혼자 몇시간 부여잡고 검색하고 삽질해봐야 실력이 늡니다. 실제 코딩도 검색하고 삽질하면서 하지 않습니까 심심해서 Navbar 만들어봄 Appleforum List layout.js에 이런거 추가했고= Link 태그 쓰니까 상단에 import 필수. .navbar { background: white; padding: 20px;}.navbar a { margin-right: 10px; text-decoration: none; color: black;}.logo { font-weight: bold;}globals.css에 이런거 추가해서 상단바도 만들어봤습니다. 수정기능 완성해오라던 저번시간 숙제를 해보자면 전송버.. 2024. 11. 9. 수정기능 만들기 1 글 수정기능은 어떻게 만들죠?직접 글 수정기능이 어떻게 동작하는지 자세히 한글로 정의하고그거 그대로 코드로 옮기면 된다고 했습니다. 그럼 혼자서도 코딩가능그 기능이 어떻게 동작하는지 모르면 언제나 유사한 다른 사이트 참고하면 됩니다. 다른 사이트 게시판들은 1. 글마다 있는 수정버튼누르면 수정페이지로 이동함 (수정페이지 URL도 정해야할듯)2. 수정페이지는 글작성페이지랑 비슷하게 생겼는데 기존 글을 DB에서 불러와서 넣어줘야함 3. 전송버튼 누르면 DB에 있던 document를 작성내용으로 수정하면 됩니다.근데 유저가 DB 데이터를 직접 수정하면 큰일나니 서버에 수정을 부탁하는 식으로 코드짭시다. 이거 그대로 코드로 옮기면 되겠군요. 다 배운거라 MongoDB 안에 있는 데이터 수정하는 법만 찾아보면 .. 2024. 11. 8. 헷갈리는 GET, POST 쉽게 정의 GET 요청 ( 정보를 받는 요청 / 데이터 가져오기 )의미: 서버에 정보를 요청해서, 서버에 있는 정보를 받아오는 방식이다.예시: 뉴스 웹사이트에 접속해서 기사를 볼 때, 브라우저가 서버에게 “기사 좀 보여줘!”라고 요청하는 것이 GET 요청.POST 요청 ( 정보를 보내는 요청 / 데이터 보내기 )의미: 내가 새로운 정보를 서버에 보내서 서버가 그 정보를 저장하거나 처리하게 만드는 방식이다.예시: 회원가입 시 이름, 이메일 등의 정보를 서버에 저장하고 싶을 때, “이 정보를 추가해줘!”라고 요청하는 것이 POST 요청.요약GET 요청: 서버에 있는 정보를 받아오는 요청.POST 요청: 새로운 정보를 서버에 보내는 요청.간단한 비유 정리GET 요청: "책을 빌려오는 것" (서버에서 데이터를 가져오기)P.. 2024. 11. 7. 이전 1 2 다음 728x90
