1교시

동영상을 보세요: 1교시 소개.

이 수업에서는 가장 작은 문제인 한 글자 텍스트 변경을 다룹니다. 이를 위해 우리는 다음을 배워야 합니다:

GitLab 개발 환경 설정 방법.
GitLab 코드 베이스 탐색 방법.
GitLab 프로젝트에서 병합 요청 생성 방법.

이 3가지를 배운 후, GitLab 팀원이 라이브 코딩 데모를 진행할 것입니다.

데모에서는 그들이 배운 모든 것을 사용하여 이러한 작은 문제 중 하나를 해결하여 여러분이 직접 문제를 해결할 수 있도록 할 것입니다.

우리가 라이브 코딩을 할 문제와 매우 유사한 문제 목록이 여기 “링크된 항목” 섹션에 있으며, 지금 이 중 하나에 댓글을 달아 할당받는 것이 좋습니다.

GDK란 무엇인가요?

동영상을 보세요: GDK란 무엇인가요??

GDK (GitLab Development Kit)는 개발자가 자신의 컴퓨터에서 GitLab을 실행하고 테스트할 수 있는 로컬 인스턴스입니다.

프론트엔드 전용 애플리케이션과 달리 GDK는 백엔드 서비스, API 및 로컬 데이터베이스를 포함한 전체 GitLab 애플리케이션을 실행합니다.

이를 통해 개발자는 변경을 만들고, 실시간으로 테스트하고, 수정 사항을 검증할 수 있습니다.

GDK 사용 팁:

문제 해결 문서: GDK에서 문제에 직면했을 때, GDK 저장소의 문제 해결 문서를 참조하세요.
이 리소스는 일반적인 문제를 해결하는 데 도움이 되는 유용한 명령어와 팁을 제공합니다.
Rails 콘솔 사용: Rails 콘솔은 GitLab의 로컬 인스턴스와 상호작용하는 데 필수적인 도구입니다.
gdk rails c를 실행하여 액세스할 수 있으며, 기능 플래그를 활성화하거나 비활성화하고, 백엔드 작업을 수행하는 등의 작업을 할 수 있습니다.
업데이트 유지: gdk update를 실행하여 정기적으로 GDK를 업데이트하세요.
이 명령어는 GitLab 프로젝트의 최신 브랜치와 GDK 및 그 종속성의 최신 브랜치를 가져옵니다.
GDK를 항상 최신 상태로 유지하는 것은 최신 버전의 GitLab로 작업하고 최신 버그 수정을 받을 수 있도록 도와줍니다.

추가 지원이 필요하거나 특정 질문이 있는 경우, Discord 또는 기타 지원 채널을 통해 GitLab 커뮤니티에 문의할 수 있습니다.

GDK를 로컬로 설치하고 사용하기

동영상을 보세요: GDK 설치하기.

최신 설치 지침은 GitLab Development Kit 문서를 참조하세요.

다음은 단계별 요약입니다:

필수 조건:
- 16GB RAM. 만약 이보다 적다면 Gitpod 사용 고려하기
- 머신에 Git이 설치되어 있는지 확인하세요.
- Visual Studio Code와 같은 코드 편집기를 설치하세요.
- 계정 만들기 또는 로그인하기하여 커뮤니티 회원 그룹에 가입하세요.
설치:
- GitLab Development Kit (GDK)를 설치할 디렉토리를 선택하세요.
- 터미널을 열고 선택한 디렉토리로 이동하세요.
- 터미널에서 설치 스크립트를 다운로드하고 실행하세요:
```
curl "https://gitlab.com/gitlab-org/gitlab-development-kit/-/raw/main/support/install" | bash
```
- 안전을 위해 신뢰할 수 있는 출처의 스크립트만 실행하세요.
- 설치 과정은 약 20분 이상 걸릴 수 있습니다.
리포지토리 선택:
- 주요 GitLab 리포지토리를 클론하는 대신, 커뮤니티 회원을 위해 추천되는 커뮤니티 포크를 사용하세요.
- 커뮤니티 포크를 설치하는 데 제공된 지침을 따르세요.
GDK 구조:
- 설치 후 GDK 디렉토리가 생성됩니다.
- GDK 디렉토리 안에 GitLab 프로젝트 폴더가 있습니다.
GDK 사용:
- GDK는 설치판과 상호작용할 수 있는 많은 명령어를 제공합니다. 이 명령어를 실행하려면 GDK 또는 GitLab 폴더 안에 있어야 합니다.
- GDK를 시작하려면 터미널에서 gdk start 명령어를 실행하세요.
- 터미널에서 gdk help를 실행하여 사용 가능한 명령어와 옵션을 탐색할 수 있습니다.

