본문 바로가기

전체 글188

4. Lambda로 서버구성 오늘은 프로젝트 4일차 원래 계획은 서버를 직접 구현을 해보려고 하였으나 nest를 사용하기 위해서 준비해야하는 것들이 많아, 다음에 배워보는 것으로 했습니다. 다음달부터 신규로 서비스 구축을 하는데 그 때 lambda를 사용해야하는 부분들이 있어서 연습삼아, 이번 프로젝트에 환경구성부터 api를 만들어 보는 것으로 계획을 변경했습니다. 그래서 오늘은 AWS 튜토리얼을 진행했습니다. 문서가 정말 잘 나와있어서 따라하기 편했습니다. https://docs.aws.amazon.com/ko_kr/lambda/latest/dg/getting-started.html Lambda 시작하기 - AWS Lambda Lambda 시작하기 Lambda 사용을 시작하려면 Lambda 콘솔에서 함수를 생성해야 합니다. 몇 분.. 2022. 11. 15.
3. 백엔드 환경구성 오늘은 프로젝트 3일차 피그마 레이아웃은 잠시 멈추고, 백엔드 환경을 구성을 했습니다. 백엔드 환경구성..이라고 썼지만 nest js의 보일러 플레이트를 사용했습니다. nest를 선택한 이유는 서버환경 구성에 대해서 잘 모르고, 사용하는 방식이 다 정해져 있어 공식문서를 봤을 때 친절하다는 느낌이 들어 nest로 선택하게 되었습니다. 하지만.. 여기서 문제는 class로 되어 있다는 점과 타입스크립트를 이전 회사에서 사용하고 정말 오랜만에 사용하다보니 적응하는데 시간이 조금 걸릴 것 같다는 느낌을 받았습니다. 네스트와 타입스크립트를 이용해 로그인 기능을 구현하고, 세션과 토큰 방식을 각각 구성하여 어떤 차이점이 있는지 이론으로 배운 것을 실습통해 알아보려고 합니다. 지금은 공식문서를 봐도 잘 이해를 못하.. 2022. 11. 14.
2. 피그마로 레이아웃 구성하기 오늘은 프로젝트 2일 차입니다. 어제 말한 대로 프로젝트를 진행하기 앞서 오늘 해야 할 일들을 리스트를 만든 후 진행했습니다. 확실히 목표가 있다 보니 체크박스로 완료된 것을 눈에 보면서 하니 나름 성취감이 있었습니다. 이 방식을 계속해서 사용할 것 같습니다. : ) ## 목업 사용 레이아웃을 계획할 때 디자인 ui/ux 디자인 경험이 아예 없다 보니 수시로 핸드폰의 레퍼런스 어플들을 켜보면서 생각을 해야 했습니다. 그러다 목업을 사용해야겠다는 생각이 들어 목업을 넣어 레이아웃을 구성했습니다. 디바이스 목업을 구하려고 여기저기 사이트를 검색하다가 mock magic이라는 페이지를 알게 되었습니다. 무료로 디바이스 png 파일을 제공해주어 좋았습니다. 아이폰뿐만 아니라 갤럭시, 화웨이, 맥북, 애플 와치 .. 2022. 11. 13.
재조정 (Reconciliation) Reconciliation React Reconciliation – React A JavaScript library for building user interfaces reactjs.org ## Diff Algorithm ### DOM 엘리먼트의 타입이 다를 경우 알고리즘은 이전 트리와 새로 생성한 트리를 비교합니다. 둘의 엘리먼트 타입이 다르다면 더 이상 비교를 하지 않고 이전 트리를 삭제하고 새로 생성한 트리를 DOM에 반영합니다. / 을 비교 -> div와 span 둘의 엘리먼트 타입이 다름 -> 이전 트리 삭제 -> 새로 생선한 트리 DOM에 반영 ### DOM 엘리먼트의 타입이 동일할 경우 엘리먼트가 아닌 엘리먼트의 요소가 변경된 것이라면 변경된 요소만을 변경합니다. /* 이전 트리 */ // .. 2022. 11. 13.
0. 레거시 이 글은 개발 글이 아닌 삽질에 대한 기록만 있습니다. ## 결론 1. CRA는 react-scripts다. 2. CRA의 버전이 오래되면 그 하위의 모듈들도 모두 낙후된 모듈일 것이다. 3. 마이그레이션을 할 때에는 공식문서나 공식 깃헙의 CHANGELOG나 migration guide라는 키워드로 찾아보자. 4. 모듈들의 버전을 너무 오랫동안 방치하지 말아야 한다. ## 인트로 빌드 최적화라는 주제로 글을 작성해보려고 합니다. 제가 일하는 곳은 B2B SaaS 플랫폼으로 하나의 웹앱에 7개의 큰 모듈로 구성되어 있습니다. 모노레포로 관리하고 있어 프로젝트의 크기가 가볍지는 않습니다. 밑의 이미지를 보시면 최적화를 하기 전에 배포하는데 5분 22초 정도가 소요되고 있었습니다. 배포 뿐만 아니라 개발 시.. 2022. 11. 12.
1. 피그마로 레이아웃 구성하기 오늘부터 하루 한 시간을 투자하여 토이 프로젝트를 진행하기로 했습니다. 제가 만들어 볼 것은 30일 챌린지 애플리케이션입니다. 예전에 친구들이랑 같이 했었던 카카오톡 100일 챌린저에서 영감을 받아 만들어보기로 했습니다. : ) (어플 덕분에 책 읽는 즐거움을 알게 되었습니다. ㅎㅎ) ## 0. 목표 세우기 1. 하루 한 시간 토이 프로젝트를 위해 시간을 사용 (최대 1시간 30분 넘기지 않기) 제 성격이 이상해서 그런지 저는 하고 싶은 것을 통제하면 더 하고 싶어 져 꾸준히 유지할 수 있더라고요..ㅎ 그래서 시간을 제한하기로 했습니다. 그리고 오늘 처음으로 과제라는 것을 해보았는데 정말.. 시간관리를 못해 시간을 버렸습니다.(실력이 부족해서.ㅠ) 그래서 시간을 통제해 트레이닝 해보려고 합니다. : ) .. 2022. 11. 12.
1112 잡담 노션은 편하지만 글을 공유하고 싶을 때, 노션 링크를 이용해서 공유해하는 번거로움이 있어 예전에 작성했었던 티스토리에 공유를 해보려고 합니다. ## 이직한 지 어느 덧 11개월 차 이전 회사는 핀테크 스타트업으로 10개월 정도 다니다가 회사 사업이 법적인 이유로 원했던 방향을 가지 못하면서 이 회사에 들어왔던 이유를 잃어 이직을 선택했습니다. 지금 다니고 있는 회사는 ERP 클라우드 솔루션을 제공하는 중소기업으로 스타트업과는 확실히 분위기가 다릅니다. 예전에는 학교 동아리 같았다고 하면 지금은 정말 회사 같습니다. : ) 그리고 B2B 서비스라(서비스 마다 다릅니다..ㅎ) 확실히 제가 원하는 고객과의 인터렉션은 많이 없고, 가끔 있는 서비스 개선을 위한 의사소통도 하기가 어렵습니다. (개인과 개인이 아닌.. 2022. 11. 12.
맥북 바탕화면 파일 감추기 맥북 바탕화면에 있는 폴더들을 모두 감추고 싶을 경우 다음과 같은 순서로 진행하면 감출 수 있습니다. 1. terminal을 켭니다. command + spacebar를 눌러서 spotlitght에 terminal 입력하고 실행시킵니다. 2. 터미널에 `defaults write com.apple.finder CreateDesktop false` 커맨드를 입력합니다. 3. Killall Finder를 입력합니다. 입력 후 바탕화면을 보면 모든 파일들이 감추어진 것을 확인할 수 있습니다. 만약 다시 파일들을 보고 싶으시면 false를 true로 변경신 후 3번 명령어를 입력하면 다시 노출됩니다. : ) 이 블로그 글을 해당 정보를 알게 되었습니다. https://www.howtogeek.com/730231.. 2022. 11. 11.
1109 문서를 잘 읽자 ETL서비스는 SaaS 솔루션으로 Data Warehouse에 있는 방대한 데이터들 중 사용자가 원하는 데이터를 선택, 추출하는 기능을 제공하는 기능을 개발 및 운영하고 있습니다. 데이터 이관 같은 경우에는 배치기능을 이용해 Data Warehouse에 있는 데이터를 S3 AthenaTable로 이관하는 기능을 제공합니다. 이관 시 각 배치마다 얼마나 많은 데이터가 이관되었는지 데이터 양을 제공해주었는데, 데이터 사이즈까지 알려주면 좋겠다는 피드백이 있어 서버로부터 받은 파일 사이즈 데이터를 파싱 하는 기능을 추가했습니다. 파싱 하는 함수는 따로 함수로 작성하지 않고 npm에 bytes라는 파싱 모듈을 사용해서 붙였습니다. import bytes from "bytes" bytes(1024); // out.. 2022. 11. 9.