9월의 마지막

최근에 같이 공부하시는 분들이 계신다. 그분들중 한분은 항상 한주의 회고를 쓰신다. 그분의 글을 보며 항상 나도 써야지, 써야지 하다 아직까지도 안쓰고있다. 그 생각이 든지 2달이 지난것 같은데 말이다. 나도 내가 이러한 생각을 했다는 기록을 남기기 위해 앞으로 회고를 남길예정이다. 얼마나 갈지는 모르겠지만 꾸준하게 쓰고싶다. 좋은팀?! 졸업과제 최종보고서를 제출하였다. 아직 최종포스터, 동영상, 시연 등이 남았지만 거의 대부분의 작업이 끝났다고 생각한다. 보고서 제출일이 다가오자 마음이 급해졌다. 팀원끼리 협의를 통해 화요일까지 데드라인이라고 정했다. 하지만 화요일까지 보고서 작업이 안되어있었다. 물론 나도 완벽하게 쓰지는 않았지만 내가 봤을 당시에 다른 팀원들의 진척도는 0 에 가까웠다. 불만이 생겼..

자주 사용하는 로더

style-loader , css-loader css 를 import 하려면 다음과 같은 오류를 만날 수 있다. 이는 css 로더와 style 로더를 설정하지 않았기 때문이다. 다음 처럼 style-loader 와 css-loader 를 포함시켜주면 된다. file-loader CSS 뿐만 아니라 소스코드에서 사용하는 모든 파일을 모듈로 사용하게끔 할 수 있다. 파일을 모듈 형태로 지원하고 웹팩 아웃풋에 파일을 옮겨주는 것이 파일을 옮겨주는 것이 file-loader가 하는 일이다. 가령 CSS 에서 url() 함수에 이미지 파일 경로를 지정할 수 있는데 웹팩을 file-loader를 이용해서 이 파일을 처리한다. webpack 4 에서는 별도로 설치를 해주어야했지만, webpack5 에는 default..

git conflict rebase 로 처리하기

pull requests 를 보낸 해당 브랜치로 갑니다. git remote add upstream https://github.com/PNU-SWEFI/Among git fetch upstream main (upstream/main 이라는 브랜치가 자동으로 생성됩니다!) git rebase upstream/main - 계속 하려면 git rebase --continue - 취소 하려면 git rebase --abort git push origin -f [브랜치 이름]

Github 레포에서 clone 한 프로젝트 branch가 보이지 않을때

어떤상황이었나요? 강의를 보면서 공부를 하고 있는데 repo 를 clone 해서 각 branch 에 실습 코드가 있는 상태였다. 그런데 branch 가 master 밖에 없었다. 이게 무슨일인가. git branch -a 를 해야 remote 에 있는 숨겨진 브랜치 까지 모두 볼 수 있었다. 여담으로 fork 한 레포에서는 git branch -a 를 해도 remote branch 를 볼 수가 없었다.

프로젝트에 gitHooks 적용하는 방법

우선 진행하는 프로젝트에서 git hooks 설정을 다른 분이 모두 해주셨지만, 저는 잘 모르니까 뭔가 답답했습니다. 이런 답답함이 생긴 기회에 궁금함을 해소하려고 합니다. cd .git/hooks 삽질한 과정 더보기 vim 을 통해 pre-commit 을 생성해주었습니다. 다음 내용을 넣었습니다. echo 'Hello Gabia!' 이제 바로 될 줄 알았것만, 뭔가 추가적인 설정이 필요한 듯 했습니다. .git/hooks 경로에 들어와서 ls 명령어를 실행하면 다음과 같은 파일들을 볼 수 있을 겁니다. 이중에서 저는 pre-commit.sample 을 건들여야합니다. (이미지에서는 pre-commit 일텐데 제가 이미 수정하고 난 후라서 그렇습니다. 혼동하지 말길 바랍니다.) 쉽게 말하자면 pre-co..

원격 서버에 리액트 프로젝트 정적 배포한 과정

