본문 바로가기

프로젝트23

[재활용 프로젝트][리액트] 카카오 api Typescript 맵 구현 목차 카카오 api를 통해 리액트로 맵을 구현해 보았다. usegeolocation을 이용해 내 위치를 띄우는 코드 import useGeolocation from 'utils/useGeolocation'; import { Map, MapMarker } from 'react-kakao-maps-sdk'; const { kakao } = window; export default function KaKaoMap() { const location = useGeolocation(); //불러온 내 위치 return ( ); } useGeolocation 페이지 import { useState, useEffect } from 'react'; interface locationType { loaded: boolean.. 2024. 4. 1.
[프로젝트] git 협업 시에 pull request및 코드 리뷰 방법 목차 프로젝트를 하게 되면 git은 필수이다 내가 아는 한에서 방법을 간단하게 정리하고자 한다. 1. 원본 저장소 fork하기 그 후create fork를 눌러 내 원격저장소에 레포지토리를 복제해 준다. 잘 fork가 된 것을 볼 수 있고 코드를 주소를 복사해 준다. 복사하기 원하는 폴더를 가 터미널에 다음과 같이 입력해 준다. git clone 2. 저장소 remote 설정 git remote -v //저장소의 확인 git add 이름 저장소url //원격 저장소 remote 등록 git remote remove 저장소 이름 //잘못 만들었을 경우 삭제 방법 3.브랜치 분기해 주고 pull해주기 git branch 이름 //브랜치 만들기 git switch 브랜치 이름 //브랜치로 이동 git add .. 2024. 3. 24.
[프로젝트] 유튜브 클론 프로젝트 목차 리액트를 공부하면서 리액트 공식문서로만 공부해서는 절대 안되겠다는 것을 직감했고 css에 대해 설렁 설렁 넘어간 것 같아 유튜브 클론 코딩을 진행해 보았다. 코드 구현 방향 css방식: Styled-component typescipt도 겸사겸사 공부하고자 tsx로 만들어 주었다. 다음은 css 배운점들이다.. z-index const Styledfunc = styled.div` z-index: 2; width: 358px; height: 34px; border-radius: 10px; position: relative; display: flex; text-align: center; top: 195px; left: 50%; background-color: #ffffff; border: 1px soli.. 2024. 3. 21.
728x90