추가 질문이나 문제가 있다면 문서를 참고하거나 커뮤니티 지원을 요청하세요.

Gitpod을 사용하여 GDK를 로컬에서 실행하는 대신

비디오를 확인하세요: GitLab과 함께 Gitpod 사용하기.

Gitpod은 Gitpod 서버에서 GitLab Development Kit(GDK)를 로컬 머신에서 실행하는 대신 가상 머신을 실행할 수 있는 서비스입니다.
웹 기반의 통합 개발 환경(IDE)을 제공하여 코드를 편집하고 GDK를 실행하면서 확인할 수 있습니다.
Gitpod은 GDK 환경을 신속하게 설정하고 실행하거나, GDK를 로컬에 설치하지 않고도 작은 병합 요청을 만들거나, 자원이 부족할 수 있는 머신에서 GDK를 실행하는 데 유용합니다.

Gitpod을 사용하려면:

GitLab 커뮤니티 포크에 접근 요청하기. 또는, 자체 공개 포크를 생성할 수 있지만, 커뮤니티 포크의 이점을 놓치게 됩니다.
GitLab 커뮤니티 포크 웹사이트로 이동하여 Edit를 선택한 다음 Gitpod를 선택합니다.
에디터(VS Code 데스크탑 또는 브라우저)와 컨텍스트(대개 main 또는 master 브랜치)와 같은 설정을 구성합니다.
Open을 선택하여 Gitpod 작업 공간을 생성합니다. 이 과정은 최대 20분이 걸릴 수 있습니다. GitLab Development Kit(GDK)는 Gitpod 작업 공간에 설치됩니다. 이 설치는 로컬에서 전체 GDK를 다운로드하고 설치하는 것보다 빠릅니다.

작업 공간이 생성된 후, 선택한 IDE가 웹 브라우저에서 실행됩니다. 필요에 따라 데스크탑 IDE에 연결할 수도 있습니다.
Gitpod을 로컬에서 VS Code를 사용하는 것처럼 다루세요. 브랜치를 만들고, 코드 변경을 하고, 해당 변경을 커밋하며, 커뮤니티 포크로 푸시합니다.

기타 팁:

작업 공간이 시간 초과되는 것을 방지하기 위해 코드를 정기적으로 푸시하는 것을 잊지 마세요. 유휴 작업 공간은 결국 파기됩니다.
필요에 따라 Gitpod 작업 공간 설정을 사용자 정의하세요. 예를 들어, GitLab 프론트엔드를 공개적으로 이용 가능하게 만들 수 있습니다.
시간이 부족해지면 Discord 서버의 지원 팀에 문의하세요.
Gitpod 작업 공간에서 gdk start 및 gdk status와 같은 명령어를 사용하여 문제를 해결하세요. 이 경우에도 로컬에서 실행 중인 것처럼 작업합니다.

이 단계에 따라 Gitpod을 활용하여 GitLab Development Kit을 효율적으로 개발할 수 있습니다. 로컬 설치가 필요 없습니다.

GitLab 코드베이스 탐색

비디오를 확인하세요: GitLab 코드베이스 탐색 방법.

GitLab 코드베이스를 탐색하는 방법을 이해하는 것은 기여자에게 필수적입니다.
코드베이스를 탐색하고 특정 파일을 찾는 것은 어려울 수 있지만, 변경 사항을 만들고 문제를 효과적으로 해결하는 데 중요합니다.
여기에서는 파일을 찾고 GitLab에서 렌더링되는 위치를 찾는 단계별 프로세스를 살펴보겠습니다.

