250904 TIL

 

❗어떤 문제가 있었는지

• API AJAX 과제를 진행하며  상세페이지 구성에서 id 값을 적용시키지 못해 값을 불러오지 못하는 현상이 있었음
• innerHTML 등 속성에 대한 이해도가 부족해 출력되는 과정이나 결과값에 대한 이해도가 부족했음

---

📝 내가 시도해본 것들

• fetch 기능을 통한 API 값 호출 및 응답과정이 매끄러울 수 있는지에 대한 개념 공부를 진행

---

💡어떻게 해결했는지

• id 값을 임의의 API 입력값으로 대체해 상세 페이지 내용을 구성할 수 있도록 진행하였음
• 진행 내용에 대한 정리가 필요하여 후에 내용을 보강할 예정 

---

👍 무엇을 새롭게 알았는지

• 어제 느꼈던 바와 마찬가지로 기존 활용 CSS 코드나 BODY 내 코드 구성들을 활용하면 화면 구성을 보다 빠르게 할 수 있는점이 좋았음
• 이외에 비슷한 형태의 기능을 한두개씩 덧붙여야 할 경우 적용방식이나 노출되는 결과값의 변화를 일부 줄 수 있었음
  
  
• .test() 는 자바스크립트 객체에 있는 메서드
  
  • 문법 : 정규식.test(문자열)
  • 결과 : true 또는 false
  • 의미 : 문자열에 정규식 패턴이 매칭되는 부분이 있으면 true 값을 돌려줌
• 적용방식
  • 조건에 따른 문자를 추가하거나, 색을 변경하는 등 값을 불러오고 상황에 맞춰 다양한 결과값을 만들어내는 과정을 도출해낼 수 있었음
• .innerHTML : 요소 안쪽에 들어가는 HTML 문자열 전체를 읽거나 바꿀 수 있는 속성
  • 금일 진행했던 학습내용에서는 $tbody(테이블 내 입력된 값을 나타내는 임의의 DOM 요소) 중 필요한 값(데이터 필드)들을 각 행열(셀)에 맞춰 값을 부여한 개념이라고 보면 된다.
  • 그래서 마지막 기분을 나타내는 구역에 기본적으로 등록 간 입력했던 입력값과 조건에 맞춰 추출된 이모지를 같이 넣을 수 있었음
• 전일자 학습했던 Postman 서버로 Mock server의 작동원리를 검증하는 과정을 거쳤다면 오늘은 실제 코딩으로 원하는 값들을 API로 POST하고 GET 하는 과정들을 이해할 수 있어서 좋았음