Vs code 사용하기!

진건희·2024년 4월 13일
post-thumbnail

Vs code란?

vs code란 visual studio code의 약자로
개발 툴 중 하나이다.

설치법

다운로드 링크
먼저 다운로드 링크에 들어간다.

자신과 맞는 다운로드 링크를 눌러 다운로드를 한다.

그 다음

다운로드 파일을 클릭하여 실행하면?

이런 창이 뜨는데 동의합니다(A)를 선택한다.
그리고 다음(N)을 누른다

그 다음

바탕화면에 바로가기 만들기(D)를 클릭해 아이콘을 만든다.

그리고 다음(N) 버튼을 누른다.

마지막으로

설치(I)를 누른다

그렇게 하면 설치가 된다.

사용 방법

일단 아이콘을 눌러 들어가보자

처음 들어가면

이러한 창이 뜬다

여기서

1. 새 파일
2. 파일 열기
3. 폴더 열기
4. git repository 복제

를 배워 볼 것이다.

새 파일은 새 파일을 만드는 기능이다.

누르면 이런식으로 탭이 뜨는데 텍스트 파일을 눌러준다.

그러면

이런 화면이 보이는데 언어 선택을 누른다
누른 뒤에는


vs code에서 쓸 수 있는 다양한 언어를 고르면 된다.(예시로 html을 골랐다)
Tmi 정확하게는 html은 프로그래밍 언어가 아니다.

이렇게 하면 html을 쓸 수 있는 파일이 완성된다.

두번째
파일 열기
저번에 만든 파일을 열 수 있는 기능이다.
그럼 파일은 어떻게 저장하냐?

위에 있는 파일(F) -> 다른 이름으로 저장(ctrl + shift + s)

세번째
폴더 열기
파일 열기 와 마찬가지로 폴더를 열 수 있다.

네번째
Git repository 복제
github에 있는 리포지토리를 vs code에 그대로 가져올 수 있다.

※ github라는 어플리케이션에서는 repository라는 파일과 폴더를 저장할 수 있는 저장소 개념이 있다.

왼쪽에 있는 탭의 기능들을 알아볼 차례다.

위에서 부터

1번째 탭은
파일과 폴더보기인데

만약 폴더에 있는 상태라면 어떤 파일들이 있는지 볼 수 있고
파일만 있다면 열려있는 편집기에 보인다.

2번째 탭은
검색
vs code에서 우리가 열은
특정 파일이나 폴더를 검색 가능하다.

주인장의 코딩 폴더 중 한개에서 App.js를 검색하니 아래에 뜨는 모습니다.

3번째 탭은
소스 제어
이 기능은 git repository가 연결된 상태에서만 작동한다


만약 연결 되어 있다 치면은
코드에 변화가 생길 시 변화가 생긴 코드가 있는 파일이 뜬다

이렇게 그러면 이것을 +을 눌러 선택하고


커밋을 누르고

커밋을 한 branch를 적고
변경사항 보내기 버튼을 누르고
터미널에서 git push 명령어를 적으면
git repository가 자동으로 코드 변경이 이루어진다!

4번째 탭은
디버그

대충 파일을 실행시킬 수 있다.

5번째 탭은
확장

이런식으로 코딩에 좀 더 편한 기능을 추가할 수 있는 확장팩들을 다운로드 할 수 있다.

많이, 자주 사용하는 것

터미널
터미널은 git push 같은 git, 마크업, node 같은 명령어를 적을 때 사용된다

란 단축키가 있다


이런것들이 있는데

+는 추가
v는 형태 고르기인다.

형태가 무엇이냐

이런식으로 터미널과 관련된 형태와 설정이 나온다.

휴지통은 지우기
창문같이 생긴 것은 동시에 보기(터미널이 2개 열렸을 때 동시에 보기 가능)

그리고 마냥 터미널을 열었을 때 바로 나오는 기본값(기본 형태)를 바꾸고 싶다면

기본 프로필 선택을 누른뒤 기본 형태를 선택해주면 된다.

git repository
이것도 굉장히 많이 쓸 예정이다.

3번째 탭을 간 다음
리포지토리 복제를 클맇가고
github에서 복제를 선택한 다음
자신의 깃허브 또는 자신이 소속된 그룹형 깃허브의 리포지토리를 선택하기만
하면 저장된 파일과 코드를 받아 올 수 있다.

profile
이번에는 천천히 걸어보려고 합니다.

0개의 댓글