본문 바로가기

프론트엔드19

git branch 관리하기 git branch 개발을 한다면 필수로 사용하게 되는 git! git의 기능 중 하나인 branch를 이용하면 여러 작업을 한번에 수행하고 작업별로 따로 관리하기 편리해집니다. 브랜치? branch? 필수 사용? 회사 프로젝트를 개발하던 중 UI 리디자인 작업, 유저 플로우 변경, 세세한 버그 및 디자인 조정 등 여러 작업을 한번에 하다보니 😵‍💫 branch 사용이 필요한 순간이 왔습니다. 필수적이진 않지만 사용하면 아주 편리한 branch를 사용해야하는 이유가 무엇일까요? 브랜치를 이용하면 여러 작업(스타일 수정, 버그 수정, 유저 플로우 수정 등등)을 한번에 수행 가능! A 작업을 진행 중인데 B 작업을 급하게 해서 사이트에 업로드 해야하는 경우, 완료되지 않은 A 작업은 놔두고 B 작업만 업로.. 2024. 3. 1.
[Next.js] 웹사이트 버전 관리하기 - package.json version 설정& cookie에 버전 저장하기 ( + 버전 관리 규칙 semantic versioning ) 사이트에 지속적인 배포를 하려면 버전 관리가 필요하다. 해당 포스트는 Next.js 프로젝트에서 웹사이트 버전을 관리한 내용을 간단히 작성하였다. package.json에 버전 설정하기 package.json을 보면 위의 사진과 같이 버전 version을 설정할 수 있다. 위는 현재 웹사이트 버전을 1.0.0으로 설정하였다. 버전 설정 Semantic versioning 은 다음을 참고해 보자! 💡 웹(앱) 버전 규칙 Semantic versioning Major.Minor.Patch Major → 대규모 업데이트 사항 발생 시. 이전 버전과 호환되지 않는 정도의 큰 변화를 주는 경우 Minor → 새로운 기능을 추가할 경우 Patch → 이슈, 버그 해결 시 등 간단한 수정을 한 경우 그럼 이제 이렇게.. 2024. 2. 21.
[Next.js] Next.js13 App router에 styled-components 적용하기 / global style / registry.tsx Next.js v13에서는 기존의 Pages Router와 달리 App Router 방식이 등장했다. 그리하여, 이에 따라 styled-components 설정 방식도 변경되었다. 기존 Page Router에서는 _document.jsx와 _app.jsx가 존재했으나 App router에선 사용하지 않는다. App router에선 lib/registry.jsx 와 app/layout.jsx를 사용한다. 💀 Page Router에서 styled-components를 사용하기 위한 설정 방식 //_document.jsx import { Fragment } from "react"; import Script from "next/script"; import { ServerStyleSheet } from "styl.. 2023. 7. 11.
[Next.js] Error: Invalid src prop on `next/image`hostname "..." is not configure 에러 해결하기 / next.config.js 이미지 도메인 설정 Error: Invalid src prop (https://images.unsplash.com/photo-1511920170033-f8396924c348?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=774&q=80) on `next/image`, hostname "images.unsplash.com" is not configured under images in your `next.config.js` See more info: https://nextjs.org/docs/messages/next-image-unconfigured-host 프로젝트 내부에 저장해 둔 사진이 아닌 외부 .. 2023. 5. 28.