Think Thing

고정 헤더 영역

글 제목

메뉴 레이어

Think Thing

메뉴 리스트

  • 홈
  • 태그
  • 방명록
  • 분류 전체보기 (20)
    • Study (16)
      • Computer Science (2)
      • Web (6)
      • Git (4)
      • Etc. (4)
    • Life (4)
      • IT (3)
      • EAT (0)
      • Review (1)
홈태그방명록
  • Study 16
    • Computer Science 2
    • Web 6
    • Git 4
    • Etc. 4
  • Life 4
    • IT 3
    • EAT 0
    • Review 1

검색 레이어

Think Thing

검색 영역

컨텐츠 검색

분류 전체보기

  • [Issue] Material-UI는 로컬과 배포 환경(빌드)이 다르다

    2022.03.18 by 2 Mir

  • Git, 어디까지 알고 오셨어요? - 3탄

    2022.02.08 by 2 Mir

  • [Issue] Github Dependabot alerts: follow-redirects 1.14.7

    2022.01.21 by 2 Mir

  • [Issue] Github Dependabot alerts: trim 0.0.1

    2022.01.09 by 2 Mir

  • [Tip] 피그마(Figma) 검은 화면 오류 해결

    2022.01.05 by 2 Mir

  • Git, 어디까지 알고 오셨어요? - 2탄

    2021.12.27 by 2 Mir

  • UTF-8

    2021.12.21 by 2 Mir

  • 한 걸음 Closure 내 맘 (Javascript Closure)

    2021.12.21 by 2 Mir

[Issue] Material-UI는 로컬과 배포 환경(빌드)이 다르다

요즘 나는 작년에 만든 MODIMOA라는 할인 정보 종합 서비스의 추가 작업을 하고 있다. 셀프 디자인의 한계로 모바일 서비스로 만들었던 것을 데스크탑으로 확장하는 작업을 하고 있는데, 이 과정이 마냥 순탄치만은 않다. 왼쪽 사진은 이미 개발을 진행한 상태이고, 오른쪽 사진이 추가로 작업한 것이다. 이 프로젝트에서는 Sass(scss)를 사용하고 있기 때문에 미디어 쿼리를 이용해 모바일인지 데스크탑인지 나눠주었고, 깊은 이해 없이 이것저것 라이브러리를 가져와서 막 짠 코드에 이미 상태들이 뒤엉켜 있었기에 일단 js는 최소한으로 건드리면서 대부분 css 위주로 해결하였다. (최적화.. 막막하다..) 그런데 정렬탭을 정렬 버튼으로 바꾸는 과정에서 생각지도 못한 문제를 발견했고, 이를 오늘 해결해 글을 작성하..

Study/Web 2022. 3. 18. 12:05

Git, 어디까지 알고 오셨어요? - 3탄

마지막 3탄이다. 협업 효율을 높일 수 있는 Git branch 전략에 대해 알아보려고 한다. 이전 문서들은 아래 링크로 달겠다. 1탄 - 로컬 저장소 2탄 - 원격 저장소 🧑‍🤝‍🧑 협업 🙋‍♂️ 협업에 Git이 필요한 이유 1탄에서 Git을 분산 버전 관리 도구라고 했었는데, Git이 commit이라는 코드의 스냅샷을 찍어두기 때문에 개발할 때 편리한 점이 있지만, 협업에 있어서도 merge를 통해 코드를 병합하기 쉬워서 매우 유용하다. 🙋‍♀️ Git 없는 협업 Git이라고 했지만, 버전 관리 도구 없이 협업을 하려면 어떻게 해야 할까? 코드를 복사해서 이메일 또는 PC 카카오톡으로 보내거나, 원격 제어(지금은 VS Code에 Live Share가 생겼지만)로 해야 했을 것이다. 실제로 전자의 경우..

Study/Git 2022. 2. 8. 12:16

[Issue] Github Dependabot alerts: follow-redirects 1.14.7

며칠 전에 github에 dependabot을 설정해놓은 내 레포에 위와 같은 경고가 떴다. follow-redirects라는 해당 Dependancy는 axios에서 사용중이었고, 이전 trim와 동일하게 package.json을 고친다고 해결할 수 있는 문제가 아니었다. 간단하게 > npm audit fix 로 해결할 수 있으나 나는 yarn을 사용하고 있었고, yarn은 > yarn audit 까지만 지원하고 > yarn audit fix 는 지원하지 않았다. 따라서 아래와 같은 절차로 해결하였다. npm install --package-lock-only # 뭔가 package.json이 아닌 node_modules를 기준으로 package-lock.json을 만드는듯했다. npm audit fix..

Study/Etc. 2022. 1. 21. 22:06

[Issue] Github Dependabot alerts: trim 0.0.1

