개발블로그

AWS 배포에 대한 강의를 못 들었지만, 검색을 바탕으로 결과에 성공했기에 나중에 또 쓸 일을 위해 작성해둡니다. 혹시나 잘못된 점이 있다면 알려주세요! 그리고 나중에 수업을 듣고 잘못된 점이 있다면 추가적인 글을 남기려고 합니다.   1. AWS에 로그인 후 EC2를 검색하여 EC2 서비스에 진입합니다. 2. 리전을 서울로 선택한다. (기본적으로 버지니아 북부로 설정되어 있고, 우리나라로 하면 확실히 속도가 빠른 것을 느꼈습니다.)3. 인스턴스 시작을 누른다4. 원하는 이름을 채운 후 Amazon Linux가 선택되어 있는 지 확인한다. 저는 2023 AMI 기준으로 작성합니다. Linux2도 있고 Ubuntu도 있지만, 사실 상 배우지 않아서 무슨 차이점이 있는지 모릅니다..ㅎ 그러나 ubuntu로 ..

1. guard clause 사용하기중첩 if문 사용하였기 때문에 guard clause를 사용해보라고 하셨다. 사실 처음 들어서 guard clause부터 찾아봤다. Guard clause는 특정 조건을 만족하면 바로 함수를 종료할 수 있도록 하여 복잡도를 줄이고, 가독성을 높이는 프로그래밍 패턴이라고 합니다.    2. 토글 위치const rect = e.target.getBoundingClientRect();    setModalPosition({      top: rect.bottom + window.scrollY + 5,      left: rect.left - 150,    }); 어느 정도 위치는 잡았지만 스크롤하면서 위치가 변했다... 그래서 창 상하를 기준을 플러스해서 잡아주니 내가 원하..

1. 띄어쓰기예전 html 코드를 가져와서 next.js로 마이그레이션 하는 과정에서 띄어쓰기 부분이 글자 그대로 출력되는 부분을 발견했다.원래는잘 활용했는데...&nbspnext.js에서는 아래처럼 사용해야한다. 유니코드 문자라고 한다.{"\u00A0"}2. 제출 버튼button            type="submit"            className={`${styles.login_btn} ${              isButtonDisabled ? styles.btn_disabled : styles.btn_active            }`}          > type을 항상 button으로 줬는데, submit으로 하면 클릭을 하든 "엔터"를 하든 post가 가능해진다! 엔터는 처음 ..

1. 반응형 미디어 쿼리PC 버전일 때는, 3개TABLET일 때는, 2개MOBILE일 떄는, 1개이렇게 보여줘야했는데, CSS상에서 grid를 사용하면 그저 열만 정렬해줬다...내 나름 이론상 1행 고정에 3열, 2열, 1열하면 될 것 같아서 gird-template-rows: repeat(1, auto)를 추가로 해줬지만, 역시나 통하지 않았다... 그래서 오른쪽 사진처럼 JS에 넣어버렸다...결과는 성공적이지만, 찝찝하게 마무리했다... 근데 역시나 멘토님께서 JS보다는 CSS에서 하는게 좋다고 말씀해주셨다. 결론은 선택자에서 자손들을 안보이게 하기를 사용하기로 결정했다.

최대한 구글링을 통해 문제를 해결하려고 했으나, 한 문제에 너무 시간 소요가 되는 것 같아서 GPT에게 물어본 내용을 정리하려고 합니다. 아직 미션을 다 진행 한 것이 아니라서 추후 계속 업데이트할 예정입니다. 1. Textarea 문제이런 textarea를 적용할 때, 아래와 같이 너무 딱 달라붙는 문제가 생긴다. 너무 보기가 싫어서 패딩도 줘보고 했는데 해결이 안되었다...간단한 해결 방법!들여쓰기 css를 적용한다. px이 커질수록 안녕이 오른쪽으로 밀어내진다..input { text-indent: 20px;}2. 클릭 후 수정하기, 삭제하기 모달창 위치초급 프로젝트 때는 그냥 잘됐는데... 선택하는게 위쪽이랑 아래쪽에 따로따로 있어서 해결이 안되나보다... const [modalPosition..

중간중간에 알게된 사실이나 배운 내용을 꾸준히 작성해야했는데, 첫 프로젝트라서 그런지 코드 작성하느라 바빠서 회고를 못했던 것 같다... 회고하면서 블로그 작성 시점이 늦은 것 같지만, 기억을 잃기 전에 회고록을 작성하려고 합니다!코드를 하나씩 분석해가며 알게 된 내용을 작성하겠습니다. 1. NVMNode version Manager의 약자로 node.js의 버전을 관리해주는 아이이다. 공식 홈페이지에는 나와있지 않은 더 높은 버전들이 있어서 dotenv를 이용하지 않고, .env를 바로 관리할 수 있었다.ㅇ 사용법https://github.com/coreybutler/nvm-windows/releases위 깃허브에서 nvm-setup.exe를 다운 받는다.nvm list availablenvm inst..