다다의 개발일지 6v6

Git 명령어 정리1️⃣ Git 기본 명령어git init현재 디렉토리를 Git 저장소로 초기화git clone [저장소 URL]원격 저장소를 로컬로 복사git status현재 작업 디렉토리의 변경 사항 확인git add [파일명] 특정 파일을 스테이징 영역에 추가 이거보단 그냥 IDE에서 개별적으로 추가하는게 나을 거 같다.git add .모든 변경 사항을 스테이징 영역에 추가git commit -m "메시지"스테이징된 변경 사항을 로컬 저장소에 커밋git log커밋 히스토리 확인git log --oneline커밋 히스토리를 한 줄씩 요약해서 확인git diff수정된 내용 비교git diff --staged스테이징된 파일과 최신 커밋 비교git reset HEAD [파일명]특정 파일을 스테이징에서 제외..

Next.js 는 리액트 기반 서버 사이드 렌더링 프레임 워크다. -> 최초 페이지 렌더링이 서버에서 수행된다. create-react-app 처럼 create-next-app이 지원된다.타입스크립트 기반으로 작성할 것이기 때문에 아래 명령어로 프로젝트를 시작한다.npx create-next-app@latest --ts  npm 프로젝트를 살펴볼 때는 package.json을 먼저 봐야한다.프로젝트 구동에 필요한 모든 명령어 및 의존성이 포함되어 있으므로 프로젝트의 대략적인 모습을 확인하는 데 매우 유용하다! 그리고 eslint-config-next 파일은 Next.js 기반 프로젝트에서 사용하도록 만들어진 ESLint 설정이다. 꼭 사용하는 것을 추천한다고 한다. 핵심 웹 지표에 도움이 되는 규칙들이 ..

3/ 18 (화) -> 아직까지 전 코드 문제점 파악 중개발자도구 쓸때 (network, console 둘 다) 꼭 Preserve log 켜고 하자.... api가 오류나서 페이지 이동이 일어나면 오류가 안보이게 된다!! (이건 일단 내가 보는 코드 기준) webstorm 아직 너무 불편하다 ㅜㅠㅠ 왜 폴더 만드는 버튼이 없는거야,, next.js 흐아 완벽한 코드로 짜고 싶다!! 공부해야지 페이지 타입을 꼭 써야하는 건 아니지만 NextPage 타입을 사용하는 게 여러모로 유리한 점이 있다. 더보기더보기NextPage 타입을 사용하면 좋은 점Props 타입을 명확하게 지정할 수 있음import { NextPage } from "next";interface Props { name: string;}..

클라이언트에서 fetch 요청 vs 서버에서 fetch 요청Next.js에서는 fetch()를 클라이언트와 서버에서 모두 사용할 수 있음. 하지만 실행되는 환경이 다르기 때문에 성능과 보안 측면에서 차이가 있음. 📌 핵심 차이점 요약 클라이언트에서 fetch() 요청서버에서 fetch() 요청실행 위치브라우저 (클라이언트)Next.js 서버 (Node.js)요청 횟수사용자가 페이지 방문할 때마다 요청서버에서 한 번 요청 후 결과 반환보안API 키가 브라우저에서 노출될 수 있음API 키를 숨길 수 있음성능네트워크 요청이 많아질 수 있음서버에서 미리 데이터 가져와서 빠름SEOCSR 방식이므로 SEO 불리함SSR로 SEO 최적화 가능 1. 클라이언트에서 fetch 요청하는 방식 📌 클라이언트에서 실행되는 ..

Git Flow란?Git Flow는 Git을 활용한 브랜치 전략(Workflow) 중 하나이다.✅ 협업을 쉽게 하기 위해 브랜치 역할을 명확히 구분✅ 안정적인 배포를 위해 개발/배포 단계별 브랜치를 운영✅ 새로운 기능 개발과 버그 수정을 체계적으로 관리  Git Flow 브랜치 구조Git Flow에서는 5가지 주요 브랜치를 사용각 브랜치마다 역할이 다르며, 장기 브랜치(항상 존재)와 단기 브랜치(필요할 때 생성됨)나뉜다.🔹 장기(Long-lived) 브랜치 → 항상 유지됨main실제 서비스 운영 중인 배포용 브랜치develop개발 중인 최신 코드가 모이는 브랜치🔹 단기(Short-lived) 브랜치 → 필요할 때 생성 후 삭제됨feature새로운 기능을 개발하는 브랜치release배포 준비를 위한 브..

주소창에 https://www.example.com 를 입력한다. 어떤 일이 일어날지 알아보자. 1. URL 해석 및 DNS 조회 (Domain Name System)사용자가 입력한 https://www.example.com을 브라우저가 분석함.브라우저가 example.com의 IP주소를 찾기위해 캐시에서 DNS 기록을 확인한다.DNS 조회 과정 ( 먼저 캐시에서 DNS 기록을 확인하고 없으면 루트 네임서버로 ):브라우저 캐시 확인 → 최근 방문한 사이트라면 저장된 IP 사용운영체제(OS) 캐시 확인로컬 네트워크(라우터) 캐시 확인ISP(internet service provider로 KT SKT 같은곳을 의미) DNS 서버 캐시 조회최종적으로 루트 네임서버를 거쳐 실제 IP 주소 조회DNS 조회 과정 ..