본문 바로가기

분류 전체보기50

Vanilla javascript 영화 프로젝트 + 모달창 구현하기 아래 영화 프로젝트를 바탕으로 기능을 추가적으로 구현하는 것이이번 팀 프로젝트!  이번 프로젝트에서는 로컬스토리지를 사용하라고 안내가 나왔다나는 파이어베이스가 더 익숙하고 편해서 파이어베이스 사용해도되는지 여쭤봤다.로컬스토리지 사용을 권장하셨고... 이유는 다음과 같았다.  해당내용을 보니 가끔 어떤 사이트들은내가 회원가입을 하지도 않았는데 내가 살펴본 상품을 기억하고 있거나계정도 없는데 장바구니에 일단 내가 고른게 담겨져 있는? 신기한 곳이 종종 있었는데웹 스토리지가 이런곳에 쓰였겠구나 하고 생각이 들었다.   그리고 팀원과의 회의결과!    [추가 구현할 기능 ]   1. 회원가입/로그인/로그아웃 (페이지 이동하지 않고 모달창 구현)2. 마이페이지3. 상세페이지4. 다크모드5. 페이지네이션6. 리뷰남.. 2024. 5. 3.
localStorage 웹 스토리지(web storage)에는 세션 스토리지(sessionStorage)와 로컬 스토리지(localStorage)가 있습니다.  세션 스토리지는 웹페이지의 세션이 끝날 때 저장된 데이터가 지워지는 반면에, 로컬 스토리지는 웹페이지의 세션이 끝나더라도 데이터가 지워지지 않습니다. 로컬스토리지 사용하는 방법에 대해 학습해보겠습니다. MethodDescriptionsetItem()로컬 스토리지에 키, 값을 추가한다.getItem()키에 맞는 값을 찾는다.removeItem()키에 맞는 값을 삭제한다.clear()로컬 스토리지에 저장된 모든 내용을 삭제한다.  // 키에 데이터 쓰기localStorage.setItem("key", value)// 키로 부터 데이터 읽기localStorage.getIte.. 2024. 5. 2.
나의 첫 팀 프로젝트 회의 최근에 만든 개인 프로젝트인"순수 바닐라 자바스크립트만으로 구현한 영화 리스트 조회 및 검색 UI 구현"이 프로젝트에 추가 기능을 넣어서 팀프로젝트를 진행하게 되었다.  나의 첫 팀 프로젝트...그동안 혼자서 또는 2명이서 뽀짝뽀짝 개발한 경험만 있었지팀프로젝트는 처음이다.  깃허브로 협업해본적도 없고누군가와 프로젝트 관해 얘기를 나눠본적도 없어서조금 겁났지만 배우러온거니까!회의에 열심히 참여했다.  기존 프로젝트에서 업그레이드 하는 것이다보니기존에 했던 작업물들중에 ui/ux적으로 좋았던프로젝트를 대표로 선정해야했다.  아래는 나의 프로젝트다.  나름 기대를 했지만 1표 차이로내 프로젝트는 떨어지고 그분의 프로젝트로 정해졌다.  그리고 끝없는 회의의 연속...뭔가 정해졌다 싶다가도이건어떻게 하지? 어?.. 2024. 5. 1.
prettierrc와 settings.json 자바스크립트 개발자들 간에 선호하는 코딩 스타일이 다를 수 있죠? 예를 들어, 개발자 A는 문자열을 쌍따옴표(")로 감싸줘야 한다고 주장하는 반면에, 개발자 B는 홑따옴표(')를 사용해야 된다고 주장합니다. 이러한 두 개발자가 한 팀에서 일하면 코드 리뷰 중에 이러한 사소한 코딩 스타일 차이로 키보드 배틀이 일어나는 걸 보게 되죠… 😅 그런데 대게 이런 코딩 스타일에 대한 논쟁은 정답이 없을 분더러, 괜히 소모적인 자존심 싸움으로 번지기 쉬워서 팀워크와 생산성에 나쁜 영향을 줄 수 있습니다. 이번 글에서는 협업 프로젝트에서 이러한 포맷팅 고민을 해결해주는 편리한 개발 도구인 Prettier에 대해서 소개해드리겠습니다.  코드 포맷터(Code Formatter)개발자가 작성한 코드를 정해진 코딩 스타일을.. 2024. 4. 30.