프로젝트 진행 도중, Github의 Dependabot alerts가 떠서 매우 당황했었다. trim이라는 라이브러리의 0.0.1 버전에서 문제가 있어 뜨는 경고였는데, 얘는 내 의지로 설치한 라이브러리가 아니었다. 그래서 평소에는 왜 있는지 생각해본 적 없던 package-lock.json을 (나는 yarn을 쓰기에 yarn.lock을) 열어보았다. 파일 내에서 trim을 검색해보니 remark-parse라는 라이브러리에서 설치한 것이었고, 이 라이브러리 또한 내 의지로 설치한 것이 아니었기에 거꾸로 검색해보니 prettier에서 쓰고 있는 라이브러리였다. 혼란스러웠던 것은 기존에 prettier를 사용할 때에는 문제를 일으키지 않다가 왜 이번에 문제가 생긴 것인지, 구글링해도 안 나오는지였는데, 결론..

Study/Etc. 2022. 1. 9. 22:20

[Tip] 피그마(Figma) 검은 화면 오류 해결

2016년에 샀던 노트북으로 쭉 개발해오다가 지난 여름 부스트캠프를 하면서 도저히 더이상은 안되겠다 싶어 데스크탑을 구매했다. 근데 웬걸, 피그마(Figma)가 노트북으로 했을 때보다 더 많이 렉이 걸렸고, 접속조차 되지 않았다. 데스크탑 앱을 설치해도 마찬가지였고, 접속을 하더라도 이런 회색 화면이거나 검은 화면이었다. 새로 고침을 여러번하면 어쩌다가 접속이 되는데, 여간 불편한 것이 아니었다. 피그마(Figma)란? 프로토타입을 만들 수 있는 실시간 디자인 협업 도구 데스크탑 앱도 있지만, Slack처럼 설치 없이 웹에서도 동작하는 것이 특징 잠시 자랑겸 스펙을 짚고 넘어가자면 본인의 데스크탑의 경우 인텔의 i7-11700 CPU와 32GB의 RAM, RTX 3070 GPU를 사용하고 있어 적당한 게..

Study/Etc. 2022. 1. 5. 01:28

Git, 어디까지 알고 오셨어요? - 2탄

2탄으로 돌아왔다. 1탄에서는 로컬에서 파일 상태에 따라 영역을 나눴다면, 이번에는 Branch와 Github의 원격 저장소에 업로드하는 과정을 정리해보려고 한다. 🌠 저장소(Remote) ⭐ 로컬 저장소 로컬 저장소는 1탄에서 소개했던 대로 우리가 실제로 작업하는 공간이다. TMI지만, git clone 또는 git init 했을 때 생기는 .git 폴더가 찐 로컬 저장소이고, 우리가 열심히 코드 작성하는 프로젝트 폴더 전체가 working directory라고 할 수 있다. ☁️ 원격 저장소 Git과 Github의 차이에 대해 먼저 간단히 짚고 넘어가겠다. Git : 버전 관리 시스템 Github : Git Repo.를 호스팅 해주는 서비스 생소할 수 있는데, Git이라는 것은 우리가 일반적으로 생각..

Study/Git 2021. 12. 27. 23:11

UTF-8

1학년 때 컴퓨터 개론에서 아스키 코드(ASCII-code), 유니 코드(Uni-code)에 대한 내용을 살짝 스쳐간 기억이 있다. 둘 다 숫자로 문자를 표현하는 방식인데, 간단히 짚고 넘어가자면 아스키 코드 - 128개(7비트)의 문자를 사용 - C언어의 char는 1바이트인데? => 남은 1비트는 통신 에러 검출을 위한 패리티 비트(Parity Bit) - 영어만 존재 => ASCII의 A가 American임 유니 코드 - 전 세계 문자를 표현하기 위해 국제 표준 코드 등장 - 처음에는 2바이트(65,536)에 모두 담을 수 있다고 생각했지만, 어림도 없었음 - 계속 업데이트 중(14.0 버전이 지난 9월 22일에 나왔다고 함) - UTF-8, UTF-16, UTF-32 등 다양한 인코딩 방식이 존재..

Study/Computer Science 2021. 12. 21. 22:17

한 걸음 Closure 내 맘 (Javascript Closure)

Closure가 뭔데? 💁 : Javascript에서의 Closure는 내부 함수가 외부 함수의 지역 변수에 접근하고 있을 때, 외부 함수가 실행이 끝나서 지역 변수가 소멸되었어야 함에도 여전히 내부 함수에서 접근이 가능한 매커니즘을 의미한다. 엥 그래서 Closure가 뭐야? 💁 다음과 같은 상황에서 우리는 Closure를 볼 수 있다. function makeFunc() { var name = 'Think Thing'; function displayName() { // Closure 형성 alert(name); } return displayName; } var myFunc = makeFunc(); // myFunc변수에 displayName을 리턴 myFunc(); 이 예시에서 makeFunc()의 ..

Study/Web 2021. 12. 21. 17:57

추가 정보

인기글

최신글

페이징

이전
1 2 3
다음
TISTORY
Think Thing © LeeMir
메일

티스토리툴바

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.