2025 / 01 / 03

오늘은 깃허브와 비주얼스튜디오코드 연동 방법과 자바스크립트의 기본에 대해 배웠다.

나는 대학교 생활을 하며 다양한 프로젝트를 할 때 깃허브를 접해본 적이 없어서 너무 신기했다.
오늘 깃허브 아이디도 만들고 깃허브 저장소에 원격 저장 방법을 알게되었는데 좋았다.

---

💌 깃허브

분산 버전 관리 툴인 깃 저장소 호스팅을 지원하는 웹 서비스이다.
깃허브는 영리적인 서비스와 오픈소스를 위한 무상 서비스를 모두 제공한다.

비주얼스튜디오 코드에서 원격으로 깃에 파일을 저장할 때 필요한 터미널에 명령어를 배웠다.
Visual Studio Code에서 원격 Git 리포지토리에 파일을 저장하려면 Git 명령어를 터미널에서 입력해야한다.

[ Git을 초기화하고 원격 리포지토리에 파일을 푸시하는 명령어 순서 정리 ]

1. Git 리포지토리 초기화

이 명령어는 현재 폴더를 Git 리포지토리로 초기화합니다.

git init

---

2. 파일을 스테이징하기

변경된 파일을 커밋하기 전에 스테이지에 올려야합니다. -> 모든 파일을 스테이지에 추가

git add .

---

3. 커밋 만들기

스테이징된 파일을 로컬 Git 리포지토리에 커밋합니다.
"Initial commit" 부분은 변경 내용에 맞는 메시지로 수정할 수 있습니다.

git commit -m "Initial commit"

---

4. 원격 리포지토리 추가

이제 원격 Git 리포지토리를 추가해야 합니다. -> 원격 리포지토리 URL을 추가

git remote add origin <원격 리포지토리 URL>

---

5. 원격 리포지토리로 푸시

마지막으로, 로컬 리포지토리의 변경 사항을 원격 리포지토리로 푸시합니다.

git push -u origin master

주의: master 브랜치를 사용하고 있으면 이 명령어를 그대로 사용하시면 되고, 만약 main 브랜치를 사용하고 있다면 master를 main으로 변경해야 합니다.

git push -u origin main

---

6. 파일 수정 후 원격 저장이 필요할 때

git add .
git commit -m "수정주석이름"
git push origin main

해당 명령어를 터미널에 입력해주시면 됩니다.

---

오늘 수업시간에는 자바스크립트의 기초[ 호이스팅 / 연산자 ]를 배웠습니다.

💌 호이스팅

JavaScript에서 변수와 함수 선언이 코드의 상단으로 끌어올려지는 동작을 의미합니다.
코드가 실행되기 전에 변수와 함수 선언이 먼저 처리되어, 선언된 위치와 관계없이 사용할 수 있는 현상이 발생합니다.

1) 변수 호이스팅

• 변수 선언 (var, let, const)은 최상단으로 끌어올려지지만, 초기화는 선언된 위치에서 이루어집니다.
• var : 변수 선언만 끌어올려지고, 초기화는 그대로 유지됩니다.
• let, const : 변수 선언과 초기화가 끌어올려지지만, 초기화 이전에 접근하면 ReferenceError가 발생합니다.

console.log(x);  // undefined
var x = 5;

console.log(y);  // ReferenceError
let y = 10;

2) 함수 호이스팅

• 함수 선언은 함수 정의 자체가 끌어올려집니다. ( 그러나 함수 표현식은 끌어올려지지 않습니다. )
• 함수 선언 : 함수 전체가 끌어올려집니다.
• 함수 표현식 : 변수처럼 동작하여 선언부만 끌어올려지고, 할당은 그대로 유지됩니다.

foo();  // "Hello, world!" (정상 동작)

function foo() {
  console.log("Hello, world!");
}

bar();  // TypeError
var bar = function() {
  console.log("Hi!");
};

---

💌 자바스크립트 변수

변수는 변하는 데이터를 저장할 수 있는 메모리 공간입니다.
기본형 : var 변수명; / var 변수명 = 값;

변수에 저장할 수 있는 자료형

