그럼에도 불구하고

Git Diff에 대해 알아보겠습니다. 목차 [ Gif Diff ] git diff 명령을 사용하면 commit, branch, file, 작업 디렉터리 간의 변경 사항을 볼 수 있습니다. 또한 git status 및 git log와 같은 명령과 함께 git diff를 사용하여 레포지토리에 대한 더 나은 그림과 시간이 지남에 따라 변경된 방식을 얻을 수 있습니다. git diff는 저장소에서 어떤 작업도 하지 않으며, git status나 git log처럼 아무런 영향도 미치지 않습니다. 순수하게 정보를 주는 명령어입니다. 📌 git diff git diff 이 명령은 다음 commit을 위해 stage에 등록되지 않은 워킹 디렉터리의 변경 사항을 모두 나열합니다. 따라서 워킹 디렉터리와 stage 영역..

브랜치 병합에 대해 알아보겠습니다. 목차 [ Merge ] branch를 이용하면서 개별 작업이 가능해지면서 편해졌지만, master를 기준으로 branch와 다른 branch를 결합해야 하는 상황에는 어떻게 해야 할까요? git merge 명령을 사용하여 이 작업을 수행할 수 있습니다. - merge는 특정 커밋이 아닌 branch를 병합합니다. - merge는 항상 현재 HEAD branch를 기준으로 병합합니다. 📌 사용법 git switch master git merge branch-name 1. 내가 병합하고 싶은 branch로 이동합니다. 2. git merge를 사용하여 현재 branch에 내가 원하는 branch를 병합시킵니다. 아래는 Master에서 branch 한 Bugfix를 Mast..

오늘은 branch(브랜치)에 대해 알아보겠습니다. 목차 [ git branch ] git branch 명령어는 Git 저장소에서 사용 가능한 브랜치(분기)를 보여주고, 새로운 브랜치를 생성하거나 삭제하는 등의 브랜치 관련 작업을 수행하는 데 사용합니다. 프로젝트에서 브랜치 깃은 일종의 타임라인 같은 것이라고 생각할 수 있습니다. 브랜치는 우리가 원할 때마다 별도의 콘텍스트를 생성할 수 있게 해 줍니다. 이를 통해 새로운 것을 시도해 볼 수도 있고, 동시에 다양한 아이디어를 가지고 작업할 수도 있습니다. 여기서 중요한 점은 한 브랜치에서 어떤 작업을 하든 다른 브랜치에는 영향을 미치지 않는다는 것입니다. 📌 Master branch 새로운 프로젝트를 생성했을 때, 자동으로 생성되는 기본 브랜치 이름입니다..

오늘은 git commit과 commit message를 수정하는 법에 대해 알아보겠습니다. 목차 [ commit 수정 ] git으로 작업할 때, 새 커밋을 실행한 다음 그 커밋에 관련 파일을 포함시키는 것을 잊었거나, 커밋 메시지를 읽었을 때 오타가 있는 것을 뒤늦게 깨달을 때가 있습니다. 이를 해결하는 방법에 대해 알아보겠습니다. 💡 전제 조건: local에서 commit을 하고 push를 하지 않아 remote에 올라가지 않은 상태여야 한다. 📌 1. git commit --amend $ git status ---- modify: **/js 등등 ---- $ git add. $ git commit -m "Upload filename" $ git commit --amend 위와 같이 amend를 이용..

오늘은 Git commit message에 대한 이런저런 얘기를 나눠보겠습니다. :) [ commit은 원자적으로 유지하자 ] 원자적? 작다? 네 Git 공식 문서에 따르면 commit은 가능하다면 단일 기능이나, 단일 변화, 수정을 포함해야 하며 각각의 커밋은 한 가지에만 집중하는 게 좋다고 합니다. ⭐️ GitHub에 올려진 내 프로젝트 혹은 공부하던 작업물을 올리려고 할 때, 수도 없이 commit을 하고는 하는데요. 혹시, commit은 어떤 기준으로 하는 것이 좋은지 생각해보신적 있으신가요? 한 가지 예시를 들어보도록 하겠습니다. 📌 예시 어떤 쇼핑몰을 만드는 프로젝트를 작성하고 있다고 할 때, 쇼핑몰 안에 있는 물건들의 목록이 있는 파일이 있습니다. 그 파일에는 50가지의 물품이 저장되어 있는..

시작! 목차 📌 webpack.config.js HTML 삽입 미리보기할 수 없는 소스 ⭐️ 1. 모드 설정 mode 매개 변수는 다음 3가지 값 중 하나를 사용할 수 있다. mode: "production", mode 값 설명 development 개발 모드 production 배포 모드 (기본 값) none 기본 최적화 옵션 설정 해제 "production" 모드는 Webpack 모듈 번들링 과정에서 자체적으로 코드를 최적화하여 용량을 줄일 수 있다. ⭐️ 2. 엔트리 설정 entry : 애플리케이션의 진입점 (entry point)를 설정한다. 나는 "main", "additional", "myClothes" 세 가지 엔트리 포인트를 정의하였다. 이는 각각에 해당하는 JavaScript 파일이 엔트..

