<Demo Video>
https://github.com/wook2124/Paint_JS
wook2124/Paint_JS
Painting Board made with Vanilla JS. Contribute to wook2124/Paint_JS development by creating an account on GitHub.
github.com
<준비물>
https://code.visualstudio.com/
Visual Studio Code - Code Editing. Redefined
Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.
code.visualstudio.com
<코드기록>
<!-- index.html 만들기-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link rel="stylesheet" href="style.css" />
<title>PaintJS</title>
</head>
<body>
<script src="app.js"></script>
</body>
</html>// 터미널(git)을 이용해서 변경사항 바로 저장하기(GitHub)
git add .
git commit -m "Initial Commit"1. Paint JS
앞으로 HTML, CSS, JavaScript만 사용해서 만들 Paint JS이다.
2. GitHub Repository 추가하기
https://wook-2124.tistory.com/1
[GitHub] 1. GitHub Desktop 다운로드/설치하기! (#코딩공부)
유튜브에서 https://youtu.be/V9AGvwPmnZU 영상을 보고, '하루에 4시간' 만큼은 관심있는 분야(주로 IT) 독학 공부를 위해, 그리고 기록하는 목적으로 포스팅을 시작했다. 일단 영상에 나오는 동욱님께서는 'GitHu..
wook-2124.tistory.com
https://wook-2124.tistory.com/2
[GitHub] 2. GitHub Repository 및 사용법 (#코딩공부)
2. GitHub Repository(저장소) 및 사용법 오늘은 새로운 Repository를 Hard drive 와 연동하는 방법 그리고 GitHub 사용법 대해서 포스팅하려 한다. 사진에서 보이는 것 같이 하드에 새롭게 폴더가 생기고 연동..
wook-2124.tistory.com
위 포스팅을 참고해서 GitHub에 새로운 repositories를 추가해준다.
GitHub Desktop에서 GitHub Web으로부터 repositories를 remote로 불러오고
Visual Studio Code로 열어주면 연동 끝이다.
사실 이 방법말고 VSC에서 Git을 이용해서 추가하는 방법도 있지만, 다음에 다뤄보도록 하겠다.
3. Visual Studio Code(VSC)
https://wook-2124.tistory.com/14
[Tip] 코딩(VSC) 단축키 7가지 정리! (feat. 니꼴라스쌤) (#코딩공부)
https://www.youtube.com/watch?v=Wn7j5dfbJF4 7) 반복되는 단어 한방에 수정 : "Ctrl + D" / "⌘ + D" 6) 클릭하는 곳마다 커서 생성 : "Ctrl + Click" / "⌥ + Click" 5) 코드 위/아래로 움직이기 : "Alt + &uar..
wook-2124.tistory.com
VSC 단축키도 한번 확인하고, VSC의 Extend(확장)으로 설치해서 내장되어있는 HTML을 불러오면
이렇게 Default(기본값)이 작성되고 필요한 부분을 조금만 수정하면 된다.
필요한 부분 수정한 뒤 git add . 이후 git commit -m "Initial Commit"하면 VSC내에서 Commit을 수행할 수 있다.
GitHub에서 봐도 Commit이 완료된 것을 알 수 있다.
지금까지 작업한 것과 앞으로 작업할 것들을 GitHub Desktop으로 GitHub 계정과 연동시켜놓으면, Commit과 Push, Fetch(가져오기)도 손쉬울 뿐만 아니라, Open in Visual Studio Code를 통해서 바로 VSC로 작업을 할 수 있어서 편하다.
Microsoft에서 VSC를 개발했고, GitHub까지 인수해서 연동이 정말 잘되있는 것 같다.
※ 코로나19 조심하세요!!!!
'JavaScript > Paint JS' 카테고리의 다른 글
| [JavaScript] #2.2 Recap! (#코딩공부) (0) | 2020.04.24 |
|---|---|
| [JavaScript] #2.1 2D Context (#코딩공부) (0) | 2020.04.18 |
| [JavaScript] #2.0 Canvas Events (#코딩공부) (0) | 2020.04.16 |
| [JavaScript] #1.2 Styles part Two (#코딩공부) (0) | 2020.04.14 |
| [JavaScript] #1.1 Styles part One (#코딩공부) (0) | 2020.04.14 |
댓글