TIL
[모던리액트 딥다이브] 2024-04-04 DIL
lemonarr🍋
2024. 4. 4. 23:57
모던 리액트 딥다이브 week5
2024-04-04 DIL
| 주차 | DIL 범위 | 날짜 | 개인 진도 |
|---|---|---|---|
| 5주차 | 9장 | 2024-04-04 | 529-570p |
개념 채우기
SWC(Speedy Web Compiler)란?
- 자바스크립트 컴파일러지만 웹펙과 같은 자바스크립트 번들러의 기능도 제공하고 있음.
- Rust 기반의 플랫폼임.
- 동시에 여러 파일 변환(병렬처리)이 가능하여 빠르다.
- 기존 Babel(트렌스파일링) 과 Terser(코드 경량화)를 대체함. /각각 17배, 7배 더 빠름.
Babel vs SWC
- Babel: 트렌스파일러. 싱글스레드 언어인 자바스크립트로 작성됨.
- SWC: 동시에 여러 파일들이 변환가능함. / Babel 보다 20배 빠름.
SWC가 빠른 이유?
- 병렬처리를 고려하여 설계된 언어인 Rust를 사용하기 때문!
- 의존성이 없는 파일들을 동시에 변환할 수 있다.
- Babel 과 Terser는 자바스크립트 언어로 구현되어 있기 때문에 한번에 한 개의 파일만 변환 가능.
- 싱글스레드에서 돌려도 속도가 빠르다고 한다..
참고자료
https://fe-developers.kakaoent.com/2022/220217-learn-babel-terser-swc/
Github Action이란 무엇인가?
- 빌드, 테스트 및 배포 파이프라인을 자동화할 수 있는 지속적{통합(CI) + 배포(CD)} 플랫폼이다.
- 모든 풀 요청을 빌드/ 테스트하는 워크플로를 생성하거나, Merge 된 풀 요청을 프로덕션에 배포할 수 있다.
- YAML 구문을 사용하여 워크플로를 정의한다.
- .github/workflows라는 디렉터리의 코드 repository에 별도의 YAML 파일로 저장됨.
Workflow
- 기본구성단위.
- 하나 이상의 작업을 포함할 수 있다.
- 푸쉬 or 풀 요청과 같은 이벤트에 의해 트리거된다.
- 가장 최상위 개념으로 yaml으로 작성됨.
Events
- 워크플로 실행을 트리거하는 특정 활동이나 규칙.
- ex.) pull request, issue, push, cron, webhook 등의 이벤트가 있음.
- 특정 요구사항에 따라 워크플로를 트리거하는 사용자 지정 이벤트를 만들 수 있다.
Jobs
- 워크플로 내에서 실행되는 개별 작업.
- 'Runners' 라는 가상 머신에서 실행.
- 하나 이상의 단계(steps)를 포함할 수 있음.
- 가상 환경의 인스턴스에서 실행됨.
- 작업은 종속성에 따라 병렬/ 순차적으로 실행될 수 있다. (의존관계 or 독립적)
Steps
- task들의 집합. 작업 내 가장 작은 단위.
- 워크플로 파일에 지정된 순서대로 실행되며, 각 단계는 동일한 인스턴스 내에서 실행됨.
Actions
- 워크플로의 가장 작은 블럭./ Job을 만들기 위해 step들을 연결할 수 있다.
- 재사용 가능한 컴포넌트.
- 작업은 일반적으로 별도의 리포지토리에 저장,
- 해당 리포지토리 이름으로 워크플로 파일에서 참조됨.
Runners
- 워크플로가 트리거될 때 실행하는 서버.
- 각 Runner는 1번에 1개의 Job을 실행할 수 있다.
- 작업이 실행되는 가상 머신(Github-hosted runner) 또는 자체 호스팅 환경(Self-hosted runner)으로 나뉜다.
Environment Variables and Secrets
- Environment Variables: 워크플로 내의 작업 및 스크립트에서 액세스 할 수 있는 데이터를 저장하는데 사용됨.
- Secrets: 액세스 토큰 or API 키와 같은 민감한 데이터를 저장하는데 사용되는 암호화된 환경변수.
민감한 정보 사용할 경우 Gibhub/Settings/secrets에 저장하여 환경변수로 사용할 수 있음.
** 환경변수: 프로세스가 컴퓨터에서 동작하는 방식에 영향을 미치는, 동적인 값들의 모임.
Artifacts and Caching
- Artifacts: 빌드 출력 or 테스트 결과와 같이 나중에 저장하고 사용할 수 있는 워크플로에서 생성된 파일.
- Caching: 워크플로 실행 간에 데이터를 저장하고 검색하는데 사용됨, 이전에 다운로드한 종속성 또는 빌드 출력을 재사용하여 프로세스 속도를 높일 수 있음.
캐시를 생성하면 저장소의 모든 workflow에서 사용할 수 있음.
Jenkins란 무엇인가?
- CI/CD 환경을 구축하기 위한 도구.
- 참고할 자료가 많다.
- 파이프라인을 한 곳에서 관리할 수 있다는 것, 처리속도가 빠르다는 것이 장점.
- Github action 보다 CI/CD 구성이 어렵다.
환경 설정 시, 버전문제, Webhook 설정, 파이프라인 설정이 쉽지 않다.
UI에서 관리하기에는 Github action 보다 편하다.
CI/CD를 각기 다른 플랫폼으로 적용할 수 있다.(ex. Jenkins-CD/ Github Action-CI)
- CI-Github Action: PR 하는 과정에서 테스트코드가 제대로 작동되는지 확인하는 점이 런타임 오류를 줄이는데 도움이 되어
사용하였다고 한다. - CD-Jenkins: public IP를 설정할 경우 Application 서버는 Client에 의해 바이러스나 해킹 등의 보안 이슈가 발생할 수 있기 때문에 사용하였다.
- 결론: 프로젝트 상황에 따라 툴을 사용해라!