WuMo | 우리들의 모임 프로젝트를 마치며 2023.02.16-03.15 약 한 달간의 집중 개발 기간을 마치고 최종발표와 함께 데브코스의 수료식도 함께 진행되었다. 백엔드와 함께 진행하는 프로젝트인 만큼 걱정도 있었지만 좋은 팀원들을 만나게 되어 큰 트러블 없이 프로젝트를 끝마칠 수 있었다. 프로젝트 소개 🗓️ 모임 계획, 추억 관리를 위한 프라이빗 서비스 기획 평소 여행이나 모임을 계획할 때 어떻게 하시나요? 그룹채팅방에서는 모임과 상관없는 이야기도 오가면서 모임에 필요한 장소나 사진 등이 잊히기 쉽습니다. 그렇다면 모임과 관련된 내용만 모아 보면서 함께 계획을 완성하고 추억을 기록할 도구가 있다면 어떨까요? 주요 기능 모임을 만들어 친구, 가족을 초대한다. 후보지를 정하고 의견을 공유한다. 마음..
1월 5일부터 1월 20일까지 약 2주간 진행된 프로젝트를 기획하고 개발하였습니다. 기획 프로젝트 시작 전에도 여러 가지 아이디어를 제시하고 이에 대해 이야기했었지만 API를 확인한 뒤에는 이를 최대로 활용하고 가능성이 높은 프로젝트들을 브레인스토밍을 통해 도출하였다. 특강에서 보았으나 잘 알지 못했던 신문물(?)에 익숙한 팀원 덕분에 피그잼을 활용하였고 두가지 후보가 있었으나 최종으로 내가 제시한 아이디어가 선택되어 이번 프로젝트에 더욱 책임감이 느껴졌다. 이후 유저스토리를 작성해보며 프로젝트 주요 타겟을 정하고 간단한 사용 시나리오를 작성해 보며 콘셉트를 잡아 나갔다. 프로젝트 소개 🦔 커뮤니케이션을 통한 학습을 제공하는 개발자 전용 SNS 이번 프로젝트 주제는 "React 혹은 Vue.js 이용하여..
영화 검색 SPA with Vue Vue와 영화 검색이 가능한 API를 활용하여 간단한 영화 검색 웹페이지를 구현하는 과제로 실제 배포까지 진행되어야 했기에 serverless function에 이해도를 가져야 했던 과제였습니다. 프리뷰 https://movie-finder-pi-ten.vercel.app/ 구현 방법 router를 활용하여 페이지를 분리하는 방법도 있었지만 규모가 크지 않았던 만큼 정말 SPA로 구현하고자 하였고 검색된 영화를 클릭하면 모달로 상세페이지를 표시하는 방식을 사용하였습니다. 스타일링을 위해서 부트스트랩과 약간의 Sass를 이용하였습니다. 상태 관리를 위해 props 넘겨주는 방식으로도 어렵지 않게 구현이 가능했지만 Vuex를 활용해보고 싶었기에 이를 적용하였습니다. Vuex..
CSS GitHub My Profile 클론 강의를 진행해 주신 강사님의 세션에서 저는 어떤 UI가 가장 클론 연습에 좋을까에 대한 질문을 했고 이에 대한 답변으로 깃헙 마이 페이지가 좋을 것 같다는 의견을 듣고 SASS로 SCSS 문법을 활용하여 진행하였습니다. 프리뷰 클론한 페이지 https://radiant-griffin-5973eb.netlify.app/ 원본 페이지 https://github.com/mxx-kor 시멘틱 태그를 활용하여 HTML 작성 CSS 강의와 그동안의 경험으로 이제는 어떤 구조로 HTML을 작성해야 하는지 이해도가 있었지만 시멘틱 태그에 대해 생각하고 구조를 작성하느라 시간을 조금 더 투자하였다. header, main, nav, section, address, articl..
VanillaJS_2 고양이 사진첩 강의를 통해 만든 간단한 프로젝트를 보완하는 방식으로 과제가 진행되었고 Vanilla JS 컴포넌트 방식을 사용하여 진행한 프로젝트입니다. 이번 프로젝트에서는 데이터 정합성, setState 최적화를 진행해 보았습니다. 프로젝트의 기능들 breadcrumb 탐색기 기능 imageviewer 모달 ⏱️ 로딩의 지루함을 날려주는 isLoading 프로젝트의 API가 로딩처리를 학습해보기 위해 상당히 긴 쓰로틀링이 랜덤 한 시간으로 걸려있었고 과제를 진행할수록 한국인은 어쩔 수 없구나라고 느끼게 되었다.🙂 로딩처리를 하는 로직은 생각보다 훨씬 간단했다. fetch와 서버와 통신하거나 연산이 필요해 시간이 오래 걸리는 작업이 있다면 해당 부분을 함수로 만들어 시작하는 부분에서..
프로그래머스 데브코스 프론트엔드 3기 ✓ TIL DAY - Vue(Feat. webpack, serverless function) 🗓 Vue CSS 과제를 진행하고 바로 Vue 학습을 진행하였다. 시간이 정말 순식간에 흘러간 것 같다. 8일간의 강의를 통해 Vue를 사용한 프로젝트도 하나 진행하였고 이를 통해 배운 점에 대해 간단하게 정리해보려고 한다. Vue 드디어 써봅니다. 이전에 간단하게 찍먹한 정도에서 직접 사용해보며 본인이 느낀 Vue의 장점은 아래와 같다. 사용 방법이 아주 복잡하지 않다. 사용하는 방법이 어느 정도 정해져 있다. 공식 문서 정리가 잘되어있다. 짧은 기간 동안 학습해보며 리액트보다 빠르다는 점은 사실 느끼기 힘들었지만 2번과 3번 장점이 공존하기 때문에 다른 페이지를 찾아볼 필..
🚀 새로운 블로그로 이전했습니다.
살펴보러 가기
