본문 바로가기
반응형

분류 전체보기31

VSCode에서 개발시 유용한 단축키 모음. VSCode가 개발용 에디터로 많이 쓰이는것 같습니다. 저는 원래 IDE를 주로 사용했었는데요 요즘 VSCode를 쓰다보니 편해서 자주 사용중입니다. 오늘은 VSCode에서 개발할때 사용하면 유용한 단축키들을 간단하게 소개해드리겠습니다. 자동정렬 코드를 작성하다보면 띄어쓰기나 줄바꿈 등이 뒤죽박죽되면서 가독성이 떨어지게 됩니다. 이때 자동정렬을 통해서 깔끔한 상태를 유지할 수 있습니다. Windows Mac Ctrl + A로 전체 코드를 선택한 후, Ctrl + K + F Cmd + A로 전체 코드를 선택한 후, Cmd + K + F 멀티커서 선택 텍스트의 단어가 있는곳에 커서를 옮겨놓으면 동일한 함수,변수들이 하이라이팅되고 그 텍스트들을 동시에 선택할 수 있습니다. 한번에 여러군데 코드를 동일하게 수정.. 2022. 12. 17.
VSCode에서 들여쓰기 TabSize 변경해도 안 바뀔때..혹시? VSCode에서 TabSize와 Insert Spaces 등의 옵션으로 들여쓰기를 입맛에 맞게 바꿔도 들여쓰기 간격이 안바껴서 미치고 팔짝 뛴 경험이 있습니다. 결론부터 얘기하자면 PlugIn 때문이었습니다. 개발자들은 VSCode를 사용하기 좋게 업그레이드하려고 PlugIn을 많이 설치해서 쓰곤 합니다. 그 중에 Prettier같이 코드 정리해주는 Extensions가 있는데 얘네들은 각자 Option을 가지고 있습니다. 이게 VSCode 기본 TabSize보다 우선순위가 높게 잡혀서 변경이 되지 않는 상황이 생기곤 하니, 기본 TabSize 등을 수정해도 들여쓰기 간격이 바뀌지 않는다면 이 Extensions Option을 확인해보시는걸 추천드립니다. ex) Prettier 들여쓰기 간격 조정하기. .. 2022. 10. 18.
들여쓰기(Indentation) 간격 설정: Tab vs Space 개발하다보면 들여쓰기가 굉장히 신경쓰이게 됩니다. 들여쓰기를 Tab으로 할지 Space로 할지, 여백 몇개로 할지 등 고민할 부분들이 있는데요, 어떤 방식을 취할지는 개발언어 권장방식이나 개인의 취향에 맞춰서 정하시면 되겠습니다. 이제 VSCode에서 들여쓰기 간격 설정을 해봅시다. 들여쓰기 설정을 하려면 설정메뉴로 들어가야 합니다. 아래와 같은 방법으로 이동 가능합니다. for Windows File > Preferences > Settings 경로로 이동하여 설정메뉴 진입 VSCode 화면 좌측 맨 아랫쪽에 '설정'(톱니바퀴 그림) 아이콘을 클릭하여 설정메뉴 진입 단축키 Ctrl + , for Mac Code > Preferences > Settings 경로로 이동하여 설정메뉴 진입 VSCode 화면.. 2022. 9. 15.
02. create-react-app 사실 처음부터 React Project를 생성하는건 복잡합니다. 그래서 Facebook에서 만든 Create React App이라는 툴을 이용하도록 하겠습니다. create-react-app은 기본적인 React Code 파일들이 미리 설정된 폴더들과 상용화 가능한 ReactApp을 구축할 수 있도록 돕는 환경설정 파일들로 구성되어 있습니다. create-react-app을 이용해 시작 프로젝트를 생성해보겠습니다. Terminal에서 프로젝트를 생성할 위치로 이동후 아래와 같이 실행해 봅시다. $ npx create-react-app 정상적으로 프로젝트가 생성됐다면 아래와 같은 결과를 보실 수 있습니다. npm start로 생성한 프로젝트를 로컬에서 실행해봅니다. $ cd $ npm start 로컬 개발.. 2022. 9. 13.
반응형

티스토리툴바