Definition of Seon

2024. 01. 15 ~ 2024. 04. 28까지 3달 넘게 진행한 프로젝트가 끝났다.4월 5일에 배포를 하고 그 뒤에 서비스를 운영하며 유지보수 기간도 가졌다.긴 프로젝트 기간 동안 어떤 일들이 있었는지 그때마다 기록했으면 좋았겠지만 아쉽게도 그러지 못했다.이게 첫 프로젝트라 그래서일까 기록의 중요성을 너무나 늦게 알아버렸다.그 당시에 기록은 못했지만 사후기록이라도 남겨봐야지. 첫 프로젝트를 시작한다고 의욕 넘치던 초반에 썼던 글...이때부터 계속 기록을 남겼어야했는데! https://jemarque.tistory.com/entry/%EC%B2%AB-%ED%8C%80-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-%ED%8C%80-%ED%94%84%EB%A1%9C%EC%A0%9D..

프로젝트에서 메인 페이지와 상세 페이지 상단에 이미지 슬라이더를 넣기로 했다. 조건은 두 가지. 1. 화살표 버튼을 눌렀을 때 이동이 가능할 것. 2. 시간이 지나면 자동으로 다음 이미지로 넘어갈 것. - 옆으로 넘어가는 장면 useState와 useEffect가 필요하다.import { useState, useEffect } from 'react'; react-icons를 설치하여 화살표 아이콘을 가져온다.import { IoIosArrowForward, IoIosArrowBack } from 'react-icons/io'; 이미지 슬라이드에 들어갈 이미지들은 배열 형태로 외부에서 props로 받아오도록 한다.export default function ImageSlider({ slides }) 우선 이..

오늘의 작업 디자인을 마치고 메인과 문답 시작 페이지를 완성했다. 원래 pc에 적합한 ui로 디자인했었으나 아무래도 서비스 특성상 모바일 기기로의 공유가 빠를 것 같다는 생각이 들었다. 나 이거 해봤는데 너도 해봐 하면서 공유하는 그런 느낌의 서비스. 인스타 같은 곳에 올리기에도 모바일에 최적화되는 편이 나을 것 같아서 디자인을 수정했다. 핸드폰 화면에 들어갈 정도의 좁은 영역을 사용하는 방향으로 바꾸었다. 어려웠던 점 1. tailwind가 아직 익숙하지 않다. css보다 분명 쉬운 부분도 있지만 문법을 정확히 몰라 계속 문서를 찾아보며 헤맸다. 특히 너비와 높이를 설정함에 있어서 어려움을 많이 겪었다. header와 footer를 포함해서 스크롤바가 생기지 않게 길이를 딱 맞추고 싶은데 그게 아무리 ..