ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 항해 99 5기 TIL_21
    항해 99 2022. 1. 30. 16:56

    ▶ Today I Learned

     

    <홈페이지 구현>

     

    [404 Error]

    : 클라이언트가 서버와 통신은 가능하지만 클라이언트가 요청한 것을 서버가 찾을 수 없다는 것을 가리키는 HTTP 표준 응답 코드,

    대상 서버로 연결할 수 없다는 뜻은 아니니 혼동하지 않도록 주의하자.

     

    [스키마 모델의 연결]

     

    현재 DB에 있는 데이터를 불러와 index.html에 보내줘서 게시글 정보를 띄우려 작업 중이다.

    먼저 데이터가 정상적으로 전송되는지 시도해보았으나 connection Error가 발생했다.

    콘솔을 구간별로 찍은 결과 다음의 코드에서 get 요청이 router에 닿지 않았고 이로 인해 연결에러가 뜬 것 같다.

    index.html 코드

    $(document).ready(function () {
          
          console.log("홈페이지 시작");
          axios.get("/api/showPostings")
            .then(function (response) {
              // response  
            console.log(2)
              console.log(response)
            }).catch(function (error) {
              // 오류발생시 실행
              console.log(3)
              console.log(error)
            })
    });

    라우터 페이지 코드

    /* 게시글 목록 메인페이지에 넘겨주기 api */
    
    router.get ("/showPostings", async (req,res) => {
        console.log(1)
        const postings = await postings.find() // DB에서 찾아 조회 // 당연히 이 역시도 비동기 처리를 해주어야 한다.
        console.log(postings)
        
    
        res.json ({ postings });
        });

     

    특이한 점은 postings.find()의 postings를 클릭하였을 때 하단의 코드에 있는 postings에 불이 들어오지 않았다.

    const postings = require("../schemas/postings");

    하지만 내가 짠 저 router.get을 제외한 다른 라우터 코드내부에서 쓰는 postings라는 모델을 클릭했을 때는 postings라고

    쓴 것들이 다 같이 연계되어 불이 들어왔다.

    같이 불이 들어온다는 건 IDE환경에서 서로 똑같다는 것을 의미한다.

    실제로 이전에 내가 ajax로 짠 코드에서는 router.get의 postings까지 포함하여 모두 연계되어 불이 들어왔었다.

     

    url주소나 스키마 선언문, axios문법 등을 모두 확인해보았지만 이상이 없어보였다.

    현재 무엇이 문제인진 알 수 없지만 콘솔에 1이 찍히지 않은 것으로 보아 get의 요청이 아예 전달이 되지 않는 듯하다..

    뭐라도 되었다면 req를 받고 콘솔로그1을 지나쳐 다음 구문으로 가야할텐데 말이다..

     

    그러나 vs code의 터미널 창에서는 다음과 같은 에러가 나타나기도 했다.

    ReferenceError: Cannot access 'postings' before initialization

     

    즉, postings라는 것이 초기선언이 되지 않았다는 건데, postings의 불이 연계되어 들어오지 않았다는 것과 관련이 있어보인다..

    아직 문제를 해결하지 못했지만 내일 다시한 번 제대로 살펴보고 문법을 바꾸어 적용해보도록 해야겠다..

     

    ▶ 느낀 점

     

    문제해결에는 생각보다 오랜 시간이 걸리고 그 원인은 대부분 가벼운 것들이다.. 그 가벼운 문제를 해결하기 위해 몇 시간이상을 붙잡는 경우가 허다한데, 개발이란 건 굉장히 많은 요소들을 따져보아야 하기에 가벼워보여도 실제로 해보면 정말 가볍지 않다...

    그래서 지금 이 과정이 자연스러운 것이라 생각한다.

    오늘도 아까 다른 팀원 분의 질문에 4명이서 머리를 맞대고 원인을 찾고있었는데

    원인은 그 팀원 분 께서 코드를 고치고 코드 저장 및 새로고침을 하지 않아서 발생하는 거였다.

    나도 전에 오타하나, 괄호 하나를 빼먹어 코드가 돌아가지 않았단 것을 생각하면 충분히 이해할 수 있는 상황이다.

    그러니 내일도 일어나면 너무 심각하게 생각하지 말고 콘솔 로그 찍은 것과 코드 흐름을 바탕으로

    원인이 될 만한 것을 하나씩 따져보자.

     

    오늘 하루도 고생많았다! 내일도 화이팅팅! ;)

     

    ▶ 공부 시 참고 링크들

     

    https://ko.wikipedia.org/wiki/HTTP_404

     

    HTTP 404 - 위키백과, 우리 모두의 백과사전

    위키미디어 404 페이지 404 Not Found 또는 요청한 페이지를 찾을 수 없습니다. 사이트 관리자에게 문의해 주세요 오류 메시지는 클라이언트가 서버와 통신할 수는 있지만 서버가 요청한 바를 찾을

    ko.wikipedia.org

     

     

     

     

     

     

     

     

     

    '항해 99' 카테고리의 다른 글

    항해 99 5기 TIL_22  (0) 2022.02.01
    항해 99 5기 WIL_3  (0) 2022.01.30
    항해 99 5기 TIL_20  (0) 2022.01.30
    항해 99 5기 TIL_19  (0) 2022.01.29
    항해 99 5기 TIL_18  (0) 2022.01.28
Designed by Tistory.