[Netflix] media query를 이용하여 반응형 페이지로 변경
·
Project/Netflix [React + Hooks]
결과 [ 홈 / TV / 영화 / 검색 ] 페이지를 반응형으로 변경하였다. gh-pages를 활용하여 웹 사이트를 배포하였다. 계획 9월 26일까지 모든 페이지를 반응형으로 변경할 예정이다. gh-pages를 사용해본 경험이 있어서 우선 gh-pages로 비교하면서 진행하고 최종적으로 netlify를 사용하여 배포할 예정이다. 느낀 점 아직 세부 페이지는 변경하지 못하였는데 모니터로 보이는 화면은 괜찮아 보였는데, 스마트폰 화면으로 보니까 배치도 망가지고 글자도 겹치는 문제가 발생하였다. 미디어 쿼리와 css를 변경해가며 페이지를 수정하였다. '처음엔 막막하게 어떻게 변경하지?'라는 생각을 가지고 있었는데 역시 하면 된다는 걸 느꼈다. 페이지를 반응형으로 변경하는 과정이 계속 비교하면서 노가다하는 것이 ..
[React] react에서 gh-page 배포하는 방법
·
React
서론 React 파일은 'create-react-app'을 통해 만들었다. GitHub Repository 생성 테스트를 위해 gh-pages-test 명으로 repository를 만들었다. 로컬 저장소와 연결 default 브런치명이 main으로 변경되었지만, create-react-app을 통해 설치하면 브런치명이 master로 나온다. 아래 명령어를 터미널에 입력하여 로컬 저장소와 원격 저장소를 연결한다. git init git remote add origin [repository 주소] gh-pages 설치하기 gh-pages를 이용하기 위해서는 패키지를 설치해야 한다. npm install gh-pages package.json에 주소 추가 패키지 설치가 완료되면 package.json에 "ho..