frontend portfolio

1차 프로젝트가 눈 깜짝할 사이에 끝났다. 약 한달정도 되는 기간 내내 매일 성장하는 기쁨을 느끼면서 코딩할 수 있게 해준 우리 팀원분들 모두 고맙습니다~ 💛 여러분들과 함께했기 때문에 프로젝트를 잘 마칠 수 있었어요! 🥳 🏆 프로젝트 소개 최종 결과물 확인 : https://www.camp-us.ga 우리가 진행한 프로젝트는 전국 캠핑장 추천 플랫폼 'CampUs'이다. campUs에서는 전국 3000 여개의 캠핑장 정보를 제공하고, 사용자의 위치에 따라 가까운 캠핑장을 추천해주는 서비스를 제공한다. 각 캠핑장별로 이용 후기를 남기고, 커뮤니티를 통해 캠퍼들간의 유용한 정보를 교류할 수 있다. ⌛ 진행기간 2022.01.18 ~ 2022.03.01 (5주) 📌 팀 구성 (TEAM COOP) 프론트엔드 ..

작업 내용 리뷰 리뷰 길이에 따라 더보기 버튼 생성 기존 Figma 디자인 상에서는 리뷰가 길어지면 3줄 이상이 되었을 때 ...으로 표시하도록 하였는데, 생각해보니 그렇게 하면 리뷰 내용 전체를 아무도 볼 수 없는 UI가 되어버렸다. 이 부분을 modal로 처리할 지, 더보기 버튼을 추가할지 고민하다가 인스타그램을 참고하여 일정 텍스트 길이보다 크면 더보기 버튼이 나타나고, 더보기 버튼을 클릭하면 전체 작성 내용이 표시되도록 수정하였다. 더보기 전 더보기 후 👍시도 // ReviewsList.jsx import React, { useState, useEffect } from 'react'; import './ReviewsList.styles.js'; const ReviewsList = ({ review..

작업 내용 리뷰 작성한 리뷰 / 알림 등의 업데이트 날짜포맷 변환 대부분의 개발 언어가 그렇지만 기본으로 표시되는 날짜 포맷이 우리나라나 동양권의 날짜 표시 방법과는 차이가 있다. 자바스크립트의 많은 라이브러리들과 날짜 관련 UI 프레임워크들도 마찬가지로 날짜 포맷 표현에서 우리의 년.월.일 표현 방식과는 다른 방식으로 기본적인 날짜 표현을 한다. 우리의 프로젝트에서 response로 받은 데이터를 보면 날짜 포맷을 아래와 같이 넘겨주는 것을 확인 할 수 있다. createDate : ""2022-02-27T09:47:05.256725" 하지만 UI에 이대로 표현된다면 사용자가 보기 불편할 뿐만 아니라 ms까지 표시되어 불필요한 정보를 보여준다는 생각이 들어, 이 날짜포맷을 변환해 보기로 하였다. 👍시도..