let's get IT with DAVINA 💻

merge 방법 기능 개발이 끝나면 브랜치를 main 브랜치와 합칠 수 있습니다. 머지된 feature 브랜치는 이미 dev 브랜치에 기록이 완벽하게 남아있기 때문에 굳이 남겨둘 이유가 없어 삭제를 권장합니다. 원격 리포지토리에서 pull request가 성공적으로 마무리되면, 브랜치를 삭제하는 버튼을 눌러 쉽게 삭제할 수 있습니다. 로컬에서 merge 완료된 브랜치 삭제 방법 git branch -d 브랜치명 //merge안한 브랜치 삭제 git branch -D 브랜치명 case 1. 각 브랜치에 신규 commit이 있는 경우 => 3 way merge git switch main //메인 브랜치로 이동 git merge feat //feat 브랜치를 main브랜치로 병합 중심 브랜치로 이동해서 gi..

Why using git? 파일 변경 내역을 보존하고 관리하기 위해 How to install? 1. Homebrew 검색해서 사이트에 보이는 긴 설치명령어를 2. 터미널에 그대로 입력 3. password 입력하라고 하면 맥북 비번 입력 4. 설치 끝나면 커맨드 2개 입력하라고 나오는데 2개 각각 터미널에 입력 5. brew install git 하면 설치 끝 6. 기본 브랜치 이름 master → main으로 변경 git config --global init.defaultBranch main 7. 이 컴퓨터에서 git 처음쓴다? ⇒ 사용자 등록 git config --global user.email "홍길동@naver.com" git config --global user.name "홍길동" Git 이..

19000->₩19,000 export const priceFormatter = new Intl.NumberFormat("ko", { style: "currency", currency: "krw", }); priceFormatter.format( roomType === "1 King Bed" ? pageDetail.rooms ? pageDetail.rooms[0].price: 0 : pageDetail.rooms ? pageDetail.rooms[1].price: 0 )

//checkin checkout date 형식 변환 //Wed Apr 20 2022 00:00:00 GMT+0200 => 2022-04-20 export const DateFormat = (d1) => { const date = new Date(d1); const year = date.getFullYear(); const month = ("0" + (1 + date.getMonth())).slice(-2); const day = ("0" + date.getDate()).slice(-2); return `${year}-${month}-${day}`; };

Calender/style.jsx import styled from "styled-components"; export const DatePickerContainer = styled.div` display: flex; input { cursor: pointer; background-color: transparent; width: 100%; height: 65px; border: none; padding: 40px 20px 13px 20px; &:hover { border-radius: 8px; border: 2px solid ${(props) => props.theme.darkBlack}; } } .react-datepicker__day--keyboard-selected, .react-datepicker_..

방법 1 (컴포넌트 별로 적용할 때) src/util/useScrollTop.jsx 적용된 컴포넌트 진입시 페이지 맨 위로 스크롤해주는 커스텀 훅 import { useEffect } from "react"; const useScrollTop = () => { useEffect(() => { if (window) window.scrollTo(0, 0); }, []); return; }; export default useScrollTop; import useScrollTop from "../util/useScrollTop"; const BlogDetails = () => { useScrollTop(); return ( //생략... ); }; export default BlogDetails; 방법 2 (전..

React scrollintoview 사용하기 특정 요소를 누르면 다른 특정 element까지 도달 가능 const App = () => { const scoll1Ref = useRef(); const goBox = () => { scoll1Ref.current.scrollIntoView({behavior: "smooth"}) } return ( 이동하기 ) } → 1번째 버튼을 누르면 3번째 div까지 스크롤이 되며 이동할 수 있다. 이 때, behavior: “smooth”를 주면 부드러운 효과 적용이 된다.

Styled Components 컴포넌트를 기반으로 css를 작성할 수 있게 도와주는 라이브러리 우리가 알고있는 css를 그대로 사용할 수 있다. css를 컴포넌트 안으로 캡슐화하여 네이밍이나 최적화를 신경 쓸 필요가 없음 비교적 빠른 페이지 로드에 불리 Styled Components 설치법 터미널에서 Styled Components 라이브러리 설치 # with npm $ npm install --save styled-components # with yarn $ yarn add styled-components package.json에 상기 코드 추가 권장 (여러 버전 설치 방지) { "resolutions": { "styled-components": "^5" } } 필요할때마다 import해서 사용 i..