코딩 개발일지

공용으로 사용할 header부분에 햄버거 버튼을 만들고, 그 버튼을 눌렀을 때, 모달이 나오도록 하는게 목표다!!! 그리고 로그인 시 / 로그아웃 시 모달을 다르게 해줄 것이다. 먼저 html에 모달을 달아준다. 디자인도 대충 해주고, 프로필사진도 기본사진을 일단 넣어줬다. 야미야기 ☰ ☰ 로그인을 해주세요 회원가입 로그인 끼리끼 leekh9997@naver.com 글 작성 마이 페이지 회원정보 수정 고객 센터 로그아웃 로그인 했을 때는, 로그아웃 모달을 display=none; 해주고, 반대로 로그아웃 했을 때는, 로그인 모달을 display=none; 해주면 될 것 같다는 생각을 했다. 모달 버튼을 만들 때는, 버튼에 data-bs-toggle="modal" data-bs-target="#myLogo..

index.html 과 index.js 파일을 연결하고 싶을 때, index.html에 script 태그로 연결시켜주면 된다. 이 script 의 위치가 중요한데, head 가장 아래 넣어기도 하고, body 가장 아래 넣어주기도 한다 body 가장 아래 넣어주는게 좋다. (추천) 왜냐하면, html.index 파일에서 위에서부터 읽어오기때문에, body부분에서 index.js 를 사용할 수 있기 때문이다. css 파일을 따로 만들어서 관리할 수 있는데, link:css 태그를 안에서 전에 넣어주면 된다. const mainHeader = document.querySelector('h1') const myList = document.getElementById('my-list') const listItem..

이제 백엔드와 프론트엔드 파일을 따로 관리한다. vscode 두개 켜놓고 작업 고고!!!!!! 백엔드 파일에서는 앞서 배운대로 만들어준다. 프론트엔드 파일에서는 이렇게 만들어주고, api.js에서는 로그인, 로그아웃, 모크api, 회원가입 기능을 백엔드와 html과 연결시킨다. 자바스크립트의 코드가 익숙치 않고, 처음보는것 투성이다ㅠㅠ 따로 공부하라고 한다... var / let / const var : 변수 정의 ( 같은 변수로 선언한게 있으면, 헷갈린다. 다른 결과가 출력) 이걸 보완한게 let과 const let : 변수를 재할당 가능 const : 변하지 않도록 변수 정의 (상수) async / await / Promise / 비동기 처리 async 키워드는 어렵게 생각할 필요없이 await를 사..