오늘은 Vite에 대해 알아보겠습니다. [ Vite란? ] Vite(비트)는 프랑스어로 '빠르다'라는 뜻을 가진 단어로, 차세대 프런트엔드 개발 도구입니다. 이름처럼 빌드와 개발 서버 구동 시간이 매우 빠릅니다. 기존에 자주 사용하던 webpack, rollup 등의 빌드 도구는 자바스크립트 언어로 만들어졌지만, Vite가 내부적으로 사용하는 ESBuild는 Go라는 네이티브 언어로 만들어진 도구를 이용해 빌드하기 때문에 빌드 속도가 아주 빠릅니다. Webpack, Parcel등과 비교하면 10배 이상의 빠른 속도를 자랑합니다. ( 안쓸 이유가? ) 또한 개발 서버를 이용할 때도 아주 빠릅니다. 기존 webpack과 같은 모듈 번들러를 이용할 때는 모듈 번들링을 끝낸 후 개발 서버를 구동하므로 시간이 오..

📌 ls list의 축약어이며, 현재 디렉터리 또는 폴더에 있는 콘텐츠를 나열하는 명령어 + ls - a : 숨어있는 파일까지 전부 다 보여줌 📌 open 현재 파일이 있는 경로상의 폴더를 열어준다. 📌 pwd 현재 작업하고 있는 디렉토리를 출력하는 명령어 📌 cd 경로를 옮겨 다닐 수 있는 명령어 📌 touch 파일을 생성해주는 명령어 touch test.js 📌 mkdir 폴더를 생성해주는 명령어 📌 rm 파일을 삭제해주는 명령어 ( 파일을 영구적으로 삭제함, 휴지통을 거치지 않음 ) 📌 rm -rf 폴더를 삭제해주는 명령어 ( 폴더를 영구적으로 삭제함, 휴지통을 거치지 않음 )

Git과 GitHub의 차이점에 대해 알아보겠습니다. [ GIt vs GitHub ] Git과 GitHub는 밀접한 관련이 있지만 같은 것은 아닙니다. 📌 Git Git은 버전관리 소프트웨어이고 누군가의 컴퓨터에서 실행됩니다. 제 컴퓨터에서 실행될 수도 있고, 여러분의 데스크톱에서 실행될 수도 있습니다. 하지만, 인터넷은 필요하지 않습니다. 프로그램이 없으면 다운로드해서 컴퓨터에서 사용하면 됩니다. 인터넷이 없어도 깃을 사용할 수 있는데, 마치 텍스트 에디터나 MS Word, Excel과 같은 문서 프로그램을 사용하는 것과 마찬가지입니다. 인터넷도 필요없고, 회원가입을 할 필요도 없습니다. 즉, 아무 때나 문서를 작성할 수 있습니다. 📌 GitHub GitHub는 웹서비스 입니다. 그리고 GitHub는 ..

Git에 대해 알아보겠습니다. [ Git이란 무엇인가? ] Git을 버전관리 시스템으로 알려져 있고, VCS로 줄여서 말하기도 합니다. 유일한 VCS는 아니지만, 전 세계에서 가장 인기 있는 버전관리 시스템입니다. 버전관리는 파일의 변화를 시간에 따라 추적하고 관리하는데 도움을 주는 소프트 웨어입니다. 어마어마한 소스 코드와 수천 개의 파일 그리고 엄청난 수의 개발자들이 있는 페이스북이나 구글 같은 회사를 생각해 보면, 그들은 모두 병행해서 작업을 하고 있고 매일매일 변화를 만들어내고 있습니다. 그런 변화들을 추적하고 조합하며 때론 되돌리기도 하는데, 그것이 바로 깃같은 버전관리프로그램의 역할입니다. 대부분의 버전관리시스템은 이전 버전의 파일을 다시 볼 수 있게 해주고 버전들 간의 또는 파일들 간의 변화..

.gitignore가 작동하지 않을때 대처하는 법에 대해 알아보겠습니다. .gitignore가 제대로 작동되지 않아서 .gitignore에 게시된 파일이 github에 계속 올라가 있는 경우가 있습니다. git의 캐시가 문제가 되는거라 아래 명령어로 캐시 내용을 전부 삭제 후 다시 add All해서 commit하면 됩니다. git rm -r --cached . git add . git commit -m "fixed untracked files" ref: https://stackoverflow.com/questions/11451535/gitignore-is-ignored-by-git

[ 소스 맵 (Source Map) ] 소스 맵(Source Map)이란 배포용으로 빌드한 파일과 원본 파일을 서로 연결시켜주는 기능입니다. 보통 서버에 배포를 할 때 성능 최적화를 위해 HTML, CSS, JS와 같은 웹 자원들을 압축합니다. 그런데 만약 압축하여 배포한 파일에서 에러가 난다면 어떻게 디버깅을 할 수 있을까요? 정답은 바로 소스 맵을 이용해 배포용 파일의 특정 부분이 원본 소스의 어떤 부분인지 확인하는 것입니다. 이러한 편의성을 제공하는 것이 소스 맵입니다. [ 소스 맵 설정하기 ] 웹팩에서 소스 맵을 설정하는 방법은 아래와 같습니다. HTML 삽입 미리보기할 수 없는 소스 devtool 속성을 추가하고 소스 맵 설정 옵션 중 하나를 선택해 지정해주면 됩니다.