공부 기록일지📚

기존 local 폴더의 프로젝트를 원격 repo와 연결하는 법 우선 새로운 repo를 생성한다. 로컬에 연결하고싶은 폴더 경로로 가서 git init 명령어를 터미널에 입력해준다. (git 초기화) 그 다음 git remote add origin *내repo주소URL* 명령어로 원격 저장소와 로컬 저장소를 연결해준다. git remote -v 를 통해서 주소가 내가 지정한 repo 주소로 보인다면 제대로 연결된 것이다. 프로젝트를 현재 경로에 만들어서(create-next-app을 통해 프로젝트를 만들었다 가정) 모든 파일을 커밋해준다. git add . #모든 파일 온스테이징 git commit -m “커밋메세지” (optional) 커밋 내역을 확인하고 싶다면 git log —oneline 을 통해 ..

넥스트 13은 Node 16.14 이상의 버전을 요구한다. 지원 운영체제로는 맥, 윈도우즈, 리눅스가 있다. 프로젝트 자동 설치(수동 설치도 있음) npx create-next-app@latest 위의 명령어를 통해서 자동 셋업해주는 prompts 내역을 확인할 수 있다. 현재경로에 하위 폴더로 새로운 이름이 아닌 그냥 현재경로 폴더를 root로 사용하고싶다면 질문 prompt에서 프로젝트 명을 . 로 root를 의미하는 dot을 찍어주면 된다. 필요 종속성들을 설치할 수 있는데, 2023-08-22 기준 Typescript, ESLint , Tailwind CSS 가 기본값으로 내장되어 있다. src 폴더에 내 코드들을 root의 config 폴더들과 구분하여 사용할 수 있다. ⇒ 리액트랑 같은 듯 🤠..

vscode 내에서 nvm use 18.17.1을 했을 때, 아래와 같은 에러 메세지가 뜨며 동작하지 않았다. nvm에 18.17.1 버전의 node는 이미 설치된 상태이다. $ nvm use 18.17.1 exit status 5: �׼����� �źεǾ����ϴ�. exit status 1: ������ �̹� �����Ƿ� ���� �� �����ϴ�. 해결방법: 버전을 바꾸고 싶다면 `명령 프롬프트`를 관리자권한으로 열어서 같은 명령어를 입력해주면 된다. Q. 명령 프롬프트(CMD)를 그냥 열었을 때와 관리자 권한으로 열었을 때 차이점? 그냥 터미널을 열었을 때는 내 이름으로된 사용자 경로가 커맨드라인에 표시되지만 관리자 권한으로 열었을 때는 `C:\Windows\System32` 경로로 뜬다. ..

개인 프로젝트가 아닌 협업 프로젝트를 진행할 때, 코딩 스타일을 일치시키지 않는다면 코드를 합치거나 비교할 때 매우 불편할 것이다. 코딩 스타일은 팀의 자율에 따라 결정되지만 강제성이 없기 때문에 취약하다. 코드 리뷰나 작성을 할 때에도 의식하지 않으면 많은 에너지가 소모되므로 자동화될 수 없는 컨벤션은 최소화하고 필요한 경우에는 반드시 문서화시켜야 한다. 자동화 툴들이 아무것도 없이 시작하는 것보다 시간을 들여서라도 초기세팅에 공을 들여놓으면 지속적인 개발 생산성 향상에 도움을 주기 때문에 꼭 알아둬야 한다. ESLint & Prettier ESLint는 일관되고 버그를 피할 수 있는 코드를 짜기 위해서 만들어진 코드 분석 툴이다. 작성된 코드의 구문을 분석하여 버그가 발생할 여지가 있거나, 불필요한 ..

CRA로 프로젝트를 만들면 .svg 파일을 마치 리액트 컴포넌트처럼 import 하여 사용할 수 있다. import {ReactComponent as MySvg } from "../assets/mysvg.svg; const MyComponent = () => { return } 하지만, Vite로 리액트 프로젝트를 구성하고 있다면 추가 세팅이 필요하다. 세팅 방법은 간단한데, svg관련 라이브러리를 추가로 설치해준다. 1. vite-plugin-svgr yarn add vite-plugin-svgr #npm 대신 yarn을 애용하고 있다. 2. vite.config.ts 에 플러그인을 추가해주기 vite.config.ts import { defineConfig } from 'vite'; import re..