영화 검색 사이트를 개발하면서 발생했던 소소한 이슈와 해결방법들을 정리해보려한다. 리뷰 이슈새로고침 등록, 삭제, 수정을 할 때 변경 사항을 반영하기 위해서 화면을 새로고침하도록 했다. 아래는 수정 버튼 클릭스 발생하는 이벤트이다. 수정이 완료된 후 새로고침을 하여 변경된 데이터를 보이도록 했다. 그러나 너무 대놓고 깜빡이는 현상이 보기 불편해서 다른 방법이 있나 고민하던 중, DOM 을 직접 수정하여 변경 사항을 저장하는 방법이 있는 것을 알았다.saveUpdateButton.addEventListener('click', async () => { if (window.confirm('정말로 이 리뷰를 수정하시겠습니까?')) { const updatedContent = reviewItem.que..
팀 프로젝트를 진행 중.. VScode 로 라이브서버로 파일을 여는데 HTML 이 렌더링 되지 않고 다음과 같은 오류가 발생했다.이상한 것은 완전히 똑같은 코드로 열었는데, 다른 팀원들은 다 잘 열리고 나만 안 열리고 있던 상황.. 이것은 내 쪽에 문제가 있는 게 분명했다...🫥 오류 내용GET https://192.168.45.127:5500/css/main.css net::ERR_SSL_PROTOCOL_ERRORGET https://192.168.45.127:5500/js/script.js net::ERR_SSL_PROTOCOL_ERRORGET https://192.168.45.127:5500/favicon.ico net::ERR_SSL_PROTOCOL_ERRORindex.html:38 WebSoc..
자바스크립트 변수를 선언하는 방법에는 var, let, const 3가지 방법이 있다. 이 세 가지에 대해 알아보자. varvar 은 예전부터 쓰이던 자바스크립트 변수 선언 방식이다. 그러다 보니 문제점도 많다..(?) 재선언 가능var title = "제목1";var title = "제목2";변수를 선언했는데 뒤에서 같은 변수명으로 또 선언이 가능하다. 이러한 특징은 협업할 때 문제가 생기기 십상이다. 누군가가 중요한 데이터를 넣을 변수를 선언했는데 다른 누군가가 같은 이름으로 변수를 선언하고 앞선 데이터와는 다른 데이터를 넣었다고 생각해 보자. 나중에 선언된 변수명에 데이터가 들어가고 있는 상황이라 심각한 일이 벌어질 수도.. 있다. 후선언 가능예시1console.log(title);var title..
개인 정보라던가 어딘가에서 발급받은 key 같은 정보는 공개되지 않도록 미리 관리를 해주어야한다. 비밀 정보들을 관리하는 파일을 만들고, 그 파일이 깃이 인식하지 않도록 gitignore 에 추가해보자. 추가로 비밀 정보 파일의 값들을 다른 파일로 불러보자. 비밀 정보 파일 생성원하는 위치에 비밀 정보를 저장할 파일을 생성하자. 예를들어 config.js 파일을 생성한다. .gitignore 설정.gitignore 파일을 생성하고, 해당 파일에 config.js 파일을 적는다.# .gitignoreconfig.js 비밀 정보 추가config.js 파일에 비밀 정보를 추가한다. 아래 예시는 특정 key 를 저장한다고 가정한다.// config.jsexport const config = { apiKey: ..
Promise 란?Promise 객체는 비동기 작업을 다루기 위해 만들어졌으며, 비동기 작업의 성공 혹은 실패 후 결과를 처리하기 쉽게 해준다. 또한 비동기 작업이 끝나고 실행할 콜백을 등록할 수 있는 메서드를 제공한다. Promise 객체가 탄생하기 전에는 비동기 처리를 위해 콜백함수를 사용했는데, 일명 콜백 헬로 불리는 문제로 인해 가독성이 나쁘고 에러 처리가 분산되고 흐름의 추적하기 어려워지는 등 불편함이 있었는데 이러한 불편함을 보완할 수 있는 것이 Promise 이다. Promise 상태Pending : 아직 대기 중인 상태Fulfilled : 비동기 작업이 성공적으로 완료된 상태이며, resolve 로 인해 pending 상태에서 fulfilled 상태로 변함Rejected : 비동기 작업이 ..
내일배움캠프 첫 주차부터 시작된 팀프로젝트! 🥳 팀 소개 페이지를 만드는 것이었는데 발표일 제외하면 4일 동안 첫 팀원들과 첫 프로젝트를 수행하였다. 적극적으로 참여해 주신 팀원분들 덕분에 아래와 같이 깔끔하고 이쁜 '팀 소개 페이지'를 만들 수 있었다. 첫 프로젝트인 만큼 배운 것이 많았다. 이를 기록하기 위해 KPT 회고를 해보려한다. 프로젝트 결과물아래는 프로젝트 결과물 😬 배포 링크[배포링크] https://do-it-coding.netlify.app[깃허브] https://github.com/jungminji0215/who-are-you Keep구현해 본 것 공부해서 블로그 정리내가 맡은 기능에 대해서 구현하고 끝나지 않고 블로그에 최대한 아는 대로 꼼꼼하게 정리해 보았다. 이렇게 정리를 하..
- Total
- Today
- Yesterday