Etc.

Etc.

[styled-components] it looks like an unknown property “X" is being sent through to the DOM

경고 내역 styled-components: it looks like an unknown prop "category" is being sent through to the DOM, which will likely trigger a React console error. If you would like automatic filtering of unknown props, you can opt-into that behavior via (connect an API like @emotion/is-prop-valid ) or consider sing transient props ($prefix for automatic filtering.) 경고 발생 경로 위의 Badge는 button 태그로 만들어져 있는데, 해당 H..

Etc.

[ESLint] Unable to resolve path to module

오류 발생 경로 React + TypeScript 프로젝트에 eslint, prettier를 적용하던 중 src 하위에 파일 경로가 제대로 있음에도 다음과 같은 에러가 발생했다. 오류 내역 Unable to resolve path to module 오류 원인 및 해결 방법 "settings": { "import/resolver": { "node": { "extensions": [".js", ".jsx", ".ts", ".tsx"] } } } .eslintrc.js 파일에 위와 같은 구문을 추가한다. 이후 .eslintrc.js 파일을 저장해보면 이전과 같은 파일임에도 불구하고 에러가 나지 않는 것을 확인할 수 있다. [참고 자료] https://stackoverflow.com/questions/55198..

Etc.

[GitHub] 협업을 위한 Organization 만들기

깃허브에서는 팀 작업용 조직 계정을 사용해 협업을 진행할 수 있다. 개인 계정으로 조직 계정에 참여해 공유 프로젝트에 대해 공동 작업을 할 수 있는데, 바로 Organization이다. Organization 생성하기 GitHub 상단 네비바의 + 버튼을 누르면 New 관련 메뉴들이 나오는데, 그중 New organization을 클릭한다. 학업용 프로젝트를 위한 organization이므로 무료인 Create a free organization을 클릭한다. Organization account name에는 해당 조직 계정의 이름, Contact email에는 조직 계정과 관련해 컨택할 수 있는 이메일을 입력한다. 비즈니스용 조직 계정이라면 A business tor institution, 그 외의 경우..

Etc.

[코딩애플 / git] git & github(6)_stash 사용법

📚 코딩애플의 '매우 쉽게 알려주는 git & github'을 수강하며 배우거나 추가적으로 찾아본 것들을 정리한 내용입니다. git stash? 현재 작업 중인 코드를 어떠한 이유로 잠시 '보관'해야 하지만 'commit'까지는 부담스러울 때, 커밋하지 않아도 나중에 다시 돌아와서 작업을 이어갈 수 있도록 git stash 명령어를 사용할 수 있다. git stash 사용법 # 파일들을 최근 commit상태로 돌리면서, 아직 커밋하지 않은 코드는 임시보관하기 git stash # stash할 때 메모도 같이 입력하기 git stash save "메모" # stash 되어있는 코드 목록을 전부 출력하기 git stath list git stash를 사용하는 이유 코드를 주석처리해 두는 것과 비슷한데, 주석..

Etc.

[코딩애플 / git] git & github(5)_branch 사용법

📚 코딩애플의 '매우 쉽게 알려주는 git & github'을 수강하며 배우거나 추가적으로 찾아본 것들을 정리한 내용입니다. 브랜치(branch)를 사용한다는 것은? branch의 뜻은 나뭇가지, 또는 갈라지다이다. git에서 프로젝트의 주축이 되는 메인 브랜치를 나무의 기둥으로 표현한다면, 그것을 기반으로 추가 기능 또는 작업 영역을 만들 때 나뭇가지가 뻗어나가듯 브랜치를 사용한다. git의 공식문서에서는 브랜치를 다음과 같이 설명하고 있다. 모든 버전 관리 시스템은 브랜치를 지원한다. 개발을 하다 보면 코드를 여러 개로 복사해야 하는 일이 자주 생긴다. 코드를 통째로 복사하고 나서 원래 코드와는 상관없이 독립적으로 개발을 진행할 수 있는데, 이렇게 독립적으로 개발하는 것이 브랜치이다. 왜 브랜치를 사..

Etc.

[코딩애플 / git] git & github(4)_push, clone, pull, fetch 사용법

📚 코딩애플의 '매우 쉽게 알려주는 git & github'을 수강하며 배우거나 추가적으로 찾아본 것들을 정리한 내용입니다. 내 코드를 github에 올리기 repository git이 파일 버전을 저장해두는 장소를 repository라고 한다. 로컬 작업 폴더엔 숨겨진 .git 폴더가 있는데 그것이 repository이다. 실제로 개발할 땐 온라인 repository를 많이 사용한다. (내 컴퓨터에서 만들어둔 저장소를 백업!) push : 로컬 저장소에서 원격 저장소로 옮기기 git push -u 원격저장소주소 main # 원격저장소에 특정 브랜치 푸시하기 git switch 푸시할브랜치명 git push origin 푸시할브랜치명 #origin 안될경우 원격레포주소.git 로컬저장소의 main 브랜치..