자료형	의미	기본형
문자형	문자나 숫자를 큰따옴표(" ") 또는 작은 따옴표(' ')로 감쌉니다.	var 변수 = "사용할 문자나 숫자"
숫자형	숫자를 의미 ( 따옴표로 감싼 데이터를 숫자형 데이터로 바꾸려면 Number("100")처럼 작성합니다. )	var 변수 = 숫자; / Number("문자형 숫자");
논리형	true 또는 false가 있으며 주로 데이터를 비교할 때 나오는 결과입니다.	var 변수 == true or false: / Boolean(데이터);
null	undefined는 다음과 같이 변수에 값이 등록되기 전의 기본값이고, null은 변수에 저장된 값이 null인 경우를 가리킵니다.	보충 설명

---

Boolean형(논리형) - 보충

• Boolean() 메서드에 데이터를 입력하면 논리형 데이터인 true 또는 false를 반환합니다.
• Boolean() 메서드는 숫자 0과 null, undefined, 빈 문자(" ")를 제외한 모든 데이터에 true를 반환합니다.
• Boolean() 메서드에 숫자 '0'을 입력하면 false라는 값은 반환합니다.

var m = Boolean(0)        // false
var k = Boolean("바보")   // true

---

빈 데이터 - 보충

• null은 변수에 저장된 데이터를 비울 때 사용하는 값입니다.

var s;   // undefined
var t = "hello";
t = null;

---

typeof

• 지정한 데이터 또는 변수에 저장된 자료형을 알고 싶을 때 사용합니다.

type of 변수 또는 데이터;

---

💌 연산자

연산자에는 산술, 문자 결합, 대입(복합 대입), 증감, 비교, 논리, 상항 조건 연산자가 있습니다.

연산자	특징	종류
산술	산술연산자로 연산을 하려면 연상 대상 데이터가 반드시 2개 있어야 합니다.	더하기( + ), 빼기( - ), 곱하기( * ), 나누기( / ), 나머지( % )
문자 결합	피연산자(연산 대상 데이터)가 문자형 데이터입니다.( 여러 문자를 하나의 문자형 데이터로 결합 )	문자형 + 문자형 = 문자형 / 문자형 + 숫자형 = 문자형
대입	연산된 데이터를 변수에 저장할 때 사용합니다. 복합 대입 연산자는 산술 + 대입 연산자를 의미	대입연산자 ( = ), ( 복합 대입 연산자 : +=, -=, *=, /=, %=등 )
증감	증감연산자는 변수의 앞뒤 어느 위치에 오는가에 따라 결괏값이 달라집니다.	증가 연산자(++)와 감소시키는 감소연산자
비교	연산된 결괏값은 true, false로 논리형 데이터를 반환합니다.	>, <, >=, <=, ==, !=, ===(자료형도 같다), !=(자료형도 다르다)
논리	피연산자가 논리형 데이터인 true 또는 false로 결과값을 반환합니다.	보충 설명
삼항 조건	조건식 (true 또는 false로 결과값을 반환)의 결과에 따라 실행 결과가 달라지는 연산자	조건식 ? 자바스크립트 코드1 : 자바스크립트 코드2;

---

논리 연산자 - 보충

논리 연산자는 피연산자가 논리형 데이터인 true 또는 false로 결괏값을 반환합니다.

• || : or 연삱바라 하며, 피연산자 중에서 값이 하나라도 true가 존재하면 true로 결괏값을 반환합니다.
• && : and 연산자라 하며, 피연산자 중에서 값이 하나라도 false가 존재하면 false로 결괏값을 반환합니다.
• ! : not 연산자라 하며, 단항 연산자입니다. 피연산자의 값이 true이면 반대로 false로 결괏값을 반환합니다.

---

2일차 후기

• 전공자로써 자바스크립트의 기초에 대해서 어느정도 알고는 있었지만, 간단한 개념 뿐이었고 수업시간에 실습을 통해 알고 있는 것과 새롭게 알게된 것을 정리할 수 있는 시간을 가질 수 있어서 좋았습니다.
• 당일에 배운 내용을 벨로그에 정리를 하며 다시 한번 공부할 수 있는 것 같습니다.
• 깃허브 연동법과 호이스팅 등 프로그래밍 용어를 배우며, 아직은 모르는 것도 많고 미숙한 부분이 있다는 것을 인지할 수 있었고 앞으로 벨로그에 하나하나 정리하며 나의 지식으로 만들 수 있도록!! 열심히해야겠다고 생각했습니다. 화이팅! ໒꒰ྀི๑ ᷇ 𖥦 ᷆๑ ꒱ྀི১