코드 정렬 기능
🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨
질문 하시기 전에 꼭 확인해주세요- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)
- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)
- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)
질문 하실때 꼭 확인하세요
- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)
- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)
- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)
- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요
- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!
- 서로 예의를 지키며 존중하는 문화를 만들어가요.
- 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
강의자님께서는 강의에서 어떤 코드 정렬 기능을 쓰고 계신지 궁금합니다. 단축키를 이용하시는 것 같은데 저는 똑같이 안되는 것 같습니다.
답변 2
0
안녕하세요 이정환입니다.
코드 정렬 기능은 VSCode의 Extension인 Prettier 사용중입니다 😃
해당 기능 이용하시면 Ctrl + S(저장) 할 때 마다 자동으로 코드가 정렬되도록 설정할 수 있어요
0
rndudwns923
2024. 12. 03.
prettier 사용해도, 소괄호 생성 등 조금씩 세팅이 다른거 같습니다! 강의자님과 똑같은 환경을 만들고 싶은데 혹시 prettier 옵션을 알 수 있을까요?
0
음 .. 별도의 세팅을 조정하지는 않아서 기본 세팅과 거의 동일합니다.
다른 점은 저는 print width를 80 정도로 설정했던 것 같아요
(지금은 강의 촬영중의 세팅과는 조금 달라서 정확한지는 모르겠습니다 ㅎㅎ..)
prettier 세팅은 원하시는대로 조금씩 조절해보시는걸 추천드립니다.
0
안녕하세요, 인프런 AI 인턴입니다. rndudwns923님.
코드 정렬 기능은 개발자들이 주로 사용하는 코드 편집기에서 제공하는 기능입니다. 강의에서 많이 사용하는 편집기는 Visual Studio Code(VSCode)일 가능성이 높습니다. 이 에디터는 다양한 키보드 단축키와 플러그인을 통해 코드 포매팅을 빠르고 쉽게 할 수 있게 해줍니다.
VSCode에서 코드 정렬(포매팅) 기능 사용법
Prettier 설치: Prettier는 코드 포맷을 자동으로 조정해주는 도구로, JSON, JavaScript, HTML 등 다양한 언어에 대해 포매팅을 지원합니다. 설치 후 기본 설정으로 사용하시거나,
.prettierrc파일을 만들어 세부 설정을 할 수 있습니다.단축키 사용: 일반적으로 Shift + Alt + F 를 눌러 코드를 포맷할 수 있습니다. 만약 잘 동작하지 않는다면 설정에서 “Format on Save” 기능을 활성화하세요. 이는 파일을 저장할 때마다 자동으로 코드 포맷을 실행해 줍니다.
설정 확인: VSCode 좌측 하단의 톱니바퀴 아이콘을 클릭하고 “Settings”를 선택한 후, “Format On Save”를 검색하여 활성화 여부를 확인해보세요.
관련 질문을 참고하시려면, 다음의 유사한 질문을 확인해보세요:
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
풀라우트캐시 동작 원리에서 데이터 캐시 관련 질문
0
35
2
next.js 프로젝트
0
36
1
Next.js + Tanstack Query BFF 구조 질문
0
35
2
Next.js 사전렌더링 이해하기 부분
0
39
2
모달 관련 질문
0
45
3
렌더링 관련 질문
0
82
2
중복으로 하나의 api를 요청할 때 캐싱 옵션 통일화
0
64
2
라우트 세그먼트 옵션 강좌 노트에 사소한 제보 남깁니다.
0
66
2
SSR시 context에 params말고 query를 사용하면 안되나요?
0
75
2
npx prisma db push 시 에러가 뜹니다.
0
96
3
vercel 배포를 실패하였습니다.
0
107
3
Image 컴포넌트 사용시 브라우저 콘솔에 경고는 왜 뜨는걸까요?
0
61
2
getServerSideProps 함수와 SSR의 관계
0
81
6
없는 페이지인데 풀라우트캐시로 저장이 되는 이유가 궁금합니다
0
61
2
실제 프로젝트에서 SSR 사용에 관해서 질문드립니다.
0
118
2
일반적인 nextjs project architecture에 대하여..
0
93
2
2.14 Search에서 작성한건 static이긴하지만 CSR이 아닌가요?
0
75
2
배포 시 오류 발생
0
91
2
백엔드 서버 오류납니다.
0
86
2
취약점 제거시 nestjs 버전 문제가 생길까요?
0
94
1
eslint.config.mjs 내 rules 어떻게 설정 하나요?
0
111
1
[book]/[id]/page.tsx 모달 띄울 때 성능 하락 현상은 ReviewList를 불러오면서 발생하는 문제 같습니다.
0
63
2
빨간줄 설정
0
80
2
익스텐션 질문
0
61
1