작업할 파일을 이미 알고 있고, 그 파일이 렌더링되는 위치를 찾고 싶다면:

파일의 목적을 이해하기 위해 단서를 수집하십시오. 파일 자체에서 해당 내용이나 키워드와 같은 관련 정보를 찾아보세요.
파일 경로(또는 폴더 구조)를 확인하여 파일이 렌더링될 위치에 대한 통찰력을 얻을 수 있습니다.
GitLab의 많은 라우팅은 폴더 구조와 매우 유사합니다.
이 구성 요소가 사용되는 기능 중 어떤 것인지 파악할 수 있다면, GitLab 사용자 문서를 활용하여 해당 기능 페이지로 가는 방법을 알아낼 수 있습니다.
구성 요소 계층을 따라가고, 파일 이름으로 전역 검색을 수행하여 이 구성 요소를 렌더링하는 부모 구성 요소를 식별하십시오.
구성 요소의 계층을 계속 따라가며 알아보거나 GitLab 사용자 문서에서 검색할 수 있는 기능으로 되돌아갑니다.
git blame을 사용하여 GitLens와 같은 확장을 활용하여 최근에 변경된 MR을 찾습니다.
대부분의 MR은 따라할 수 있는 “검증 방법” 섹션을 포함하고 있으며, MR에 해당 섹션이 없으면 이전 변경 사항을 찾거나 검증 단계가 있는 것을 발견할 때까지 계속 확인합니다.

수정해야 하는 페이지를 알고 있고 파일 경로를 찾고 싶다면 다음과 같은 방법을 시도해 보세요:

고유하며 변수가 포함되지 않은 콘텐츠를 찾아 번역 변수 검색이 가능하도록 하세요.
Vue Dev Tools를 사용하여 구성 요소 이름을 찾습니다.
HTML의 구성 요소에서 data-testid, id 또는 고유한 모양의 CSS 클래스와 같은 고유 식별자를 찾아봤다면, 이를 사용하여 전역적으로 코드베이스에서 해당 식별 문자열을 검색합니다.

좋은 병합 요청 작성하기

비디오 보기: 좋은 MR 작성 방법.

병합 요청을 작성할 때 유의해야 할 몇 가지 중요한 사항이 있습니다:

여러분의 MR은 GitLab 프로젝트 문서의 영구적인 부분이 됩니다. 이는 사람들이 특정 코드가 왜 이렇게 작동하는지, 그리고 왜 대안 솔루션을 사용하지 않는지를 이해하는 데 도움을 줄 수 있습니다.
최소 2명의 다른 엔지니어가 여러분의 코드를 검토할 것입니다. 효율성을 위해(여러분이 작성한 코드처럼) MR을 정확하게 작성하는 데 조금 더 오랜 시간이 걸리는 것이 좋습니다. 이렇게 하면 다른 사람들이 읽기에 더 빠르고 쉽습니다.
GitLab에서 생성한 MR은 공개됩니다. 이는 여러분이 취업 시 특히 자랑스러운 MR의 링크를 포트폴리오 페이지에 추가할 수 있음을 의미합니다.
MR은 기술 문서이므로 기술적인 문체를 구현하려고 노력해야 합니다. 만약 그게 무엇인지 모른다면, Google의 기술 글쓰기에 대한 짧고 강력하게 추천되는 강좌가 있습니다. GitLab 문서에 기여하고 있다면, GitLab에서 제공하는 기술 글쓰기 기초 과정도 이용할 수 있습니다.

라이브 코딩

비디오 보기: 1단계 코드 시연.

이제 여러분의 첫 MR을 완성할 차례입니다. 우리가 방금 완료한 것과 매우 유사한 문제 목록이 여기 “링크된 항목” 섹션에 있습니다. 기여해 주셔서 감사합니다! (남은 항목이 없다면 Discord 또는 기타 지원 채널에서 알려주시면 더 많은 항목을 찾아드리겠습니다.)

1교시