강디너의 개발 일지

장장 4개월에 걸친 토이프로젝트가 드디어 끝났습니다. 4월 말 오픈 예정이었으나, 역시 사람일은 알 수 없기 때문에... 각자의 업무가 일단 중요하니깐... 연애도 해야하고... 서비스 한 개를 만들면서 개발 플로우를 경험하고자 홀로 도전하게 되었습니다. 프론트엔드부터 백엔드, 데브옵스까지 많은 회사 동료분들께 도움을 받아서 감사의 말씀 먼저 올립니다. 초기 시작은 간단해 보였습니다.(이렇게 큰 거인 줄 그땐 몰랐지...) 백엔드, AWS 쪽을 도전하는 것이었기 때문에, 프론트엔드는 익숙한 Vue.js를 이용했습니다. 프론트엔드 모바일 전용으로 만들었으며, PWA도 생각해서 서비스 워커를 붙였습니다. 타입 스크립트 적용과 sentry를 붙여서 오류도 클라이언트 쪽에서 로깅할 수 있도록 설정했습니다. 카카..

회사 기술 블로그에 출간했습니다...! 첨부 https://dealicious-inc.github.io/2021/05/17/axios-integrate.html Axios 통신 한줄기로 만들기 로그인 프로세스 개선 dealicious-inc.github.io

서버를 구성하지도, 백엔드 로직을 직접 짜지 않아도 백엔드 개발을 쉽게 도와주는 strapi라는 프레임워크가 있다는 것을 듣고 바로 찾아봤습니다. strapi는 엄청 복잡한 로직이 아니라면 간단한 CRUD는 금방 뚝딱 나와서 백엔드에 시간을 많이 안 쏟아도 되는 장점이 있습니다. strapi 문서에서는 opensource headless CMS라고 하며, 로컬에 띄워서 버튼 몇 번 클릭으로 테이블을 만들 수 있습니다. 튜토리얼 문서 1. 설치 CLI CLI 로 설치하려니깐 무슨... access denied 가 계속 뜨면서 설치가 안돼서 실패했습니다... Node, npm 버전만 맞추면 되는 줄 알았는데 그게 아닌가 봅니다... sudo를 통해서 권한까지 주면서 했는데 실패 ... ! 다른 설치 방법도 ..

사용자가 이미지를 선택할 때부터 백엔드 API, AWS S3로 들어가는 과정입니다. 토이 프로젝트에서 진행중인, 리뷰 등록하는 것을 보여드리면서 설명하겠습니다. 기술 스텍: Vue.js, Node.js, AWS S3, MYSQL 보통 파일 선택하는 input type=file 은 전혀 이쁘지 않아서 디자인을 입힙니다. 그래서 그 아이는 display: none 하고, 이쁜 디자인을 만들어서 누르면 input file이 열리도록 코딩합니다. 디자인된 이미지를 누르면 숨겨진 input이 클릭되도록 합니다. 이미지가 선택되면 changeFile 이벤트를 통해서 preview 이미지를 만들고, 서버에 보낼 이미지 데이터를 갖고 있으면 됩니다. // 파일 이름 const imgName = ref(''); // 파..

자바스크립트에 없던 enum이 타입스크립트에 나왔다. 쓰는 방법도 쉽고, 기능도 간단한데 개인적으로 잘 사용하지 않는다. 굳이 enum이란 애를 써서 나열 하지 않아도 object로 선언해서 사용하는 것이 편하기 때문에 잘 사용하지 않았던 것 같다. 어디에 사용해야 하는지, 왜 좋은건지 잘 감이 안잡혀서 리서치를 했다. TypeScript에서 ENUM을 사용하는 이유는 무엇입니까? TypeScript enum을 사용하는 이유 [Typescript] enum을 써야 할 때, union type을 써야할 때 Typescript Enum이란? 여러가지 enum의 형태 [Typescript] Enums 열거형 interface, type, enum에 관한 글 [TypeScript TIPS] Interface 를..