티스토리챌린지 (5) 썸네일형 리스트형 [GitHub] 커밋 컨벤션을 알아보자 코드 작업을 하고 깃허브에 푸시하기 전에 우리는 커밋 메시지를 작성합니다.# Bad: 커밋 메시지에 의미가 없다git commit -m "버그 수정"# Bad: 커밋 메시지가 너무 길다git commit -m "사용자가 인증 요청을 보내면 사용자에게 인증 번호를 문자로 전송하는 기능 추가"저는 처음으로 프로젝트에 참여했을 때는 대체로 이런식으로 커밋을 했습니다.하지만 이런 식의 커밋은 히스토리를 봐도 변경사항을 파악하기 힘들고 팀원들도 제가 무슨 작업을 했는지 명확히 알 수 없었습니다.이를 개선하기 위해 도움이 됐던 방법을 적어보고자 합니다.커밋 메시지 템플릿가장 먼저 커밋 메시지 구조를 구성하는 것입니다.type: 제목body (옵션)footer (옵션)여기서 type은 커밋의 종류를 나타내며, 주로 .. [GitHub] 깃 이슈 알아보기 프로젝트를 진행하면 레포지토리에서 깃 이슈 탭을 확인해보신 적이 있을 겁니다.처음에는 단순히 버그 리포트만 한다고 생각하며 넘겼는데 프로젝트에서 직접 사용해보면서 그게 아니라고 느꼈습니다.오늘은 깃 이슈에 대해서 알아보겠습니다.Git Issue깃 이슈는 다음과 같은 항목을 작성할 수 있습니다.해야 할 일 기록버그 리포트새로운 기능 제안팀원들과의 토론외에도 프로젝트와 관련된 거의 모든 것을 기록하고 소통하는 공간입니다. Issue Template깃 이슈에 사용할 템플릿을 깃허브에서 등록할 수 있습니다.설정에 들어가 General 탭을 확인해보면 템플릿을 설정할 수 있는 항목이 있습니다.# .github/ISSUE_TEMPLATE/feature.md---name: 기능 개발about: 새로운 기능 개발---.. [Open License] 소프트웨어 자유와 공유의 기준 오픈 라이선스는 저작물의 사용, 수정, 공유를 허용하는 제도입니다.소프트웨어 개발에서는 특히 중요한데, 코드를 어떻게 사용하고 배포할 수 있는지를 명시해줍니다.오늘은 이 오픈 라이선스에 대해서 알아보겠습니다.오픈 라이선스의 종류GPL은 가장 엄격한 카피레프트 라이선스입니다.카피레프트는 저작권에 대응하는 개념으로, 자유롭게 수정, 사용하고 배포할 수 있는 권리를 부여하면서도 그 2차적 저작물도 동일한 자유를 보장하도록 강제하는 개념입니다.이 라이선스는 수정된 코드도 반드시 GPL로 공개하여야 합니다.GPL의 대표적인 예시로는 리눅스 커널이 있습니다.MIT는 가장 자유로운 라이선스 중 하나입니다.저작권 표시만 유지한다면 상업적 수정, 이용, 배포가 모두 자유롭게 가능합니다.대표적인 예시로는 JQuery와 N.. [VSCode] Snippet 사용하기 리액트 프로젝트를 진행하면서 같은 구조의 컴포넌트를 생성하는 일이 많았습니다.오늘은 개발의 효율성을 높여주는 스니펫에 대해 알아보겠습니다.스니펫의 개념스니펫은 재사용 가능한 소스 코드, 기계어, 텍스트의 작은 부분을 의미합니다.쉽게 말해 자주 사용하는 코드 조각을 저장해두고 필요할 때 빠르게 불러와 사용할 수 있는 기능입니다.예를 들어, 제가 느꼈던 리액트 컴포넌트는 이런 기본 구조를 가지고 있습니다.import React from 'react';const Component = () => { return ( );};export default Component;스니펫을 활용하면 이런 반복적인 코드를 몇 번의 키스트로크로 생성할 수 있습니다. VSCode 스니펫제가 사용했던 스니.. [React] Context 알아보기 리액트는 상태를 공유할 때 Props를 사용합니다.우리가 다크 모드를 적용하려고 한다면,자식 컴포넌트들은 최상위 App 컴포넌트로부터 Props를 전달받을 것입니다.애플리케이션이 고도화될수록 컴포넌트는 무수히 증가합니다.이 때, Props에 변경점이 있다면 하위 컴포넌트를 수정하고 또 수정하고...😵이를 해결할 수 있는 Context를 오늘 알아보겠습니다.🐸 Context리액트 컨텍스트란 전역으로 데이터를 공유할 수 있도록 고안한 방법입니다.컨텍스트를 사용하면 컴포넌트마다 Props를 넘겨주지 않아도 데이터를 사용할 수 있습니다.🐸 Context API// /context/ThemeContext.tsimport { createContext } from 'react';const defaultValue.. 이전 1 다음
