코딩일지/WIL: Weekly I Learned

20221030 WIL

야언 2022. 10. 30. 22:01

이번 주 배운것

  • 장고 심화 - 1~5주차

 

장고 심화

 

  • DRF ( django rest framework)
  • 포스트맨
  • HTTP의 작동 방식과 흐름
  • 시리얼라이저, json
  • 토큰방식 로그인 vs 세션방식 로그인
  • 로컬스토리지 vs 쿠키
  • JWT(Json Web Token)
  • 미디어파일 / 스태틱파일 

 

 

 

 

 

 

 

 

 

 

 

더 알아야 할 것

 

DRF를 통해 백엔드와 프론트엔드를 확실하게 나누고, 자바스크립트를 통해 프론트엔드에서 요청을 보내는 방식은 알겠는데 JS에 대한 지식이 턱없이 부족한것같다.. 일단 수박겉핥기 식으로 js를 통해 데이터를 프론트엔드에 불러오는 방식을 배우긴 했는데..

 

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>프론트엔드</title>
    <script src="index.js"></script>
</head>
<body>
    <h1>프론트엔드</h1>
    <div id="articles"></div>
</body>
</html>

 

index.js

window.onload = async function loadArticles(){
    const response = await fetch('http://127.0.0.1:8000/articles/', {method:'GET'})

    response_json = await response.json()

    console.log(response_json)

    const articles = document.getElementById("articles")

    response_json.forEach(element => {
        const newArticle = document.createElement("div")
        newArticle.innerText = element.title
        articles.appendChild(newArticle)

    });


}

 

 

 

 

요런식으로 js내에서 method 요청을 보내서 데이터를 띄우는 정도와 버튼에 onclick기능으로 함수를 호출해 로그인, 회원가입 등의 기능을 적용시키는 정도.. render, redirect를 사용해서 구현하던 기능들까지 js를 통해 다룰려면 아직 공부가 많이 필요할 것 같다..

 

 

 

프론트엔드 예시 영상 너무필요함 ㅠㅠ