이럴 때 우리가 사용하는 '코딩 도구'에 마법 같은 기능을 추가해 줄 수 있다면 어떨까요? 마치 우리가 그림을 그릴 때 연필, 지우개, 자 외에 특별한 색연필이나 멋진 스케치북을 사용하면 그림이 더 예쁘고 쉽게 완성되는 것처럼 말이에요! 코딩에도 이런 마법 같은 '추가 도구'들이 있답니다. 우리는 이걸 '확장 프로그램'이라고 불러요.
확장 프로그램은 우리가 코딩할 때 사용하는 프로그램(전문가들은 이걸 '코드 에디터'라고 불러요)에 붙여서 쓰는 작은 프로그램들이에요. 이 확장 프로그램들을 잘 활용하면 코딩하는 시간을 줄이고, 실수를 줄이며, 코드를 더 보기 좋게 만들 수 있어요. 즉, 코딩하는 재미를 훨씬 더 키울 수 있다는 이야기죠!
그렇다면 코딩 초보 친구들에게 꼭 필요한 확장 프로그램들은 무엇일까요? 어떤 확장 프로그램이 우리의 코딩 실력을 쑥쑥 키워줄까요? 지금부터 코딩 효율을 확 높여주는 필수 확장 프로그램들을 아주 쉽게 알려드릴게요!
코딩 초보에게 꼭 필요한 멋진 확장 프로그램들!
자, 이제 코딩 초보 친구들이 코딩을 더 쉽고 재미있게 할 수 있도록 도와주는 멋진 확장 프로그램들을 하나씩 만나볼 시간이에요! 우리는 코딩을 할 때 'VS Code'라는 프로그램을 많이 사용하는데요. 이 VS Code에서 사용할 수 있는 유용한 확장 프로그램들을 중심으로 이야기해 볼게요!
1. 코드를 입력할 때 도와줘요! 자동 완성 (IntelliSense 같은 기능)
우리가 글자를 입력할 때 스마트폰이 다음에 올 단어를 미리 보여주는 것처럼, 코딩에도 이렇게 코드를 입력할 때 자동으로 완성될 코드를 보여주는 똑똑한 기능이 있어요! 바로 '자동 완성' 기능인데요. VS Code에서는 'IntelliSense'라는 이름으로 이런 기능을 제공하고, 각 코딩 언어마다 더 똑똑한 자동 완성 기능을 제공하는 확장 프로그램들이 있답니다.
예를 들어, 우리가 "prin"이라고만 쳐도 뒤에 "t"가 올 거라고 예상해서 'print'라는 글자를 완성해 보여주는 식이죠. 이걸 사용하면 오타를 줄일 수 있고, 코드를 일일이 다 외우지 않아도 되니 코딩하는 속도가 훨씬 빨라져요! 내가 말하려는 단어를 친구가 먼저 알아채고 알려주는 것처럼 편리하죠! 인터넷 검색을 해보니, 파이썬 코딩을 할 때는 'Python' 확장 프로그램 안에 이런 기능이 잘 들어있다고 하네요.
2. 코드를 예쁘게 정리해줘요! 코드 정리 도구 (Prettier 같은 것)
코딩을 하다 보면 들여쓰기가 엉망이 되거나, 띄어쓰기가 제멋대로 되는 경우가 있어요. 코드가 지저분하면 나중에 다시 볼 때 이해하기 어렵고, 다른 사람과 함께 코딩할 때도 불편하죠. 이때 '코드 정리 도구' 확장 프로그램이 아주 유용하답니다! Prettier 같은 확장 프로그램이 대표적이에요.
이 확장 프로그램은 우리가 짠 코드를 정해진 규칙에 따라 자동으로 예쁘게 정렬해 줘요. 들여쓰기도 맞춰주고, 띄어쓰기도 깔끔하게 해주고, 필요 없는 부분은 정리해주기도 하죠. 코드가 예쁘게 정리되면 읽기도 편하고 실수도 줄어들 거예요.
3. 틀린 곳을 미리 알려줘요! 코드 검사 도구 (Linter 같은 것)
우리가 글을 쓸 때 문법이 틀리거나 맞춤법이 틀리면 빨간 밑줄로 표시해 주는 것처럼, 코딩에도 혹시 잘못된 부분이 없는지 미리 알려주는 똑똑한 친구가 있어요! 바로 '코드 검사 도구' 확장 프로그램인데요. 이걸 'Linter'라고도 불러요. ESLint 같은 확장 프로그램이 이런 역할을 잘 해준답니다.
코드를 다 짜고 나중에 실행했을 때 오류가 나면 어디가 틀렸는지 찾기가 정말 힘들거든요. 하지만 Linter는 코드를 입력하는 중간중간에 잘못된 부분을 미리미리 알려줘요. "어? 여기 뭔가 이상한데?" 하고 알려주면 우리는 그 부분을 바로 고칠 수 있죠. 인터넷 자료를 보니, 이런 도구들이 개발자들이 코드의 품질을 높이는 데 큰 도움을 준다고 하네요.
4. 괄호를 색칠해서 보여줘요! 괄호 색칠 (Bracket Pair Colorizer)
코딩을 하다 보면 괄호 '{', '}', '(', ')', '[', ']'를 정말 많이 사용해요. 그런데 괄호가 너무 많으면 어떤 괄호가 누구랑 짝꿍인지 헷갈릴 때가 있어요. 예를 들어, 쌍둥이를 구분하기 어려운 것처럼요! 이때 '괄호 색칠' 확장 프로그램이 아주 유용하답니다! Bracket Pair Colorizer라는 확장 프로그램이 유명해요.
이 확장 프로그램은 짝이 되는 괄호끼리 같은 색깔로 칠해줘요. 예를 들어, 첫 번째 '{'와 마지막 '}'를 같은 파란색으로, 그 안에 있는 '('와 ')'는 같은 초록색으로 칠해주는 거죠. 이렇게 색깔로 구분해주니 괄호가 아무리 많아도 짝꿍을 쉽게 찾을 수 있어요! 코드를 읽기도 훨씬 편해지고, 괄호 때문에 생기는 실수도 줄어든답니다.
5. 웹 페이지를 바로바로 볼 수 있어요! 미리보기 (Live Server)
우리가 HTML, CSS, JavaScript 같은 걸로 웹사이트를 만들 때, 코드를 수정하고 나서 그 결과가 웹 브라우저에 어떻게 보이는지 자주 확인해야 해요. 보통은 파일을 저장하고 웹 브라우저를 새로고침 해야 하죠. 그런데 이 과정을 자꾸 반복하면 귀찮고 시간이 오래 걸려요. 이때 Live Server 확장 프로그램이 아주 편리하답니다.
Live Server는 우리가 코드를 저장하는 순간, 웹 브라우저에 자동으로 바뀐 내용을 보여줘요! 파일을 저장할 때마다 웹 브라우저를 새로고침 할 필요가 없어지는 거죠. 내가 그림을 그릴 때마다 실시간으로 그 결과가 화면에 나타나는 것처럼 빠르고 편리해요! 웹 개발 공부를 하는 친구들에게는 정말 필수적인 확장 프로그램이라고 할 수 있겠네요.
결론: 확장 프로그램으로 코딩을 더 즐겁게!
지금까지 코딩 효율을 확 높여주는 필수 확장 프로그램들을 함께 알아봤어요! 자동 완성, 코드 정리 도구, 코드 검사 도구, 괄호 색칠, 미리보기까지!
이 확장 프로그램들을 사용하면 코딩하는 시간이 줄어들고, 실수는 줄어들고, 코드는 더 깔끔해질 거예요. 처음 코딩을 시작할 때는 코딩 자체에 집중하는 것도 힘들 수 있는데, 이런 도구들의 도움을 받으면 코딩을 더 쉽고 재미있게 배울 수 있답니다.
물론 처음부터 모든 확장 프로그램을 다 설치하고 사용할 필요는 없어요. 오늘 제가 소개해 드린 것들 중에서 나에게 필요해 보이는 것부터 하나씩 설치해서 사용해 보세요. 코딩 실력이 늘면서 자연스럽게 더 많은 확장 프로그램의 도움을 받게 될 거예요.
){kind=link}
0 댓글