본문 바로가기

업무이야기

(46)
퍼블리셔, 프론트엔드 추천 크롬 확장프로그램 이번 포스팅에서는 퍼블리셔, 프론트엔드가 알고 있으면 좋은 확장프로그램을 소개해보려고 합니다 : ) 혹시라도 확장프로그램을 어디서 다운받으시는지 모르시는 분들은 구글에서 '크롬 확장프로그램'을 검색하시면 'chrome 웹 스토어 - 확장프로그램'으로 들어가셔서 다운받고싶은 확장프로그램들을 검색해보시면 찾을 수 있습니다. 제가 사용하고 있는 확장프로그램들인데 이중 잘사용하고 있는 확장프로그램 몇가지를 적어보려고 합니다. url을 입력할 수 있는 곳 우측에 보면 퍼즐 아이콘이 있는데요, 퍼즐아이콘을 선택하면 본인이 다운받은 확장프로그램들을 볼 수 있습니다. 상태바에 고정해두고 싶으시면 오른쪽의 핀을 누르시면 됩니다 : ) 1. headingMap headingMap은 웹페이지의 heading 순서를 보여주는..
크롬 구글 즐겨찾기 추가 폴더 관리, 모든 기기에 연동, 탭 복구 방법 이번 포스팅에서는 제가 크롬에서 가장 유용하게 생각하는 세가지에 대해서 정리해보려고 합니다. 크롬 구글 즐겨찾기, 북마크 추가 및 폴더 관리 크롬 계정 모든기기에 연동, 동기화해서 다른 기기로 접속시 즐겨찾기 유지 크롬 윈도우창 닫은 후에 이전 탭들 모두 복구하기 1. 크롬 구글 즐겨찾기, 북마크 추가 및 폴더 관리 즐겨찾기는 주소창 우측에 보이는 별을 누르시면 추가하실 수 있습니다. 즐겨찾기를 추가했더라고 추가한 내용들이 안보일 수 있는데요, 이 때에는 이미지 상단에 보이는 세로점 세개 아이콘 '설정 - 북마크 - 북마크바 표시'를 누르시면 즐겨찾기가 생긴것을 확인하실 수 있습니다. 이렇게 하나 두개씩 사이트를 즐겨찾기에 추가하다보면 그 양이 너무 많아져서 나중에는 찾기도 힘들어지는데요, 이 때 즐겨찾..
엄격한 eslint ignore 하는 여러가지 방법 .eslintignore 현재 작업중인 프로젝트가 React + Redux + Saga + Typesript + Prettier + eslint 로 진행중입니다. 때문에 Typescript 그리고 eslint와 prettier가 저에게 아주 엄격한 잣대를 들이대고 있는데요, 되도록이면 그 의미에 맞게 엄격한 규정을 지키려고 노력하는 중이지만 너무 매달리기 보다는 무시하고 지나가야 정신건강에 좋은 eslint 규칙들이 있는것 같습니다. 이번 포스팅에서는 eslint 규칙을 무시하는 여러가지 방법에 대해서 포스팅해보겠습니다. 다양한 방법이 있지만 적용하기 쉬운 순서부터 나열해보도록 하겠습니다. 1. 무시하고자 하는 코드 바로 윗줄에 // eslint-disable-next-line 추가 : 파일내 일부 코드만 무시하고 싶을 때 사용..
mac m1 bash, zsh 터미널 변경해서 사용하기 터미널 명령어로 변경하기 1. bash → zsh $ chsh -s /bin/zsh 2. zsh → bash $ chsh -s /bin/bash 터미널 옵션에서 변경하기 1. 좌측 터미널 선택 후 환경설정 클릭 2. 셀 열기 옵션을 변경 기본 로그인 셀은 default zsh 입니다. bash로 변경하고 싶을 대 '명령어(절대 경로) 선택 bash → zsh /bin/zsh zsh → bash /bin/bash 사용자 및 그룹 환경으로 변경하기 🍎→ 시스템환경설정 → 사용자 및 그룹 → 하단 자물쇠를 클릭해서 비밀번호 입력 → 본인이름 우클릭 →고급옵션 →로그인 셀 셀렉트 박스에 원하는 옵션 설정 2020.09.03 - [업무이야기] - 맥(mac)에서 깃(git) 사용하기 - window git 사용과..
git stash 사용법 - 깃 스태시는 어떤상황에서 필요할까 ? branch, commit의 개념과 단위 git stash 명령어는 개인 프로젝트 할 때 보다 팀 프로젝트를 할 때 많이 사용하는 명령어입니다. 저는 git을 사용할 때 아래와 같은 순서로 커밋을 하고 푸시를 합니다. git add . git commit -m '[feat]git stash 공부내용 추가' git push git stash 를 사용하기에 앞서 저희는 어떤 상황에 commit을 하는지 그리고 왜 branch가 여러개 생기게 되는지 알아야 git stash의 필요성에 대해서 더 설명할 수 있을것 같습니다. 여러분은 언제 branch를 새로 만들고, 어떤 상황에서 commit을 하시나요? git branch 저는 이전 회사에서 git branch를 잘못 사용하고 있었습니다. 그저 충돌 나게 하지 않기 위해서 팀원들끼리 각자의 이름을 ..
자바스크립트 자주 사용하는 변수명 정리 - 클린코드 이번 포스팅에서는 자주 사용하는 변수명을 정리해보려고 합니다. 개발에서 naming은 어떻게 지어도 동작은 하지만 협업의 과정에서 상당이 중요하게 생각되어지는 요소입니다. 보통 함수 naming은 동사로 시작해서 주로 앞에 is, get has, use 등등과 같이 앞부분에 붙게되는 경우가 많은데요, 클래스나 인스턴스 변수는 '명사형'으로 naming을 합니다. 클린 코드에서도 중요하게 생각하는 부분이기 때문에 쉽게 무시할 수 없는데요, 고민하면 정말 끝도 없습니다. 때문에 훗날 고민을 줄이기 위해서 변수명을 따로 정리해두는 포스팅을 해두려고 합니다. 2020.12.16 - [업무이야기] - 클린코드 정리 클린코드 정리 클린코드 글을 보고 정리해둡니다. 프로젝트 들어가기 전에 한번씩 읽어보면 잔상이 남아..
vs code 에서 react에 emmet 적용하는 방법 코딩을 할 때 무의식 적으로 사용하게 되는 emmet이 React 프로젝트시 적용이 안되는 점을 발견했습니다. 직접 하드코딩하면 좋긴 하지만 emmet을 속도가 빨라져 작업효율을 높힐수 있기도 한데요, 오늘은 간단하게 vs code에서 react 작업을 할 때 emmet을 적용하는 방법에 대해서 알아보도록 하겠습니다. 1. 먼저, 환경설정으로 들어가줍니다. (맥 기준) Code - Preferences - Settings 2. User와 Workspace 탭이 있는데요, 여기에서 'Workspace'로 들어가줍니다. 3. 'Include Languages'를 클릭해줍니다. 4. 여기에서 친절하게 안내 문구에 써있는것처럼 Item에는 'javascript'를, 그리고 value 값에는 'javascript..
VS Code 자주 사용하는 단축키 정리 vs code에서 가끔 사용하지만 종종 잊는 단축키들을 다시 검색해볼 때가 있어서 정리해봅니다. 저는 맥용으로 정리를 해두려합니다. 윈도우는 'command' 키를 'ctrl' 로 바꿔서 사용하시면 됩니다. command(ctrl) + shift + v : 마크다운 미리보기 option(alt) + shift + f : prettier 프리티어 자동 세팅 정렬 option(alt) + command(ctrl) + 위아래 방향키 : 다중커서