어떤 상황이였나? 현재 제가 진행하고 있는 프로젝트는 서울에 실 서버를 설치해서 ssh 로 원격접속을 할 수 있게끔 설정을 해놓은 상태입니다. 이제 프런트에서 만든 프로젝트를 빌드하여 정적배포를 하려고 합니다. 저희 서버의 도메인으로 접속을 할 수 있게끔말입니다. 그 과정을 기록해둡니다. 저와 비슷한 처지에 놓으신 분들을 위해, 까먹을 미래의 저를 위해서 말이죠. 우선 서버에 원격 접속을 당연하게 했습니다. 프로젝트의 메인 서버는 Fast API로 구축되어있는 상태입니다. 프로젝트의 리더님께서 정적 배포를 위해 다음 파일을 사용하라고 언급을 해주신 상태였습니다. main.py from fastapi import FastAPI from fastapi.staticfiles import StaticFiles ..

자바스크립트 이벤트 루프

비동기 프로그래밍 함수가 호출되면 함수 코드가 평가됩니다. 이때 실행 컨텍스트가 생성 됩니다. 생성된 실행 컨텍스트는 호출 스택에 푸쉬되고 함수 코드가 실행됩니다. 함수 코드의 실행이 종료되면 함수 실행 컨텍스트는 실행 컨텍스트 스택에서 팝 되어 제거됩니다. 자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 갖는다. 이는 동시에 2개 이상의 함수를 실행할 수 없다는 것을 의미합니다. 실행 컨텍스트 스택의 최상위 요소인 실행 중인 실행 컨텍스트를 제외한 모든 실행 컨텍스트는 대기중인 태스크 들입니다. 자바스크립트 엔진은 싱글 스레드 방식으로 동작합니다. 싱글 스레드 방식은 한 번에 하나의 태스크만 실행할 수 있기 때문에 처리에 시간이 걸리는 태스크를 실행하는 경우 블로킹이 발생합니다. 현재 실행 중인 태..

git 방금 commit 취소하는 방법

졸업과제를 하고 있는데 모든 변경내용을 한꺼번에 커밋해버렸다.. 나란 사람.. 병신 해결하는 방법은.. git reset HEAD^ 위 명령어는 아래 명령어와 동일하다. git reset --mixed HEAD^

imgUrl 을 FormData 형식으로 변환하기

현재 toastUI를 사용해서 이미지를 꾸미는 기능을 추가해보려고 하고 있다. 그런데 이미지를 저장할때 이미지정보를 imgUrl 로 얻을 수 있다. imgUrl 말그대로 url 이다. 다만, url 에 해당 데이터를 입력하면 이미지가 나타날 뿐이다. 그런데 문제점은 현재 서버에서는 이미지 url 이 아닌 FormData 형식으로 보내주고 있기 때문에 imgUrl -> FormData img파일로 바꾸어주고 싶었다. 아래 코드에서 문제점을 해결할 수 있었다. 파라미터인 url 에 imgUrl 을 넘겨주면 formData 에 넣을 수 있는 이미지 파일이 리턴된다. 이미지명은 정해주기가 귀찮아서 faker 라이브러리를 사용하여 랜덤이름으로 넣어주었다. const editorToBase64 = async () ..

React 스크롤 커스텀하기 , 스크롤 색 바꾸기

음 예전에는 scroll custom 을 라이브러리를 사용해서 해봤었는데, 이번에는 그냥 라이브러리 없이 css 만으로 구현해보기로 했다. 2022.05.08 - [공부기록/커뮤니티 프로젝트] - 스크롤바 다시 커스텀.. 스크롤바 다시 커스텀.. 아.. 이 무슨 .. 기존에 사용하던 스크롤바 라이브러리이다. 윈도우에서는 내 입맛에 맛게 커스텀 되었지만, 최근에 맥북으로 바꾸게 된 프로젝트 환경에서는 그렇지 않았다. 즉, 내가 원하는 모 ehddud100677.tistory.com 그런데 구글링을 하고 계속 시도해보는데 왜 때문인지 바뀌지가 않았다. 결국 문제는 해결할 수 있었지만 커스텀을 위해 꼭 필요한 부분을 강조한다. overflow : scroll overflow: scroll 속성이 필히 부여되어..