Etc.

[코딩애플 / git] git & github(3)_restore, revert, reset 사용법

📚 코딩애플의 '매우 쉽게 알려주는 git & github'을 수강하며 배우거나 추가적으로 찾아본 것들을 정리한 내용입니다. 실수했을 때 되돌아가는 3가지 방법 commit 고유 id 확인하기 git log --online git restore # 파일 하나를 최근 commit된 상태로 되돌리기 git restore 파일명 # 입력한 파일을 특정 커밋아이디 시점으로 복구하기 git restore --source 커밋아이디 파일명 # 그냥 참고!, 특정 파일 staging 취소하기 git restore --staged 파일명 파일 하나가 잘못되었을 경우 ctrl + z를 여러 번 눌러도 되지만 수정 사항이 너무 많다면 위의 명령어 하나로 처리할 수 있다. id 입력 없이 일반적인 방법으로 restore를 ..

Etc.

[코딩애플 / git] git & github(2)_branch, merge 사용법

📚 코딩애플의 '매우 쉽게 알려주는 git & github'을 수강하며 배우거나 추가적으로 찾아본 것들을 정리한 내용입니다. git에서 branch 만들기 branch 만들기 하나뿐인 원본 파일에 끊임없이 코드를 추가하다가 파일이 망가진다면 어떻게 해야 할까? 이런 걱정 없이 새로운 기능을 추가하고 싶다면, 프로젝트의 복사본을 만들어서 그곳에 먼저 개발해 보는 것도 좋은 방법이다. git에서는 위와 같은 기능을 branch를 이용해 복사본을 손쉽게 만들 수 있다. # 프로젝트 사본 만들기 git branch 브랜치이름 # 브랜치로 이동하기 git switch 브랜치이름 # 메인 브랜치로 돌아가기 git switch main # 설정에 따라 main이 아니라 master일 수도 있음 # 어떤 브랜치에 있는..

Etc.

[코딩애플 / git] git & github(1)_add, commit, diff 사용법 (ft. VSCode)

📚 코딩애플의 '매우 쉽게 알려주는 git & github'을 수강하며 배우거나 추가적으로 찾아본 것들을 정리한 내용입니다. git 2일 전 코드로 되돌아가려면? 예기치 못한 오류로 인해 2일 전에 작성했던 내용이 필요하다면 어떻게 복구할 수 있을까? 매일매일 파일의 복사본을 만들거나, 버전 관리 소프트웨어를 사용해야 할 것이다. 버전 관리 시스템이란 파일 변화를 시간에 따라 기록했다가 나중에 특정 시점의 버전을 다시 꺼내올 수 있는 시스템이다. 위의 스크린샷처럼 게임은 파일 별로 세이브데이터를 저장해 뒀다가, 이후에 내가 원하는 버전으로 다시 플레이하거나 삭제하며 관리할 수 있다. 이처럼 코드는 git을 이용해 작성한 내용을 버전 별로 관리할 수 있다. 작업한 코드를 기록하고 보관할 수 있고, 이전 버..

Etc.

[Node.js / AWS Lambda / Discord] 시간 자동 알림 디스코드 웹 훅 만들기

웹훅을 만들게 된 이유 ✅ 항해99의 공부시간 기록 시스템은 공부를 시작할 때 '체크인', 공부를 끝마칠 때 '체크아웃' 버튼을 눌러 해당 시간을 누적하는 방식으로 공부 시간을 측정한다. ✅ 공부시간 기록 시스템은 익일 오전 5시에 초기화되고, 5시 이전 마지막으로 기록된 체크아웃 시간을 기준으로 공부시간이 기록된다. ✅ 만약 5시까지 연이어 공부 중이었고 시기를 놓쳐 5시 직전에 체크아웃을 미리 눌러두지 못했다면, 해당 시간이 기록되지 않는 마음 아픈 현상이 발생했다. (아까운 내 기록🥲) ✅ 따라서 디스코드 알림 웹훅을 만들어 리셋 시간 5분 전인 오전 4시 55분, 체크아웃을 해야 한다는 알림 메세지를 받도록 하고자 한다. 왜 디스코드를 이용했나? 핸드폰 알림으로 다섯시를 맞추면 되지 않느냐고 묻는..

Olivia Kim
'Etc.' 카테고리의 글 목록