ETC

📖 Contents

ETC

디렉터리

우리가 흔히 사용하는 폴더의 같은 의미.

계층구조

데이터를 효율적으로 관리하기 위해 사용하는 디렉터리의 구성. 나뭇가지처럼 트리 구조로 이루어진다.

디렉터리 경로

디렉터리가 위치한 곳을 나타내는 주소를 의미.
절대 경로와 상대경로로 구분.

절대경로

디렉터리가 위치한 곳을 나타내는 가장 정확하고 디테일한 주소를 의미. 주소를 처음부터 끝까지 적은 것을 의미한다.
현재 위치한 곳(Working Directory)과 상관없이 항상 같은 위치를 가리킬 수 있는 주소. ex) 우리 서울시 서초구 강남대로 465에서 만나자..
바탕화면은 Desktop 디렉터리로 표현되는데, 절대경로로 표현하면 맥에서는 Users/본인이름/Desktop 이렇게 표현한다. 윈도우는 C드라이브부터 시작하게 된다. 또한, 윈도우는 경로를 나타날 때 백슬래쉬를 사용. ex) C:\Program Files\Adobe (우리나라는 원화표시로 사용)
그래서 우리가 어떤 디렉터리에 있든 항상 같은 디렉터리를 가리킬 수 있는 게 절대경로이다.

상대경로

디렉터리가 위치한 곳을 현재 위치를 기준으로 설명하는 경로를 의미한다. 현재 어디에 위치하느냐에 따라 동일한 경로도 다르게 표현될 수 있다. ex) 우리 반대편에서 만나자..
상대경로에서 현재 본인이 위치한 곳은 점(.)으로 표현하고 / 현재 위치한 곳보다 한 단계 상위의 부모 디렉터리의 위치는 점점(..)으로 표현한다.

ex) A 디렉터리에서 하위 B 디렉터리로 이동할 때는 -> ./B 또는 B 을 입력하면 된다.(./를 생략할 수 있다.)
A 디렉터리에서 상위 C 디렉터리로 이동할 때는 -> ../ 입력.

Terminal

지금은 컴퓨터에게 마우스나 키보드, 화면 터치 등 다양한 방식으로 다양한 방법을 통해 컴퓨터에 명령을 입력할 수 있지만 옛날에는 이러한 방법들이 없었다. 단순히 전달받은 입력값에 대해 처리만 할 뿐, 컴퓨터와 사용자가 실시간으로 상호작용하는 것은 힘들었다.
시간이 지나 터미널이라는 장치가 개발되고 사람이 텍스트로 컴퓨터에게 데이터를 입력할 수 있게 되었고 그 입력에 대한 처리 결과를 화면에 표시할 수 있게 되었다. 이렇게 텍스트를 기준으로 컴퓨터와 사용자가 상호작용 하는 것을 Command-Line interface, CLI라고 부른다.
이 CLI를 제공하는 프로그램을 Command-Line Interpreter 또는 Shell이라고 부른다. 대표적인 Shell 프로그램으로 유닉스 운영체제에서 사용하는 Bash Shell, 윈도우에서 사용하는 PowerShell이 있다. 이 Shell 프로그램으로 과거 터미널이라는 장치를 소프트웨어 형태로 구현한 것을 Terminal Emulator라고 부른다.

-> 즉, 터미널이란 텍스트 기반으로 컴퓨터에게 명령을 내리고 그 결과를 확인할 수 있게끔 해주는 것이다. 운영체제에 따라 다양한 소프트웨어가 있고 환경에 따라 명령어가 다를 수 있다.
윈도우에는 cmd나 powershell이 내장되어 있고, 맥에서는 terminal이 내장되어 있다.
우리가 나중에 서비스를 배포하기 위해 서버를 직접 발급받아 서버 내부에서 작업하게 될 때, 현업에서 쓰이는 거의 모든 서버는 Linux라는 운영체제를 사용하고 있고 이 운영체제에서 가장 많이 쓰이는 shell은 Bash shell이다.

-> Linux와 Mac은 유사한 점이 많아 똑같은 명령어 체계를 사용할 수 있지만, 윈도우의 경우에는 전혀 다른 명령어 체계를 배워야 한다. 하지만 윈도우에서 Git Bash라는 프로그램을 사용하면 Linux와 Mac과 동일한 Bash 기반의 명령어를 사용할 수 있기 때문에 윈도우의 경우 git Bash를 설치하는 게 좋다. git를 설치하면 자동으로 설치가 된다.

Terminal 명령어

터미널에 들어가면 현재 컴퓨터에 로그인 되어있는 계정정보와 컴퓨터 정보, 우리가 현재 위치해 있는 경로가 표시된다.
kimsangbaek@gimsangbaeg-ui-MacBookAir ~ % -> 순서대로 계정의 유저이름 / @컴퓨터이름(호스트명) / ~경로를 의미. ~표시는 영어로 Tilde라고 하는데, Home Directory를 의미한다.
터미널을 실행하면, 맨 처음 위치하게 되는 디렉터리가 바로 홈 디렉터리이다.

pwd

현재 디렉터리가 위치하고 있는 경로를 의미. Working Directory의 절대경로가 출력됨. print working directory의 약자.

ls

list의 약자로, 현재 위치한 디렉터리 내부에 어떤 파일와 디렉터리들이 있는지 내용물들을 나열해준다. 여기서 Desktop이 바탕화면에 해당한다.

cd 디렉터리이름

change directory의 약자로 현재 위치한 경로를 다른 위치로 바꿔주는 명령어를 의미. 이 명령어를 이용해서 원하는 디렉터리 위치로 이동할 수 있다.
ex) cd Desktop 이렇게 입력했을 때는 사실 -> cd ./Desktop과 같은 코드이다. 즉, 여기서는 자식 디렉터리로 이동하는 것이기에 ./를 생략한 것이다. 그리고 상대경로를 이용했다고 볼 수 있다.
만약, 절대경로를 이용한다면 pwd를 입력해서 현재 절대경로를 확인 및 복사하고 붙여넣은 다음, 그 뒤에 /자식 디렉터리를 입력해주면 된다. ex) /Users/kimsangbaek/Desktop/likelion

cd ..

한 단계 위의 디렉터리로 이동하려면 다음과 같은 명령어를 입력하면 된다.

Tab 키

컴퓨터는 내부 디렉터리 구조를 다 알고 있기 때문에 한 두 글자를 입력하고 Tab 키를 누르면 알아서 디렉터리 이름이 자동완성된다.

clear

터미널 화면을 맨 윗줄에서부터 입력할 수 있게 해주는 명령어.

mkdir (make directory)

새로운 디렉터리를 만들어주는 것. mkdir이라고 입력하고 한 칸 띄운 후에 만들 디렉터리 이름을 입력해주면 된다.

Linux 명령어

Ubuntu

먼저 리눅스는 서버 컴퓨터의 운영체제(OS)로서, 클라이언트의 요청에 응답한다. 리눅스는 무료로 배포되었기 때문에 사람들이 발전시켰고, 리눅스의 유명한 버전 중 하나가 바로 우분투(Ubuntu)이다.

command 라인을 배워야 하는 이유

백엔드 개발자라면 터미널 윈도우를 이용해서 다른 원격에 있는 서버에 접속한다든지 문제있는 버그를 디버깅하거나 자동화를 위해 스크립트를 작성하는 일이 빈번 할 것이다.

개발자라면 알아야 할 Shell 명령어 15가지

Unix에는 Bourne shell, Bash, fish, zsh 이렇게 다양한 shell들이 있다. Unix shell 명령어를 공부하면 Unix 계열의 Linux나 Mac OS에서도 shell command를 사용하는데 편리하다. 또한 요즘에는 윈도우 안에 Linux가 포함되어져 있기 때문에(WSL) 사용가능하다.
Mac OS에서 제공하는 기본 터미널이 아닌 iTerm를 이용해보기.

Manual

Shell 커맨드에 대해서 자세히 알아보기 전에 중요한 명령어가 있다.

man

man은 Manual 또는 users Manual의 약자인데, 이 명령어가 무엇인지 모르겠거나 어떤 옵션들을 함께 써야하는지 모르겠다 할 때, man 명령어를 이용해서 자세히 알아볼 수 있다. man man 이렇게 입력하면 man 명령어에 대한 설명이 나온다. 해당 화면에서 나가고 싶을 때는 q를 입력하면 된다.

clear

그 다음은 clear 명령어이다. 터미널에 있는 모든 텍스트를 깔끔하게 청소해주는 명령어다. man clear로 clear에 대한 내용도 확인해보자.

Navigating file system

이번에는 파일탐색기처럼 터미널에서 폴더와 파일들을 탐색할 수 있게 해주는 명령어들을 알아보자.

pwd

첫번째로는 지금 내가 어떤 경로에 있는지 알아볼 수 있는 pwd이다. Print Working Directory의 약자로 내가 현재 있는 곳의 전체 경로를 print 해주는 명령어이다. server에서 로그를 남기거나 스크립트를 작성할 때도 많이 사용한다.

open .
ls
ls 과제폴더
ls  -l
ls -a
ls -la

두번째로는 ls 명령어이다. ls 명령어는 현재 디렉터리 안에 있는 폴더와 파일들을 출력해준다. list의 약자이다. 또한, 특정한 폴더 안을 보고 싶을때는, ls 하고 폴더 이름을 적어주면 된다.
또한, 파일에 대해서 자세한 내용을 보고 싶다면 ls -l 이렇게 long 포맷이라는 옵션을 이용하면, 파일의 이름과 사이즈, 언제 수정되었는지 그리고 파일을 소유하고 있는 사람의 오너도 확인해볼 수 있다.
그리고 UI상에서는 보이지 않는 숨겨져 있는 파일이나 디렉터리도 보고 싶다면, ls -a 즉, all 옵션을 이용하면 숨겨진 파일들도 다 볼 수 있다.
- 그리고 long 포맷과 all 옵션을 함께 사용하고 싶다면, ls -la를 이용해서 사용할 수 있다.
open . 을 입력하면 현재 위치한 디렉터리 폴더를, 파일탐색기를 실제로 켜서 보여준다. 여기서 점은 현재 경로를 의미한다.

cd 디렉터리 이름
cd ..
cd ~
cd -

cd는 change directory의 약자로 현재 디렉터리 위치를 변경할 수 있다. 그리고 cd .. 은 상위 경로를 의미한다.
또한, cd ~는 현재 설정된 사용자의 home 디렉터리로, 최상위 경로로 이동하게 된다.
마지막으로 cd -를 입력하면, 지금 위치로 오기 전에 이전 경로로 이동하게 된다.

find . -type file -name "*.txt"
find . -type file -name "*.json"
find . -type directory -name "*2"

find 명령어는 파일 시스템에서 특정한 파일이나 디렉터리를 찾을 때 유용하게 사용할 수 있다. 내가 현재 있는 경로와 그 하위에 있는 모든 폴더에 한해서, 모든 텍스트 파일을 찾고 싶다면 -> find 다음 현재 경로에서부터 시작해서 type은 file이고 이름은 .txt 확장자로 끝나는 모든 파일들에 대해서 찾고 싶을 때 find . -type file -name "*.txt" 이렇게 사용한다.
- 만약, 확장자가 json으로 끝나는 파일들을 찾고 싶다면 두번째 명령어를 입력해보자.
그리고, 파일이 아니라 디렉터리, 폴더를 찾고 싶다면 find . -type directory -name "*2" 이렇게 해주면 된다. 이름은 2로 끝나는 폴더이다.

which python3
which code

그 다음 명령어는 which이다. which는 내가 지금 실행하고자 하는 프로그램이 어디에 설치되어져 있는지, 어디에 설정되어 있는지 경로를 확인할 때 사용할 수 있다. 그래서 which python3 하게 되면 python3의 실행 경로를 확인해볼 수 있다. which code는 VS code의 경로를 확인할 수 있다.

Create and manage files

이제는 파일을 만들고 경로를 만들고, 파일을 복사 / 이동 / 삭제할 수 있는 명령어를 익혀보자. 또한 모든 파일에 한해서 키워드로 검색하는 방법도 있다.
UI 탐색기가 아니라, 터미널을 사용하는 가장 큰 장점중에 하나가 마우스를 사용하지 않고 빠르게 일들을 처리하고 확인할 수 있다는 점이 장점이라고 볼 수 있다.

touch new_file1.txt

touch 다음에 원하는 파일 이름을 작성하게 되면 -> 새로운 파일을 만들 수 있다.
위와 같이 txt 파일을 만들고 그 내부에 글들을 작성해보자.
- touch는 파일이 존재하지 않는다면 파일을 만들고, 기존에 존재하는 파일을 touch하게 되면 그 파일에 수정한 날짜가 touch를 한 시점으로 업데이트가 된다.

cat new_file1.txt
cat new_file1.txt new_file2.txt

cat 명령어를 이용해서 파일 이름을 입력하면, 파일안에 있는 내용들을 출력해서 볼 수 있다.
cat 다음에 파일명 1개를 작성해도 되고, cat 다음에 여러개의 파일이름을 작성하면 -> 모든 파일들의 콘텐츠를 한 번에 확인할 수 있다.

echo "hello world"
echo "hello world" > new_file3.txt
echo "Hello Brave New World" > new_file3.txt
echo "Goodbye world" >> new_file3.txt

echo 명령어 다음에 ".." 이렇게 문자열을 입력하면, 문자열을 터미널에 메아리 치듯이 출력해준다.
echo 다음 문자열을 입력하고, 오른쪽 화살표를 입력한 다음 파일명을 작성하게 되면 -> echo 옆에 있는 문자열을 새로운 파일을 만들면서 content로 직접 넣어줄 수 있다.
- 여기서 한 가지 중요한 포인트는, 오른쪽 화살표 하나만을 이용하면 입력한 문자열을 그대로 새롭게 덮어씌워주는 기능을 하게된다. 즉, 이전에 작성한 내용들이 삭제되고 새로운 문자열이 생성된다.
- 만약 나는 덮어씌우지 않고 뒤에다가 문자열을 추가하고 싶다면 -> 오른쪽 화살표를 2개 이용해서 파일명을 적어주면 된다.

mkdir 원하는이름
mkdir -p div/div2/div3

mkdir은 경로를 만드는 명령어로 make directory의 약자로 디렉터리를 만들 수 있는 명령어이다. mkdir 다음에 원하는 이름을 작성하면, 현재 있는 경로에서 새로운 디렉터리를 생성해준다.
만약, 한번에 디렉터리 여러 개를 생성해서 경로를 만들고 싶다면 -> -p 옵션을 이용해서 원하는 경로를 전부 적으면 중간중간 필요한 디렉터리가 자동으로 생성된다.
이제, 파일을 관리할 수 있는 3가지 명령어에 대해서 알아보자.

cp file1.txt dir1/

먼저 cp는 copy의 약자로 cp 다음에 원하는 파일명과 / 원하는 경로를 작성해주면 원래 있었던 해당 파일을 복사해서 지정한 경로로 위치해 준다.

mv file2.txt dir1/
mv file3.txt file2.txt

만약, 복사하지 않고 이동만 시키고 싶다면 move의 약자인 mv를 사용한다. mv 다음에 원하는 파일과 어디로 이동하고 싶은지 경로를 작성해주면 된다.
그리고 cp나 mv 모두 새로운 파일로 이동하거나 복사하고 싶다면 mv 원하는 파일 대상 파일 이렇게 작성할 수 있다.

rm file1.txt
rm -r dir2

rm은 remove의 약자로 파일을 삭제할 때 rm 다음에 원하는 파일 이름을 작성하면 해당 파일을 삭제할 수도 있다.
rm dir2 처럼, 디렉터리를 삭제하려고 할 때는 경고 메세지가 나온다. 그래서 -r 옵션을 사용해서 삭제해야 한다.

grep "world" *.txt
grep -n "world" *.txt
grep -ni "world" *.txt
grep -nir "world" .

grep이라는 명령어는, Global regular expression print의 약자로 우리가 코딩을 할 때 한 파일 안에서 키워드로 검색을 하거나 또는 프로젝트 전체에 한해서 키워드로 검색할 경우가 많이 있을 것이다. 이 때 터미널에서 동일하게 할 수 있는 명령어가 바로 grep이다.
- grep 다음에 검색하고자 하는 키워드를 작성하고 특정한 파일을 대상으로 찾고 싶다면, 확장자를 명시해주면 된다.
- 또한, 검색했을 때 해당 내용이 정확히 몇번째 줄에 있는지 확인하고 싶다면, -n 옵션을 사용해서 확인해볼 수 있다.
- 그리고, 대소문자 상관없이 다 검색하고 싶다면, -i 옵션을 사용하면 된다.
- 지금 현재 있는 경로에서, 보통은 현재 프로젝트의 최상위 경로에서 특정 문자를 전부 다 검색하고 싶을 때는 -r 옵션을 추가로 주면 된다. 다만 ni옵션을 같이 주어서 몇번째 줄인지 / 그리고 대소문자 상관없이 검색하고 검색하고자 하는 단어 다음에 현재 경로를 뜻하는 .을 입력해주면 된다. 이렇게 하면, 현재 경로와 그 하위에 있는 모든 서브 폴더에 한해서 해당 문자를 검색할 수 있다.

Work with environment variables

마지막 카테고리로는 환경변수 설정하기이다.
환경변수라는 것은, 내 컴퓨터에서 특정한 키워드가 어떠한 일을 하거나 경로를 저장할 수 있도록 만들고 그렇게 정의해놓은 변수들을 의미한다.

export MY_DIR="dir1"
env
cd $MY_DIR
unset MY_DIR

유닉스에서는 export라는 명령어를 이용해서 환경변수를 설정할 수 있다. export 다음에 환경변수를 만들어줄 수 있고 보통 대문자로 만들어준다. 그리고 단어 사이사이에 구분자를 넣어줄 때는 _ 이렇게 밑의 대쉬를 이용하고 있다. 위의 예시로 export 다음에 MY_DIR(나의 디렉터리)를 써주고 "dir1" 즉, export MY_DIR="dir1" 이렇게 입력하면 -> MY_DIR은 dir1이다 라고 설정해준 것이다.
이렇게 export를 이용하면, 환경변수 즉, 내 컴퓨터 상에 이러한 변수를 설정할 수 있는 것이다.
- 설정된 모든 환경변수를 보고싶다면, env 명령어를 입력하면 -> 모든 환경변수를 출력해볼 수 있다. ex) 내 맥북에서 env를 입력해보면 -> PATH라는 변수가 python 경로로 정의되어 있다는 것을 확인해볼 수 있다.
위에서처럼 MY_DIR이라는 변수를 정의했다면 이제 -> 터미널이나 내 컴퓨터에서 이 MY_DIR이라는 환경변수를 이용하여 dir1를 나타낼 수 있다. 우리가 프로그래밍을 할 때, 변수를 설정하는 것과 똑같다고 보면 된다.
- 그래서 터미널에서 cd 다음에 dir1이라고 명시해도 되지만, 지금은 환경변수로 저장을 해놨기 때문에 환경변수를 사용할 때는 -> 달러 싸인 다음에 환경변수 이름을 작성하면 바로 dir1으로 이동할 수 있게 된다.
환경변수를 제거하고 싶다면, unset MY_DIR 이렇게 unset 명령어를 이용해서 지정된 환경변수를 삭제할 수 있다.

Vi, Vim

많은 사람들이 터미널을 사용하면서 수정모드에 들어온 건 알겠는데, 도대체 여기서 어떻게 나가는지 힘들어하는 사람들이 많다.
Vi 또는 Vim은 터미널에서 많이 이용되는 텍스트 에디터이다. Vim은 터미널에서 뿐만 아니라, VS Code에서 코딩을 할 때도 유용하게 사용할 수 있다.
터미널에서 Git를 사용하거나, 어떤 특정한 파일을 수정할 때 우리가 알게 모르게 Vim를 이용하게 된다. 이 Vim에서 파일을 수정할 때, 어떻게 다시 터미널로 돌아가는지 알아보자.

vim file1.txt

터미널에서 vim 다음에 원하는 파일명을 작성하면 -> 새로운 파일을 만들 수 있고 또한 터미널 화면이 vim 에디터 모드로 들어가게 된다.

이렇게 vim 에디터에 들어왔을 때 어떤 파일을 수정하고 싶다면 -> i를 입력해야 한다. i라는 insert 명령어를 클릭한 다음에, 글자를 수정하거나 삭제할 수 있다.
- 글자를 추가로 입력해서 이제 insert 모드에서 나가려면 -> 키보드 제일 왼쪽에 있는 esc를 누른다. 그리고 :콜론을 누르고 원하는 명령어를 작성하면 된다.
- :w는 방금 수정한 내용을 꼭 저장해달라는 write changes 의미이다.
- :q는 꺼달라는 quit의 의미이다. 그래서 파일을 수정하다가 이 수정한 내용은 무시하고 그냥 끄고 싶을 때는 :q를 이용하면 된다.
- 만약 저장하면서 종료하고 싶다면 -> :wq 명령어를 쓰면 된다.

vim file1.txt

위와 똑같이 vim 다음에 기존에 존재하는 파일명을 입력하면, 터미널 화면이 해당 파일을 수정할 수 있는 화면으로 바뀌게 된다.

이렇게 다시 열어서 i를 눌러서 수정할 수 있게 모드를 바꾸고 -> 텍스트를 추가해서 입력한 다음, 저장하지 않고 esc 누르고 :q만 이용해서 종료하려고 하면

vim이 이렇게 저장하고 있는데 중지하는 게 맞는지 경고를 하게 된다.
이 때, 응 맞아 그냥 종료해줘 라고 하고 싶을 때는 -> :q! 이렇게 q 다음 !를 붙여줘야지 강제로 종료가 된다. 그러면 실제로 추가한 내용을 저장하지 않고 끄게 된다.
참고 유튜브

Git

git은 Command line Interface로 명령어를 입력하는 방법과 마우스로 쓸 수 있게 GUI로 만들어진 소프트웨어(ex. Source Tree)를 쓰는 방법이 있다.

https://git-scm.com/ 해당 사이트에 접속해서 먼저 git을 설치.
IDE라고 불리는 통합 개발 환경을 조성해주는 소프트웨어를 사용 (ex. Vs code)
원하면 마우스로 git을 다룰 수 있게 해주는 SourceTree 홈페이지로 가서 다운로드. https://www.sourcetreeapp.com/

Git 사용법

1. Git 저장소 만들기

터미널을 이용해서 현재 폴더로 이동한 후,

git init .

다음과 같이 입력하면 빈 저장소가 만들어졌다는 메시지가 뜬다. 즉, 해당 폴더가 git의 관리 하에 들어간 것이다. 끝에 점을 입력하지 않으면 해당 디렉터리가 아닌 루트 디렉터리에 .git 폴더가 생성된다. 그리고 나서는,

git remote add origin 레포지토리 주소 

git remote -v

이렇게 입력해서 github 레포지토리를 연결해준다. 그리고 git remote -v로 연결되었는지 확인해준다.

2. 브랜치 생성하기

git branch <branchname> # 해당 이름으로 브랜치 생성
git checkout -b feature/#1 # branch 이름이 feature/#1 이라고 가정할 때, 해당 브랜치를 생성하고 바로 전환
git switch -c feature/#1   # 같이 의미로 사용할 수 있는 명령어

이렇게 브랜치를 생성함과 동시에 해당 브랜치로 전환할 수 있다.

git branch

그리고 위의 명령어로 내가 현재 어떤 브랜치에 속해있는지 확인해보자.

3. commit 진행하기

3번부터의 과정은 commit를 진행하는 과정이다. 먼저 진행하기 전에, 수시로 현재 개발되고 있는 저장소의 코드를 바로바로 내 로컬에 반영해주는 것이 좋다.

git pull origin main

기본 브랜치가 main이라면, 위의 명령어로 현재 로컬을 최신 코드로 반영해줄 수 있다.
그 다음, commit 전에 새로운 브랜치가 필요하다면 브랜치를 생성해주고 commit를 진행하자. 아니면 기존의 다른 브랜치로 전환하자.

git checkout 브랜치명

그리고 이제 commit 과정을 진행하자.

git add .

현재 작업 내용을 working directory에서 staging area에 올려놓고 저장한다.

git commit -m "...." 

git commit

그리고 commit를 진행하면 staging area에서 repository로 올라가게 된다. 한 줄로 커밋 메시지를 전달할 때는 위의 명령어를 사용할 수 있고 미리 정해진 컨벤션이 있는 경우에는 아래 명령어를 입력하면 된다.

git push origin 브랜치명

# 만약 처음 레포지토리 생성 시 main 브랜치가 없어 오류가 난다면 아래 커맨드 입력하기
git branch -M main

마지막으로 위의 명령어를 입력하면 Pull Request가 된다. 저장소에서 해당 버튼을 누르면 PR이 날라간다.
여기서 origin은 remote repository의 이름을 의미한다.

merge가 충돌하는 경우

예시를 들어보면, master branch와 다른 branch에서 모두 같은 파일에 동일한 내용을 수정하는 경우에는 merge를 했을 때 충돌하는 경우가 발생할 수 있다.
따라서, 최대한 다른 branch에서는 같은 파일을 수정하는 일을 피해서 작업할 수 있도록 조심해야한다.
git pull 오류 해결방법

git add .

git stash # 해당 명령어를 통해 현재 Staging 영역에 있는 파일의 변경사항을 스택에 임시 저장

git pull origin master

git stash pop # # 스택에 저장한 내용 제거

git merge 충돌 해결방법 블로그

다른 branch에서 가져오기 - Rebase

실제 프로젝트에서는 branch의 생성 및 변경이 굉장히 복잡하게 구성되어 있다.
이럴 때, 모든 변경 내용들이 한줄로 딱 깔끔하게 정리됐으면 좋겠다 싶을 때는 -> merge 대신 rebase를 사용하자.

git rebase 가져올branch이름    ex.) git rebase my-idea

이렇게 기존의 master branch에서 '병합' 대신 '재배치'를 선택하면 가지들이 깔끔하게 한 줄로 보여지게 된다.
프로젝트나 팀의 성격에 따라 merge나 rebase를 선택하면 된다.

다 사용한 branch 삭제하기

다 사용한 branch를 삭제하고 싶을 때는

git branch -D 브랜치이름

해당 명령어를 입력하면 된다.

git init 를 다시해야 할 때는, 이미 생성된 .git를 삭제하고 다시 해보기.

Working Directory(workspace) : 소스 코드를 작업하는 로컬을 의미.
Staging Area(index) : 코드 변경사항이 저장소에 커밋되기 전에 반드시 거쳐야 되는 중간단계를 의미. git add 명령어를 입력하면 해당 영역으로 이동하게 된다.
- git add . 명령어를 입력한 다음 -> git status를 입력하면 Untracked files에서 new file 상태로 변경됨을 알 수 있다.
Repository : 스테이징 영역에 있는 소스 코드에서 git commit 명령어를 실행하면 최종적으로 Git의 저장소에 반영된다.
- 더 자세히 살펴보면, git commit 명령어를 입력하는 것은 Git 저장소에 반영되기 전, 지금까지의 코드 변경 이력을 local repository에 기록하는 명령어이다.
- 그런데 보통 git init . 으로 시작하기 때문에 본인의 Working Directory안에 .git 폴더가 생성되니까 본인의 Working Directory가 곧 local repository가 되고 .git 폴더에 commit 내용이 저장된다.
  - .git 폴더 -> logs 폴더 -> HEAD 파일을 보면, 지금까지의 commit 내역을 확인할 수 있다.
- 반드시 git push 명령어를 입력해줘야 그동안의 코드 변경 이력이 remote repository에 반영된다.

git의 모든 브랜치를 출력하고 싶을 때

git log --graph --all --oneline

해당 명령어를 입력하면 git의 모든 브랜치들을 출력할 수 있다.
관련 블로그
그래서 확인해보면, main 브랜치에서 브랜치를 생성하는 것과 이미 만들어진 브랜치에서 또 다른 브랜치를 만드는 것은 다른 것이다.
- github으로 작업할 때, git pull origin main 명령어를 브랜치에서 진행하고 다시 로컬의 main 브랜치로 checkout에서 한 번더 해주면 된다.

Git remote url 변경

먼저 해당 디렉터리 위치에서

git remote -v

해당 명령어로 지금 설정 되어있는 remote url를 확인할 수 있다. 그리고나서 해당 remote url를 변경하고 싶을 때는,

git remote set-url origin 변경할url주소

이렇게 remote url를 변경할 수 있다.
관련 블로그

버전관리에서 commit이란

commit은, 파일 및 폴더의 추가/변경 사항을 저장소에 기록하기 위해 commit이라는 버튼을 눌러서 변화에 대해 기록하는 것이다. commit은 특정 소스가 변경된 이유를 메시지로 입력해 버전을 관리해 나갈 수 있다. 이러한 commit 기록을 관리하면 과거의 변경이력과 내용을 파악할 수 있다.
ex) 한 브랜치에다가 계속 git add . -> git commit -> git push origin 브랜치명 / 이러한 과정을 거친다면, 한 브랜치에 버전이나 코드 변경에 따른 commit 내역을 github에서 확인할 수 있게 된다. 계속 commit를 진행하다가 main 브랜치에 merge를 하고 싶다면, 그 때 git push origin 브랜치명 / 해당 명령어를 입력한 다음 PR 버튼을 누르면 된다.
- git log 명령어로 commit 내역을 확인할 수 있다. 그러면 현재 commit된 내용을 확인할 수 있다.
- 또한, git add hello.py 이렇게 하나의 변경된 파일만 staging area에 올려서 commit를 진행할 수도 있다.
git status
- git status는 파일들의 상태를 확인할 때 사용하는 명령어이다.
- 커밋할 변경 사항 / 커밋하도록 정하지 않은 변경 사항 / 추적하지 않는 파일 이렇게 나뉘는데, 각각 Staged 상태(git add 이후) / Modified 상태(git commit 이후) / Untracked 상태(git add 전)를 의미한다.
관련 블로그
- 2
- 3

Git 커밋 컨벤션이란

.git이 있는 디렉터리 안에서 터미널로 touch ~/.gitmessage.txt 이렇게 입력해서 파일을 생성할 수 있다.
touch가 파일을 생성하는 명령어인데, ~/ 이렇게 설정하니까 Desktop 위의 경로인 ~경로에 .gitmessage.txt를 설치하게 된다. 그래서 터미널에서 ~ 여기서 ls -a를 입력하면 .gitconfig와 우리가 만든 .gitmessage.txt를 확인할 수 있게 된다.
이렇게 설정을 해주면, 어떤 프로젝트 디렉터리에서든 같은 Git 커밋 템플릿을 사용할 수 있게 된다.
- git add . 이후에 git commit 명령어만 입력하면 템플릿 작성 화면이 뜨게 되고 vim 수정을 해주면 된다.
관련 블로그

Github 및 gitignore 설정

Git으로 관리한 내용들을 Github을 사용하여 온라인에 업로드해서 보관하고 다른 사람과 협업하는 과정을 다뤄보자.
Git에서 commit을 통해 -> 나의 프로젝트를 local 저장소에 반영했고 -> push를 통해 local 저장소의 내용을 원격 저장소에 반영하자.
Git을 사용해서 클라우드를 쓰듯이 소스들을 업로드해서 저장하고 다른 개발자들과 공유할 수 있는 Git 저장소들 중, 대표적인 것으로 Bitbucket, Gitlab, Github 등이 있다.
Github 레포지토리 issue 생성
- 프로젝트를 진행하면서 발생하는 모든 이슈를 생성해서 관리할 수 있는 기능이다.
- 해당 Issue에 대한 label도 추가할 수 있다. 또한, 해당 이슈에 대해 Assignees(책임자)를 부여할 수도 있다.
- 관련 블로그, 관련 블로그 2

Github 레포지토리 Projects 툴 생성
- 칸반(Kanban)이라는 단계별 작업 현황을 열(column) 형식의 보드 형태로 시각화하는 프로젝트 관리 방법을 Github에서 사용하는 방식이다.
- 그래서, 생성한 이슈에서 projects를 설정할 수 있고 pull request할 때도 이슈와 프로젝트를 설정할 수 있다.
- 관련 블로그

1. Github 저장소 만들기

github 계정을 만들고 로그인 이후에 Create a new repository를 클릭하면 -> Git으로 관리되는 프로젝트 폴더 하나가 원격으로 저장되는 공간이 생성된다.
이 때, Public를 선택하면 Github에 접속한 모든 사람들이 내 코드를 방문하거나 검색할 수 있다.
Private은 나, 그리고 내가 이 레파지토리에 초대한 특정 사용자들만 볼 수 있다.
오픈소스로 만들어서 사람들에게 공유하고 도움이나 참여를 받으려면 혹은 기업들에게 공개할 내 포트폴리오로 사용하려면 Public을 선택하자.
해당 사항들을 선택하여 저장소를 생성.
- Github repository의 url은 -> https://github.com/username/레파지토리명 이렇게 설정된다.

2. 다루지 않을 파일 설정하기 - .gitignore

프로젝트를 진행할 때, Git으로 관리하고 Github에 올릴 필요가 없거나 오히려 그래서는 안 되는 파일들이 있을 수 있다.
코드를 실행하면 패키지가 다운받아지거나 코드대로 빌드되어서 자동으로 생성되는 파일들은, 어차피 코드만 있으면 그 때마다 실행해서 만들 수 있기 때문에 굳이 Git에 무리를 주거나 Github 용량을 차지할 필요가 없다.
또한, 보안적으로 중요한 내용 / 예를 들어 데이터베이스 계정 등이 담긴 파일은 오픈소스 프로젝트라도 대중에게 공개되면 안 된다.
이럴 때 사용되는 게 바로 .gitignore 파일 이다.

프로젝트 폴더 바로 안쪽, 최상위에 .gitignore라는 파일을 생성한다. 해당 파일은 숨김파일로 지정된다.

https://www.atlassian.com/git/tutorials/saving-changes/gitignore 여기에서 Git 관리에서 제외시킬 파일이나 폴더, 기타 요소를 지정하는 형식이 나와있다. 해당 사이트에서 django를 검색한 다음 나오는 코드들을 입력한다.

만약, .gitignore에 들어가는 파일이 특정 디렉터리 하위에 있다면 ex) /labq/my_settings.py 이런식으로 넣어주기.
- 해당 블로그 참고
그리고나서

git status

라고 입력해봤을 때, 해당 파일은 commit 해야할 목록에서 없어진다. 이 상태에서

git add .
git commit -m "gitignore사용"

이렇게 입력하고

git push origin main

github에 push까지 해주면 우리가 .gitignore파일에 적어두었던 python 파일은 github에 push가 되지 않는다는 것을 확인할 수 있다.
안드로이드나 스프링 등 처음부터 골격이 세팅된 프로그래밍 프로젝트를 생성하면, 이 .gitignore파일을 확인해볼 수 있다. 그래서 해당 내용은 github에 올릴 필요가 없는 내용들이고 빌드하면 만들어지는 것이거나 컴퓨터 IDE 세팅이라는 것 등을 파악할 수 있다.

3. Github 소스 내려받기

이제 Github에 올린 소스들을 내 컴퓨터에 다운받아보자.
레파지토리가 Public이라면 누구나 가능하고, 집에 있는 Mac으로 작업해서 Github에 올린 소스들을 회사의 컴퓨터에서 다운받는다고 가정해보자.
레파지토리 페이지에서 Code 라는 버튼을 클릭하고 -> 해당 레파지토리의 주소를 복사한 다음

git clone 복사한주소     ex.) git clone https://github.com/tkdqor/likelion.git

터미널에 입력해보자. 그러면 해당 레파지토리명의 폴더가 생긴 것을 볼 수 있다.

4. 작업 주고받기

commit 메시지는 팀원들과 협업할 때, 이번 커밋에서 어떤 변화들이 주어졌는지 간략히 알려주는 역할도 수행한다.
만약, 다른 팀원이 우리가 같이 작업하고 있는 레파지토리에 push를 진행했을 때 -> 우리가 확인하는 방법이 있다.

git fetch

이 명령어를 입력한 후에,

git status

을 입력해보면

... Your branch is behind 'origin/main' by 1 commit, and can be fast-forwarded.

이렇게 이 브랜치가 원격 origin의 main 브랜치에 커밋 하나가 뒤쳐져 있다고 나오게 된다. 즉, Github에서 다운받아야 할 사항이 있다는 얘기이다. 그러면 받아보자.

git pull 원격명 브랜치명        ex.) git pull origin main

이 명령어를 입력한 이후에는 변경사항이 새롭게 다운된다.

이렇게, Git과 Github을 사용해서 원격으로 협업할 때는 뭔가 작업하거나 push하기 이전에 먼저 해당 과정을 거쳐서 다운받아야 할 사항이 있는지 확인하고 있으면 pull를 해주고 작업을 하는 게 좋다.
- 팀원이 작업한 내용들을 꾸준히 업데이트 받아야 괜한 작업을 하거나 conflict가 나는 일을 방지할 수 있다.
- 그리고 Github에 다른 누군가가 올린 내역을 pull로 다 업데이트 받기 전까지는 내쪽에서 push를 할 수 없다.
- 관련 내용

5. branch 주고받기

local 환경에서 다른 branch로 checkout된 상태에서, 작업을 한 뒤 해당 branch에서 github으로 push하는 경우

git push origin 새로운branch명     ex.) git push origin my-idea

이렇게 입력하고 난 뒤, Github페이지에서 branch를 눌러보면 my-idea라는 새로운 branch가 새로 생겨나게 되고 선택하게 되면, local의 새로운 branch상태가 새롭게 반영이 된다.

내가 공동으로 작업하고 있는 하나의 레파지토리의 main이 아닌 다른 branch를 다운받아보자.
먼저

git fetch

해당 명령어를 입력해보면, 새로운 branch가 만들어졌다는 메시지가 뜬다.

그리고 원격에 어떤 branch가 있는지 확인해야 한다. git branch는 local에서의 branch만 볼 수 있지만,

git branch -a

이렇게 터미널에 입력하면

remotes/origin/my-idea

이런식으로 원격 저장소의 다른 branch를 확인할 수 있다. 이걸 local로 가져오기 위해서는,

git checkout -b my-idea(새롭게만들branch이름) origin /my-idea(원격에있는branch이름)

해당 명령어를 입력하면, local에 my-idea라는 이름으로 branch를 새롭게 만들고, 원격의 my-idea라는 branch의 내용을 받아와서 새롭게 만든 my-idea branch로 들어간다는 의미이다.

git branch

이 명령어로 local에서도 my-idea라는 branch가 생성된 걸 확인할 수 있다.

6. 충돌 해결하기

Gitf를 사용하면서 익혀나갈 때, 많은 사람들이 어려워하고 부딪치기 싫어하는 이유가 충돌이 발생하는 경우 때문이다.
branch간에도 발생할 수 있지만, 같은 branch에서 같은 파일의 같은 부분을 원격의 두 컴퓨터가 같이 건드린 상황에서도 발생할 수 있다.
- push 하기 전에 먼저 github의 내용을 pull 하려고 하는데 내가 똑같은 파일을 수정했다면, 해당 파일을 충돌하지 않도록 수정한 다음 저장해주고 다시 진행하면 된다.

컴파일러와 인터프리터

컴퓨터는 0과 1이라는 신호를 사용해서 돌아가는데, 컴퓨터가 알아듣는 명령어들은 0과 1의 긴 조합들로 이루어져 있다. 요즘 사용된 프로그래밍 언어들은 사람들이 알아보기 쉽게 설계되어있다.
하지만 컴퓨터는 이 언어들을 알아보지 못하기 때문에 이를 기계들의 언어로, 또는 중간 단계로 번역해주는 번역 프로그램이 필요하다. 그래서 이 작업을 미리 해놓으면 컴파일러 / 그때그때 하면 인터프리터라고 부른다.
- C언어나 자바 등의 언어들은 개발자가 코딩을 마치고 완성된 프로그램을 출시하는 단계에서 컴퓨터에게 컴파일을 시킨다. 개발자가 작성한 코드들을 출시전에 번역하는 것이다. 컴파일러라고 불리는 번역가가 컴퓨터의 언어로 번역 작업을 하는 것이다. 때문에 이러한 언어들을 컴파일 언어라고 부른다.
- 반면에, 코드를 그대로 가져가서 그때그때 번역을 하는 언어들도 있다. Javascript, Python, Ruby 등이 있다. 이들을 인터프리터 언어 또는 스크립트 언어라고 한다. 이 경우, 소프트웨어를 출시할 때 컴파일을 하는 과정이 필요없기 때문에 코드 수정이 잦은 서비스의 경우, 업데이트가 수월하지만 그때그때 통역사가 번역해야 하기 때문에 실행속도가 컴파일 언어보다 느리다. 그리고 프로그래머가 짠 코드가 그대로 배포되어 사용되기 때문에 코드가 쉽게 누출되기도 한다.
- 결론적으로 코드를 미리 번역해서 출시하면 컴파일 언어 / 실행할 때마다 번역하면 인터프리터 언어라고 볼 수 있다.

환경변수란

"환경" 이라는 것은 소프트웨어가 동작하는 공간을 말한다. 그 소프트웨어가 깔린 '컴퓨터'를 생각해보자. '환경변수'라는 것은 그 컴퓨터마다 지정된 값이다.
- ex) 철수집과 영희집이 있고 각각 서재 / 건물종류 / 현관비밀번호 라는 환경변수가 칠판에 적혀있다고 생각하자. 각 환경변수는 두 집마다 다른 값들이 있을 것이다. (철수집 - 아버지 방 / 전원주택 / 1123 & 영희집 - 어머니 방 / 아파트 / 2342)
만약 각 집에 '영어사전을 ${서재}에 꽂으세요' 라는 코드를 보내면 철수집은 아버지 방으로, 영희집은 어머니 방으로 보내지게 된다. 이 '서재'란 환경변수에 집별로 적절히 들어간 값 덕분에 어느 집에서든 이 명령어로 올바른 곳에 사전을 둘 수가 있다.
- 자바를 설치하고 나서 환경변수를 세팅하면, 내 컴퓨터 어디에 자바가 설치되었는지 환경변수에 적어서 어떤 자바 프로그램이든 내 컴퓨터 어딘가에 설치된 자바를 문제 없이 찾아서 실행할 수 있도록 하는 것이다.
또한, 각 집에 '집의 ${건물종류}가 전원주택이면 잔디를 깎으세요' 라는 코드를 보낼 수 있는데 이렇게 각 환경의 조건마다 어떤 동작을 시행할 지, 어떻게 시행할 지를 정할 수 있다.
개발을 할 때는 보통 개발용 / 배포용이라는 의미로 개발용은 dev / 배포용은 prod 라는 비슷한 환경변수들이 사용된다. 소프트웨어 개발을 할 때, 개발자가 디버깅을 쉽게 하기 위해서 화면에 개발과정과 관련된 특정정보들이 뜨도록 할 수 있는데 이게 사용자들에게 배포된 제품에도 뜨면 안될 것이다.
- 그래서 개발을 하는 컴퓨터 / 제품이 배포될 서버에 각각 dev / prod라는 환경변수 값을 넣고 그에 따라 조건을 주면 개발용 컴퓨터에만 해당 내용들이 나올 수 있게 설정할 수 있는 것이다.
마지막으로 '집에 도착하면 ${현관비밀번호}를 입력하고 들어가세요' 라고 코드를 보낼 수 있는데 이 때 꼭 환경변수를 사용해서 코드를 작성해야 한다. 그렇지 않고 코드에 직접 비밀번호를 적게 되면 남들에게 노출될 위험이 커지기 때문이다.
이처럼, 다양한 용도로 각 환경마다의 값을 지정할 때 사용되는 게 환경변수이다. 환경이 꼭 컴퓨터를 의미하기 보다는 프로세스가 돌아가는 세분화된 공간이라고 생각하자.
- python의 경우, 처음 설치 시 PATH 추가에 체크를 했다면 알아서 환경변수를 설정해주고 어떤 디렉토리에서든 python를 사용할 수 있게 된다.

django secret key 숨기기

프로젝트 디렉터리 내부에 my_settings.py를 생성하고 변수설정
- django_secret = ‘여기에 settings.py의 secret key를 입력' 이렇게 내부에 작성
settings.py에서는 from .my_settings import django_secret 이렇게 my_settings.py를 가져오고 변수도 가져오기.
- 또한, settings.py에서 SECRET_KEY = django_secret 이런식으로 설정해주면 된다.
마지막으로 .gitignore에서 /labq/my_settings.py 이런식으로 추가해주기.

1byte는 8bit

컴퓨터는 모든 정보를 0과 1로 저장하고 그 0과 1의 집합을 디지털 데이터라고 한다. 그리고 0과 1의 정보를 나타내는 최소 단위를 1비트(bit) 라고 한다.
또한, 1비트 하나로 많은 양의 데이터를 표현할 수 없기에 8개의 비트를 묶어 1바이트(byte) 로 사용하고 있다. 컴퓨터는 기본적으로 이렇게 바이트 단위로 데이터를 읽고 쓰는 작업을 진행한다.
따라서, 컴퓨터가 데이터를 저장하는 최소 단위는 1byte라고 할 수 있다.

=> 1비트가 0과 1 2가지를 표현할 수 있으므로 8비트, 즉 1바이트는 -> 2의 8승으로 총 256종류의 정보를 나타낸다.

데이터 단위

관련 블로그

1픽셀은 3byte

픽셀(pixel) 이란, 이미지를 이루는 가장 작은 단위를 의미. 이미지를 구성하는 점이라고 볼 수 있다.
ex) 모니터 해상도를 나타내는 640x480과 같은 숫자들이 바로 픽셀의 개수를 의미한다. 즉, 가로 픽셀 640개 / 세로 픽셀 480개로 총 307,200개의 픽셀로 해상도가 구성되었다는 것을 말해주는 것이다.
이진 영상(binary image)
디지털 이미지 중 가장 간단한 형태.
각 픽셀이 1비트로 이루어져 있음. 그래서 밝음(1)과 어두움(0)만 표현.
흑백 영상(gray-scale image)
각 픽셀의 밝기 값을 0~255 사이 값으로 표현한 이미지.
즉, 1바이트(=8비트)의 메모리를 사용.
컬러 영상(color image)
컬러 영상은 빨강, 녹색, 파랑 이렇게 3개의 채널로 표현된다. 각 채널은 0~255 사이의 값으로 8비트로 이루어진다.
따라서, 1픽셀 당 -> 8비트 3개(Red, Green, Blue)를 조합하여 총 24비트이므로
1픽셀은 3바이트가 된다.

2의10승이란

2^10 = 10bit = 1,024이다.
1비트는 0과 1 2가지로 표현되니까 2^1승으로 표현된다. 그리고 2비트는 00, 10, 01, 11 이렇게 4가지로 2^2승으로 표현된다.
마찬가지로 8비트는 -> 2^8승으로 256가지를 표현할 수 있고 0~255의 데이터를 저장할 수 있게 된다. 이러한 8비트를 1바이트라고 한다. => 그래서 2^10승은 -> 10비트를 의미하고 -> 1,024라는 값이 되는 것을 알 수 있다.

스마트폰 카메라 해상도

스마트폰 카메라 해상도가 대략 어떻게 될까.
해상도란, 이미지 안에 얼마나 많은 픽셀이 들어가 있는지 나타낸 것이다. 그리고 픽셀이 작을수록 사진이 선명해진다. ex) 같은 크기의 사진을 입자 4개로 만든 것과 1,000만개로 만든 것을 비교하면 4개로 만든 건 모자이크같이 형상을 알아보기 힘들 것이다.
내가 사용하고 있는 아이폰12 pro 기준으로 대략 해상도는 12백만 화소(픽셀)라고 한다. 가로 4290 X 세로 2800 픽셀이다.
참고 블로그

JPG파일

왜 사진에는 JPG를 사용할까?
JPG(JPEG)는 정지 화상을 위해 만들어진 손실 압축 파일 형식으로, 약간의 손실을 감수하고 용량을 줄이고 작은 크기로 사진을 저장하는데 유용하기 때문에 사용된다.
- JPG(JPEG)는 손실 압축(lossy compression), direct color으로 사진같이 복잡한 색상을 갖는 이미지 저장에 적합하다. 그리고 문자, 선등 뚜렷한 윤곽선을 가지는 이미지는 품질 저하(뭉개짐, 노이즈)가 다소 뚜렷하게 보인다.
- PNG는 비손실 압축(lossless compression, indexed color으로 텍스트, 선, 아이콘 등을 저장하는데 적합하다.
손실압축은 용량을 줄이기 위해 화질을 낮추고 비교적 크게 용량이 감소하지만, 원래 형식을 복원할 수 없다.
무손실압축은 적은 용량만이 감소되지만, 원래 형식으로 복원이 가능하다.
Direct color는 픽셀마다 색 정보를 가지고 있음. 다양한 컬러. 큰 용량.
Indexed color는 픽셀마다 색 정보를 가지고 있는 것이 아니라 Pallette에 별도로 컬러를 저장하고 픽셀은 팔레트의 정보를 가지고 있음. 작은 용량.

칼라값 ffffff

칼라값 ffffff는 흰색을 나타낸다.
f는 16진수로 2의 4승으로 4비트이고 ff가 8비트가 되어 1바이트를 나타낸다.
- ffffff는 3바이트로 3개의 채널로 구성되고 3 채널은 픽셀당 24비트로 변환된다.
- 채널 당 8비트 이미지에서는 컬러 이미지의 RGB(빨강, 녹색, 파랑) 구성 요소 각각에 0(검정)에서 255(흰색)까지 강도 값이 할당된다. 그래서 3채널 모두 255라면 흰색이 된다.
참고 자료 : http://www.n2n.pe.kr/lev-1/color.htm
- https://helpx.adobe.com/kr/photoshop/using/color-modes.html

a element의 href

a는 html <a>태그로 외부 문서나 내부 문서를 링크할 때 사용하는 태그이다. 그리고 href는 hypertext reference의 약자로 실제로 이동할 웹페이지의 주소를 뒤에 적는 속성이다. 그래서 <a> 태그와 href 속성이 서로 같이 사용되서 하이퍼링크를 만들 수 있게 된다.

call by reference란

함수의 호출 방법은 대표적으로 Call by value(값에 의한 호출)와 Call by reference(참조에 의한 호출)가 있다.
함수 호출이란 말 그대로 정의된 함수를 호출하는 것으로 함수에 정의한 매개변수의 형태에 따라 Call by value 혹은 Call by reference인지 결정된다.
Call by value란, 함수 호출 시 넘기는 인자(함수가 호출될 때 매개변수에 실제로 담기는 값)의 값이 매개변수에 복사(Copy)돼서 함수 내에서 매개변수(매개변수란, 함수를 정의할 때 사용되는 변수)에 직접적인 데이터 조작을 가해도 인자에 전혀 영향을 주지 않는 것이다. 즉, 값을 복사를 하여 처리한다는 것이다.
- 매개변수는 그 값이 Stack에 할당된다. Stack이란, 메모리의 스택(stack) 영역으로 함수의 호출과 관계되는 지역 변수와 매개변수가 저장되는 영역이다.
- 그래서 원래 값이 보존된다는 장점이 있다. 단, 복사하기 때문에 메모리 사용이 늘어난다.
Call by reference란, 인자의 값이 매개변수에 복사(Copy)된다는 점은 동일하다. 다만 복사되는 값이 데이터의 주소 값이라는 차이점이 존재한다. 쉽게 말하면 Call by reference란, 말 그대로 참조값으로 함수를 호출했단 뜻이다. 즉, 직접 참조를 하는 것이다.
- 중요한 차이점은 함수를 정의할 때 매개변수가 포인터 변수로 정의되었단 점이다. 즉, 변수의 주소를 인자로 받는 것이다. 그래서 주소에 저장된 값에 직접 접근할 수 있게 된다.
- 그래서 직접 참조해 빠르다는 장점이 있다. 단, 원래 값에 영향을 받게 된다.
관련 블로그
- 2
- 3
Python의 경우

Event Listener란

JavaScript의 개념 중 하나로, 이벤트 리스너란 이벤트가 발생했을 때 그 처리를 담당하는 함수를 가리키며, 이벤트 핸들러(event handler)라고도 한다.
DOM 객체에서 특정 이벤트가 발생하면 이벤트 리스너를 이용해서 특정 함수를 호출할 수 있다.
- DOM은 Document Object Model의 약자로 document라는 변수로 html 문서를 객체로 인식하여 문서 내 모든 요소에 접근할 수 있도록 하는 방법을 의미한다.
관련 블로그
- 2

OOP에서 상속이란

일단 OOP란, Object Oriented Programming의 약자로 객체지향 프로그래밍을 의미한다. 객체 지향 프로그래밍은 클래스와 객체를 사용하여 프로그램을 설계하는 방법론으로 특징으로는 캡슐화, 추상화, 다형성, 상속성을 가진다.
그 중에서 상속이란, 기존 클래스의 속성과 메서드를 사용하여 새 클래스를 만드는 것으로 새롭게 만든 클래스에 기존 상위 클래스의 기능을 가져와서 재사용하거나 새로운 기능을 추가할 수 있게 만들어주는 개념이라고 볼 수 있다.
- 이러한 상속은 코드 재사용에 상당히 유용하다.
관련 블로그
- 2

try와catch 코드

JavaScript에서의 예외 처리
try/catch문은 코드 상의 논리적인 문제가 있어 '예외'가 발생하는 경우, 이러한 예외 처리를 명시적으로 표현할 수 있게 해주는 코드이다.
먼저 try 안의 코드가 실행되고 에러가 없다면 catch 블록을 건너뛰게 된다. 에러가 있다면 try안의 코드가 실행이 중단되고, catch 블록에서 해당 에러에 대한 처리를 진행해 나갈 수 있게 된다.
관련 블로그
- 2

breakpoint

디버깅할 때 breakpoint란, 디버깅을 목적으로 실행중인 디버깅 대상 프로세스를 의도적으로 멈추게 하는 장소를 가리킨다.
프로세스가 멈추면 멈춘 시점의 변수나 스택 파라미터, 혹은 특정 메모리 지점의 값 등을 조사할 수 있다.
관련 블로그

코드 컨벤션

PascalCase # 파스칼 케이스
- 첫 문자를 모두 대문자로 표기하는 방식. 주로 python에서는 클래스와 모델을 정의할 때 적용
snake_case # 스네이크 케이스
- 변수나 함수명의 띄어쓰기를 언더바를 통해 구분하는 방식. python에서는 클래스와 모델 이외에 모두 이렇게 적용

pipenv란

pipenv는 파이썬에서도 패키지를 프로젝트 단위로 관리를 할 수 있도록 도와주는 고급 패키지 관리 도구이다.
기본적으로 pip를 기반으로 동작하지만, 프로젝트 별로 격리된 가상 환경(virtual environment)과 프로젝트 단위의 패키지 관리 매커니즘을 제공한다. 즉, pip와 virtualenv가 합쳐진 것이다.
- requirements.txt를 작성할 필요 없이 Pipfile에 패키지와 라이브러리가 자동으로 추가된다.
- 또한, pipenv는 Pipfile.lock이라는 패키지 잠금 파일을 사용해서 Pipfile 파일에 정확한 버전이 명시되어 있지않더라도 항상 동일한 버전의 패키지를 설치할 수 있도록 해준다.
관련 블로그
pipenv 명령어

# 맥 사용자 설치
brew install pipenv

# 윈도우 사용자 설치
pip install pipenv

# 가상환경에서 사용할 python 버전 설정 ex) 3.7 버전
pipenv --python 3.7

# 가상환경 활성화 / 비활성화
pipenv shell
exit

# 패키지 설치
pipenv install 패키지이름

# Git 저장소 clone 이후 Pipfile 파일과 Pipfile.lock 파일 확인하고 패키지 설치 하기
pipenv install

Homebrew란

Homebrew란, Mac용 패키지 관리 도구이다.
Homebrew를 사용하면, Java와 같은 것들을 설치할 때 홈페이지에 가지 않고도 한 줄로 설치 가능
- Homebrew로 설치하는 경우 항상 최신 버전이 설치된다. 편리하지만, 커뮤니티 기반으로 운영되기 때문에 패키지의 안정성이 보장되지 않는다.
관련 블로그

Jira란

개발 협업 툴로써, 칸반 형식으로 되어있고 외부에 빠져있지만 github과 연동이 된다.
- 연동 방법 블로그
시각적으로 개발자뿐만이 아니라, 다른 직무의 사람들과 함께 Assignee를 설정해줘서 이슈들을 관리할 수 있다.
또한, 이슈 티켓 번호로 git commit할 때 연동이 가능하다.

yaml 파일이란

yaml 파일이란, 야믈이라고 보통 읽고 yml 이라고도 한다.
xml, json과 같이 파일의 형식을 의미한다. 데이터 전송 파일의 종류이다.
- yaml 파일은 -(하이픈)을 통해서 Array임을 나타낼 수 있다. 따라서 가독성이 다른 형식보다 좋기 때문에 yaml 포맷을 많은 곳에서 사용하고 있다.
참고 글

포인터란

포인터는 우리가 컴퓨터의 메모리에 보다 직접적으로 접근해서 이를 제어할 수 있도록 해주는 도구이다. 기다란 집게 같은 것이라고 생각할 수 있다. 자바나 파이썬처럼 포인터가 없는 언어가 있고 C언어처럼 포인터가 있는 언어가 있다.

char language = ‘c’;

이렇게 변수에 입력된 값들은 메모리의 어딘가에 저장된다. 메모리라는 한정된 공간안에서 변수나 함수 등의 값들이 필요에 따라 올려놓아지고 다 쓰이면 치워지고 하면서 프로그램이 돌아가게 된다.
- 그런데 프로그램을 만들다 보면, 어느 변수에 지정한 값을 다른 여러 곳에서 써야 할 때가 있다.
- 메모리의 모든 칸에는 각각의 주소가 있다. 포인터는 이 주소값인 메모리 상의 변수 위치를 가리키는 역할을 한다.
C에서는 어느 함수에 변수가 인자로 주어질 때는, 그 값이 복사되어서 즉, 베껴 적어져서 넘어가게 된다. 즉 원본은 그대로 있게 된다. 복사가 된다는 건, 메모리 다른 어딘가의 그 크기만큼을 중복된 값이 차지한다는 이야기이다.
- 이렇게 메모리를 낭비하지않고 페이지 번호만 적어서 보내줄 수 있도록 하는 게 바로 포인터이다.
- ex) 예를 들어, language라는 문자열 변수가 정의되어 있는 상태에서 p0이란 포인터 변수로 하여금 language라는 변수의 위치를 가리키게 하는 코드 형식이 된다.

변수에 쓰이는 메모리는 어떤 자료형이냐에 따라 크기가 달라진다.
- 컴퓨터의 데이터는 수많은 0과 1, 즉 ON과 OFF로 이루어져 있는데, 메모리의 칸 하나하나가 1비트, 즉 ON 또는 OFF가 되어 2진수를 만든다.
- 정수는 1이든, 100이든, 천만 자리수이든 4바이트(8비트*4=32비트)를 차지한다.
- True/False를 나타내는 참/거짓 자료형은 이론적으로는 1비트인 칸 하나면 충분하다.
- 또한, 요일이라는 자료형이 있다고 가정하면 7가지의 값이 필요하고, 2의 3승이 8이니까 3칸(3비트)이면 충분하다.
포인트를 지정할 때, 자료형도 같이 표시하는 건 이러한 이유 때문이다.
- 예를 들어, 이 포인터가 가르키는 건 정수이니까 이 주소로부터 4바이트를 읽어내라고 하는 것이다.

포인터가 사용되는 경우
- 변수들은 프로그래머가 지정하는대로 메모리에 예측가능한 곳에 나란히 배열되지 않는다. 값들이 나란히 연속으로 배열되는 경우는 배열 자료형을 사용했을 때인데, 그래서 포인터는 배열과 함께 사용될 수 있다.
- 또한, 팀 프로젝트를 진행할 때도 사용될 수 있다.
  - 포인터로 주어진 변수들의 원본을 찾아서 수정을 해주면 다른 사람들도 확인할 수 있다.
  - 즉, 특정 변수가 객체의 값을 그대로 함수에 복사해주는 게 아니라 그 위치만 넘겨주는 Reference, 참조에 의한 호출이 이루어지게 된다.
관련 영상

책 요약 내용

개발자는 컴파일러에게 문서로 일을 시키는 사람, 프로그래밍 언어를 통해 운영체제 위에 돌아가는 프로그램을 만드는 사람이다. 프로그래밍 언어를 사용해 컴파일러에게 명령을 전달하면, 컴파일러가 코딩한 문서를 기계어인 0과 1로 변환해 컴퓨터에게 전달을 하게 된다.
IDE란, Integrated Development Environment의 약자로 통합 개발 환경이라고 하는 프로그램을 의미. 개발을 하기 위한 모든 것들을 제공해주는 환경이라고 보면 된다. 대표적으로 vs code가 있다.
프로그래밍 언어를 구분하는 기준 중 하나는 '저수준'과 '고수준'이 있다. '저수준'은 컴퓨터 친화적인 언어를 의미하고 / '고수준'은 인간 친화적인 언어를 의미한다.
- '저수준' 언어는 컴퓨터가 어떻게 일해야 하는지 구체적으로, 꼼꼼하게 적어줘야 하기 때문에 배우기 쉽지 않다. 대신 낮은 사양의 컴퓨터에서도 작동할 수 있다.
- '고수준' 언어는 학습하기 쉽다. 컴퓨터에게 꼼꼼하게 설명하지 않아도 된다. 하지만 그만큼 작동이 느리다.
컴퓨터의 구성은 CPU / 메모리(RAM) / HDD(하드디스크) 또는 SSD라고 불리는 보조기억장치로 구성되어 있다. 이 부품들을 메인보드에 설치하면 컴퓨터가 된다.
- CPU는 따로 데이터를 저장하지 않기 때문에 데이터를 연산하거나 처리하려면 저장된 데이터를 CPU로 보내줘야 한다. 그래서 CPU는 창고 역할을 하는 보조기억장치에 신호를 보낸다. 하지만 데이터가 많기 때문에 작업시간이 오래 걸리게 되고, 그래서 메모리가 생기게 되었다. 작업이 필요한 큰 데이터 뭉치를 보조기억장치에서 메모리로 한 번 옮겨놓고 CPU는 메모리 안에서만 작업을 진행하면 된다.
- ex) 포토샵 프로그램을 실행하는 경우를 예로 들면, 포토샵은 윈도우 기준으로 'C 드라이브 - Program files - Adobe - Photoshop'에 저장되어 있다. 보통 우리는 바탕화면에 있는 포토샵 아이콘인 포토샵 실행 파일의 바로가기를 더블클릭해서 실행하게 되는데, 이것은 보조기억장치에 저장된 프로그램을 실행하는 것과 같다. 그리고 바로 실행되는 게 아니라, 로딩 화면이 뜨고 시간이 걸리게 되는데 -> 이 과정이 보조기억장치에서 실행에 필요한 데이터가 메모리로 올라가고 있는 것이다. 이 과정이 끝나면 CPU가 메모리 위에서 빠르게 작업을 할 수 있기 때문에 우리가 포토샵에서 빠르게 작업할 수 있는 것이다.
위의 복잡한 과정을 모두 대신 진행해주는 소프트웨어가 바로 '운영체제(Operating System)' 이다. 대표적으로 윈도우, 맥 OS, iOS, 안드로이드가 있다. 윈도우와 맥 OS는 PC에서 / iOS와 안드로이드는 모바일에서 사용된다. 이러한 운영체제는 우리 대신 하드웨어를 관리해준다. 하드웨어의 용량을 확인하고 다양한 소프트웨어를 손쉽게 설치할 수 있게 해준다. 윈도우는 마이크로소프트 / 맥 OS와 iOS는 애플 / 안드로이드는 구글에서 만들었다. 이러한 회사에서 사용하는 운영체제 위에 돌아가는 프로그램을 만들기 위해서는 각자 다른 언어를 익혀야 한다. 애플은 Objective-C 또는 스위프트라는 언어를, 구글은 자바 또는 코틀린이라는 언어를 사용해야 한다.
LAN(Local Area Network): 컴퓨터가 연결된 작은 지역을 의미. 학교 컴퓨터실 하나, 아파트 하나, 커피숍 하나한가 모두 LAN이다. LAN을 연결하는 선을 LAN선이라고 부른다.
MAN(Metropolitan Area Network): 도시의 여러 LAN을 하나로 연결한 구성.
WAN(Wide Area Network): 도시와 도시, 나라와 나라를 모두 연결해서 구성.
카카오톡을 다운로드하는 과정
- 앱스토어에서 카카오톡을 검색하고 다운로드 버튼을 누르면 -> 가까운 기지국으로 카카오톡 설치 파일을 보내달라는 신호가 가게 된다. 신호는 WAN을 따라 이동한다. 앱스토어이기 때문에 애플이 가지고 있는 서버 컴퓨터에게 신호가 간다.
- 애플의 서버 컴퓨터에서 카카오톡 설치 파일을 우리의 스마트폰으로 다시 보내준다. 이후 우리가 스마트폰에서 앱을 터치해 실행하면 -> 보조기억장치에 카카오톡 실행 파일들이 저장되고, 실행에 필요한 데이터들이 메모리 위로 올라가게 된다. 그리고 CPU가 이 데이터들을 처리하면서 카카오톡을 우리가 사용할 수 있게 된다.
스마트폰으로 또는 컴퓨터로 파일을 달라고 요청하는 쪽, 컴퓨터를 '클라이언트' / 파일을 주는 카카오톡 컴퓨터를 '서버'라고 한다.
우리 컴퓨터의 IP 주소는 계속 달라진다.
- WiFi, 네트워크를 이용해서 인터넷에 접속하는 순간, 우리의 컴퓨터는 지금 위치에 맞는 IP 주소를 갖게 된다. IP 주소는 214.123.142.12와 같이 12자리 숫자가 마침표로 구분된 모습이다.
- IP 주소는 우리가 연결한 네트워크의 위치에 따라 달라진다. 즉, 집의 IP 주소와 카페의 IP 주소는 달라진다. 이동하면 IP 주소는 계속 바뀐다.
리눅스는 하나의 운영체제(OS)이고, 리눅스 위에서 '서버 프로그램'을 돌리게 된다. 리눅스는 기본적으로 무료이다. 그래서 다양한 버전의 리눅스가 발전되었는데, 그 버전 중 유명한 버전이 바로 '우분투(Ubuntu)' 이다. 또 다른 버전으로는 레드햇(Red hat) 리눅스가 있다. 레드햇은 리눅스를 개량해서 유료로 판매하는 회사이다. 수많은 회사의 운영체제 품질을 보장해주는 역할을 해준다.
윈도우나 맥 OS와 같은 운영체제는, 폴더나 휴지통과 같이 그래픽 UI가 있어 쉬운 방법으로 컴퓨터를 활용할 수 있지만 서버의 리눅스 운영체제는 이러한 그래픽 UI가 필요하지 않다. 그래서 대다수의 리눅스 버전들은 그래픽 UI 없이 명령어로만 동작을 시키게 된다.
개인이 서버를 운영한다면?
- 우리가 컴퓨터를 구매해서 집에서 쇼핑몰 서버를 만든다고 한다면, 일단 운영체제를 설치하고 서버 프로그램을 만들어서 실행시킨다. 이렇게 24시간 계속 돌리면 항상 운영되는 서버가 된다. 하지만 전기세가 많이 나갈 것이고, 갑자기 정전이 되어 전원이 꺼지면 서버가 정지된다. 그러면 고객들의 컴플레인이 발생할 것이다. 만약 서버 컴퓨터가 고장나서 저장장치도 복구할 수 없다면 회원 정보, 결제 정보, 배송 정보, 상품 정보 등 소중한 데이터들을 복구 할 수 없을 수도 있다.
- 그래서 이러한 일들을 대신해주는 서비스를 제공하는 업체가 생겨났는데, 바로 '호스팅 업체' 라고 한다. 대표적으로 Cafe 24, 가비아 등이 있다. 해외에는 대표적으로 아마존의 AWS가 있으며, 서버 컴퓨터를 대여해주고 다양한 분야의 기업들에게 솔루션을 제공하고 있다.
API란, 클라이언트, 서버와 같은 서로 다른 프로그램에서 요청과 응답을 주고 받을 수 있게 만든 체계이다. 즉, 소프트웨어가 다른 소프트웨어의 기능을 쓰기 위해 중간에 필요한 체계이다.
- API는 서버 개발자가 개발하고, 클라이언트 개발자는 이 API를 사용한다. 그래서 클라이언트 프로그램은 정해진 주소에 요청을 보내게 된다.
- ex) 비디오 파일 받을 때 요청 보내는 주소로 요청하면 -> 비디오 파일 보내주는 기능이 구현되어 응답해준다.
- API를 만들 때는 요청과 응답을 주고 받을 때, 데이터를 주고받는 기능도 함께 넣어준다.
  - 로그인 요청 시, 아이디와 비밀번호 데이터가 필요
RESTful API란, 사람들이 좀 더 체계적으로 API를 관리하고 싶어해서 탄생했다. 조금 더 체계적인 API라는 사회 운동이 만들어진 결과이다.
- Create : POST
- Read : GET
- Update : PUT(전체) / PATCH(일부)
- Delete : DELETE
- 이렇게 구분되는 메소드를 사용한다. 메소드는 '함수'와 같은 의미인데, 요청을 보내면 결과가 나오는 API의 모습이 함수와 같아서 메소드라는 용어를 사용하게 되었다.
- 함수에서는 필요한 x를 '변수', '파라미터' 라고 한다. ex) 로그인 요청에서 필요한 ID와 비밀번호를 '로그인 요청에 필요한 요청 변수' 혹은 '파라미터'라고 표현한다.
API는 HTTP 상태 코드로 응답 상태에 대한 내용을 코드로 나타낸다.
- 200번대 코드는 응답이 정상적인 경우
- 400번대 코드는 클라이언트 요청에 문제가 있는 경우
- 500번대 코드는 서버에 문제가 있는 경우
한 컴퓨터에 여러 소프트웨어가 있는데, 어떤 소프트웨어가 다른 소프트웨어의 특정 기능을 사용하기 위해서 요청할 수 있고 응답해줄 수 있다. 이렇게 API를 제공해주는 다른 소프트웨어를 SDK라고 부른다.
- SDK는 Software Development Kit의 약자로, 소프트웨어를 개발하기 위한 도구이다.
- ex) 내 소프트웨어에 구글 지도 SDK를 설치하면, 구글 지도 SDK에서 제공하는 API를 사용해서 자신의 소프트웨어에 구글 지도 기능을 넣을 수 있다.
JSON은 우리가 API로 요청과 응답 시 데이터를 주고받을 때 정해놓은 대표적인 데이터 형식이다. 즉, 클라이언트와 서버는 요청과 응답을 주고받고, 그 때 필요한 데이터들을 JSON 형식으로 주고받는다.
- JSON은 중괄호로 시작해서 Key와 Value로 이루어져 있다. 이 키와 값은 콜론(:)으로 구분한다.
- 여러 정보가 필요한 경우에는 대괄호를 이용해서 배열 형식을 JSON에서 사용한다.
IP 주소는 숫자로 이루어져 있다. 175.193.166.211과 같은 모습이다. 인터넷에 연결된 모든 컴퓨터는 다 이러한 숫자들을 가지고 있다.
- 하지만 우리가 해당 컴퓨터에 접속하려면 이러한 숫자들을 모두 암기해야 한다. 그래서 사람들은 숫자 대신 '도메인 네임' 이라는 것을 만들었다. www.naver.com과 같은 문자로 말이다. 그래서 도메인 네임을 입력하면 우리가 알지 못하는 사이에 IP로 바뀌어서 컴퓨터의 위치를 찾아준다. 즉, 도메인 네임은 IP 주소와 같다.
클라이언트 개발자와 서버 개발자가 협업하고 있는 회사라면, API 문서가 존재하게 된다.
- 네이버의 경우, 네이버 서버가 제공하는 다양한 기능을 누구나 사용할 수 있도록 공개되어있다. 이런 API를 Open API라고 한다.
애플리케이션이란, 설치해서 사용하는 모든 프로그램을 의미한다.
- 그런데 스마트폰이 퍼지기 시작한 이후부터는, 데스크톱에 설치하는 프로그램은 '응용 프로그램' / 스마트폰에 설치하는 프로그램은 '앱' 혹은 '어플', '애플리케이션'이라고 부르게 되었다.
보통 버전은 '1.0.0'과 같이 점을 기준으로 숫자가 3부분으로 나뉜다.
- 그리고 작은 변화가 있을 때마다 1.0.1 / 1.0.2와 같이 오른쪽 끝자리를 올려준다.
- 중간 숫자는 하위 버전과 호환이 가능하지만 큰 변화를 의미한다.
- 왼쪽 끝자리는 하위 버전과 호환이 가능하지 않은 큰 변화를 의미한다.
HTML은 프로그래밍 언어가 아니다. 컴퓨터에게 특정 일을 시킬 수 있는 언어가 아닌 단지 브라우저가 볼 수 있는 문서를 적는 언어이다.
HTML과 CSS를 합쳐서 '퍼블리싱' 작업이라고 표현하고 이 작업을 하는 사람들을 '퍼블리셔'라고 부른다. 또한, '마크업'이라는 말도 등장한다. 즉, HTML 작업을 마크업 작업이라고 부르고, HTML 작업을 주로 하는 사람들을 마크업 개발자라고 한다.
검색창에 a를 입력하는 순간, JavaScript가 '사용자가 a를 입력했다'는 것을 감지하게 된다.
- 그리고 그 a에 해당하는 실시간 검색어 목록을 조회하는 API 요청을 GET으로 네이버 서버로 보낸다. 그러면 네이버 서버는 a에 대한 실시간 검색어 목록을 정리해서 JSON 형식으로 응답해준다. JavaScript는 그 응답을 열어서 HTML로 바꾼다. 그리고 해당하는 부분에 끼워 넣어준다. 이러한 모든 동작은 프로그래밍 언어인 JavaScript만 할 수 있다.
웹페이지를 새로고침할 때, 제일 먼저 HTML 문서를 불러오고 CSS파일, 이미지 파일, JavaScript 파일, 폰트 파일 등 여러 파일들이 다운로드된다.
우리가 개발자도구로 웹페이지의 HTML 일부분을 삭제해봐도 전혀 문제가 없다.
- HTML, CSS, JavaScript의 완성본은 모두 서버에 있다. 우리가 GET 요청으로 서버에 있는 HTML 문서를 가져온 것이다. 그렇게 HTML을 불러온 다음 CSS, JavaScript, 이미지, 폰트, 동영상 등의 파일들을 다시 다운로드 한다.
- 즉, 우리의 컴퓨터에 있는 HTML, CSS, JavaScript는 모두 '사본'이다. 우리가 개발자도구로 일부분을 삭제한 건 서버에 있는 원본을 건드린 게 아니라 우리 컴퓨터에 다운로드된 HTML 사본의 일부분을 지운 것이다. 의미가 없다. 다시 새로고침하면 HTML 원본부터 CSS, JavaScript를 다시 다운로드 받게 되는 것이다.
웹과 애플리케이션의 차이
- 애플리케이션은 버전 1.0.0에서 2.0.0으로 변경하기 위해서 업데이트가 필요하다. 모바일이라면 심사도 필요하다. 그리고 그렇게 업데이트된 결과를 유저가 다운로드 해야 한다. 그래야 변화가 반영된다.
- 하지만 웹은 다르다. 그냥 서버의 원본을 바꾸기만 하면 된다. 그러면 '새로고침'할 때, 바뀐 HTML, CSS, JavaScript, 이미지 등등의 파일이 다시 다운로드된다. 심사과정도 없고 유저가 업데이트해야 하는 것도 없다. 새로 고침하면 자동으로 반영된다.
웹과 애플리케이션의 장단점
- 웹은 수정이 용이하다. 원본만 수정하면 유저가 업데이트하지 않아도 새로 고침하면 반영된다. 하지만 웹은 항상 새로 고침을 해야 한다. 즉, 매번 HTML, CSS, JavaScript를 다운로드 받아야 한다. 네트워크가 빠른 환경이면 괜찮겠지만 아닐수도 있다. 웹은 이 네트워크의 영향을 크게 받는다.
- 애플리케이션은 그렇지 않고 오래 걸린다. 하지만, 애플리케이션은 웹보다 효율적으로 네트워크의 영향을 조금만 받도록 만들 수 있다. 카카오톡의 경우, 우리의 대화 내역을 스마트폰에 저장한다. 그래서 대화방을 나가면 저장된 대화를 없애 용량을 확보해서 속도 이슈를 해결한다. 또한, 에버노트 앱은 인터넷에 상관없이 서비스를 사용할 수 있게 만들었다.
브라우저도 다운로드해서 사용해야하는 '애플리케이션'이다. 따라서 사용하는 사람들에 따라서 사용하는 버전이 다를 수 있다.
- 클라이언트, 웹 프론트엔드, 퍼블리싱 작업을 하는 사람들이 힘들어하는 주된 이유 중 하나가 바로 브라우저의 버전이 사람들마다 다르다는 이유이다.
운영 체제에 브라우저를 내장시킬 수 있다.
- 운영 체제에 브라우저를 내장시켜서 출시하면, 사람들이 이미 깔려있는 브라우저를 많이 쓰지 않을까 라는 생각을 마이크로소프트와 애플은 하게 되었다.
- 그래서 윈도우를 설치하면 인터넷 익스플로러가 자동으로 설치되어 있고 / 맥 OS와 iOS에도 자동으로 사파리가 설치되어있다. 크롬을 사용하려면 직접 다운로드를 해야 한다.
네이티브 애플리케이션이란
- iOS 프로그램을 스위프트나 Objective-C 언어로 개발하거나 / 안드로이드 프로그램을 자바나 코틀린으로 개발하는 경우, 원래 정해놓은 언어들을 사용해 운영체제 자체의 기능을 사용하기 때문에 원주민 이라는 뜻을 가진 네이티브가 붙게 된다.
운영체제 안에 브라우저가 내장될 수 있기 때문에 => 애플리케이션의 특정 부분에 '브라우저'를 올리는 방식으로 개발이 가능해졌다.
- 그 브라우저는 HTML과 HTML에 연결된 파일들을 불러와서 보여준다.
- 이렇게 네이티브와 브라우저가 혼합된, 웹과 애플리케이션이 혼합된 애플리케이션을 '하이브리드 애플리케이션'이라고 한다.
- 이러한 모바일 애플리케이션을 수정하려면 어떻게 해야할까. 브라우저 위에서 돌아가는 부분은 서버에 있는 원본 HTML, CSS, JavaScript를 수정하면 된다. 그러면 앱 화면이 뜰 때 바뀔 것이다. 반면 네이티브인 부분은 운영 체제별로 다른 프로그래밍 언어를 통해 수정한 뒤 심사를 신청해야 한다. 신청한 뒤에도 사람들이 바뀐 걸로 업데이트를 해줘야 한다.
애플리케이션에 브라우저를 올리는 것과 네이트브로 개발하는 것에 장단점
- 브라우저를 통해 HTML, CSS, JavaScript를 가져와서 보여주는 방식의 장점은 수정하기 좋다는 점이다. 서버의 파일들만 수정하면 따로 심사받거나 설치할 필요 없이 앱이 새로 고침될 때 반영된다. 하지만, 네트워크에 종속되기 때문에 와이파이나 모바일 네트워크가 느린 공간에 가면 HTML, CSS, JavaScript를 모두 다운로드하는 동안 사용자들은 기다려야 한다.
- 반면, 네이티브로 만들면 수정하는데 오래 걸린다. 심사도 있고 사용자들이 업데이트를 해줘야 한다. 하지만 네트워크를 최소한으로 이용하도록 코딩한다면 인터넷이 느린 환경에서도 빠르게 동작할 수 있다.
애플리케이션에서 어떤 부분이 웹이고 / 어떤 부분이 네이티브 애플리케이션인지 구분하는 건 어렵다.
- 그렇지만 힌트는 있다. 스마트폰에서 어떤 버튼을 누를 때 천천히 떼보면, 회색 박스가 보이는 경우가 있다. 이건 HTML의 링크에 대해 브라우저가 보여주는 애니메이션이기 떄문에 이 부분이 웹이라고 추측할 수 있다.
- 또한, 다른 페이지로 넘어갈 때 모든 부분이 새로고침 된다면 웹으로 만들어졌다고 볼 수 있다.
- 그리고 API 문서로 확인할 수 있다. API 문서에는 웹 개발자를 위한 부분과 애플리케이션 개발자를 위한 부분이 구분되어 있다.
엑셀의 Sheet를 관계형 데이터베이스에서는 테이블이라고 표현한다. 이러한 테이블끼리 관계가 있기 떄문에 관계형 데이터베이스이다. 그리고 엑셀 파일 자체를 스키마 혹은 데이터베이스라고 표현한다.
관계형 데이터베이스의 철학으로 만들어진 관리 시스템(소프트웨어)을 관계형 데이터베이스 관리 시스템, 즉 RDBMS라고 부른다.
- MS SQL, Oracle DB, MySQL, Maria DB 등 다양하다.
데이터는 CPU, 메모리, 보조기억장치와 같은 하드웨어 중 당연히 보조기억장치에 저장된다. 그리고 DBMS는 소프트웨어이니까 컴퓨터에 CPU와 메모리가 있다면 실행시킬 수 있다.
클라이언트와 서버는 둘다 컴퓨터이기 떄문에, 모두 CPU / 메모리 / 보조기억장치를 가지고 있다. 즉, 클라이언트와 서버 컴퓨터 위에는 모두 데이터베이스 관리 시스템을 돌릴 수 있고 데이터를 저장할 수 있다. 그래서 데이터는 클라이언트에도 저장할 수 있다.
- 서버에서만 데이터베이스를 사용하는 것처럼 생각할 수 있지만, 실제로는 그렇지 않다. 개발의 이슈에 따라서 클라이언트의 데이터베이스도 많이 활용한다.
- ex) 아이폰의 알람 애플리케이션과 앱스토어가 있다고 생각해보자.
  - 알람 애플리케이션에 있는 시간들은 데이터이다. 관리하기가 힘들기 때문에 DB에서 관리하게 된다. 이 데이터들은 바로 "클라이언트"에 있는 데이터이다. 어떻게 알 수 있냐면, 이 알람 애플리케이션은 인터넷이 연결되어 있지 않은 상태에서도 동작하기 때문이다. 스마트폰 자체를 "클라이언트 컴퓨터"라고 생각해보면 된다. 즉, 서버와 통신하지 않고도 정상적으로 작동한다. 알람 애플리케이션은 서버가 필요하지 않기 떄문에 그 데이터들 또한 클라이언트에 있을 것이다. 스마트폰 자체 컴퓨터에 저장되어있는 데이터라는 의미이다.
  - 앱스토어에 들어가봐도 다양한 데이터가 있다. 메인 화면에 "Adobe Premiere Rush CC"라는 텍스트가 있을 떄, 이러한 데이터는 서버에 있는 데이터라고 볼 수 있다. 그 이유는 이 데이터는 어떤 스마트폰에서 접속해도 똑같이 보이기 때문이다. 데이터가 서버에 있기 때문에 데이터를 변경한다면, 다른 모든 기기에 변경된 데이터가 표시될 것이다.
서비스의 어떤 데이터들을 서버에서 불러오는지, 어떤 데이터들이 클라이언트에 있는지 구분하는 것이 중요하다. 그래야 정확한 사람에게 정확한 요청을 할 수 있다. 거의 모든 답을 알 수 잇는 것은 바로 API 문서를 보는 것이다.
- 데이터가 클라이언트에 있는 상황에서는 그 데이터를 변경하고자 하면 클라이언트 개발자와 이야기를 해야 한다. 반면, 데이터가 서버에 있는 상황에서 그 데이터를 변경하고자 한다면 당연히 서버 개발자와 이야기해야 한다.
- '데이터가 로컬에 있다', '내부 DB에 저장하고 있다', '네이티브에서 가져왔다', '이 아이콘은 클라에 있다' 라고 한다면, 모두 클라이언트에 데이터가 있다는 표현이다.
- 반면에 'API로 가져왔다', 'DB에 저장해두고 쓴다' 라고 한다면, 서버에 데이터를 가져온다는 의미이다.
용량이 큰 이미지의 경우, 클라이언트에 저장하는 경우가 많다.
- 이미지의 크기가 큰 경우, 서버에 이미지 데이터를 저장하면 새로고침 할 때마다 크기가 큰 이미지들을 다운로드 해야 한다. 그러면 속도가 굉장히 느려질 것이다. 그래서 클라이언트에 이미지를 저장하면 이미지를 다운로드받지 않아도 된다. 그냥 클라리언트 프로그램이 이미지 주소를 통해 이미지를 가져오게되고 네트워크보다 훨씬 빠르다.
- 클라이언트의 이미지를 바꾸기 위해서는 애플리케이션을 업데이트 해야 한다. 예를 들어 가격 정책을 이미지로 만들어서 클라이언트에 놓았고 버전이 2.0.0으로 올라가서 이미지를 바꿨다. 그러면 버전이 여전히 1.0.0인 사람들은 가격이 다르다고 항의할 수 있다.
- 그래서 상황에 따라서 둘 다 사용해야 한다. 이미지를 예를 들었을 때, 최대한 네트워크에 부담이 가지 않도록 많은 이미지들을 클라이언트에 놓아야 하지만 / 이미지가 바뀌었을 때 서비스에 영향을 준다면 서버에서 가져오는 게 맞다. 즉, 클라이언트에 놓느냐 / 서버에 놓느냐를 결정하기 위해서는 이미지의 성격을 봐야 한다.
유저가 업로드하는 이미지들은 관리가 필요하기 때문에 서버 DB에 이미지 주소를 저장하게 된다.
프레임워크는 각종 라이브러리와 코드들이 모여 하나의 프레임워크를 만들게 된다. 한 프로젝트에서는 하나의 프레임워크만 사용하게 된다.
- 반면, 라이브러리는 더 작은 개념이다. 망치나 가위 같은 도구들이기 때문에 한 프로젝트에서 함께 사용이 가능하다.
동시에 2가지 이상의 다른 종류의 개발을 진행해야 할 때, git에서는 Branch(브랜치)를 사용하게 된다. 이후 각각의 브랜치에서 작업한 코드들을 합치기만 하면 되고 이 코드를 합치는 기능을 Merge(머지)라고 한다.
- Git은 작업된 부분이 겹치지 않으면 자연스럽게 합쳐준다. 만약 겹치는 부분이 있다면 Git은 충돌(Conflict)을 알려주고 어떤 부분이 충돌됐는지 보여준다. 개발자는 그 부분만 다시 수정하면 된다.
- 물론 Merge가 성공했다고 해서 모두 성공한 코드는 아니다. 반드시 큰 브랜치들이 합쳐진다면 테스트가 필요하다.
개발자들은 Git을 기반으로 한 Github나 비트버킷과 같은 '원격 저장소' 라는 걸 만들었다. 그래서, 개발자들이 자신의 컴퓨터(로컬)에서 작업을 한 뒤, Commit을 하면 그 결과를 원격 저장소에 보낼 수 있고, 원격 저장소에서 이미 작업된 결과물을 가져올 수 있다.
컴퓨터는 CPU / 메모리 / 보조기억장치와 같은 하드웨어를 가지고 있는데, 이러한 것들을 제어해주는 것이 바로 '운영체제'이다. 대표적으로 윈도우, Mac OS, iOS, 안드로이드가 있다.
- 이러한 운영체제 위에 올라가는 프로그램을 개발하는 사람들을 클라이언트 개발자라고 한다.
서버 사이드에는 서버 컴퓨터가 있다. 클라이언트와 마찬가지로 CPU / 메모리 / 보조기억장치를 가지고 있다. 여기서도 운영체제가 필요한데, 주로 서버에서는 리눅스를 사용한다.
- 이 서버 프로그램을 만들어서 서버 컴퓨터에 돌리는 사람이 바로 서버 개발자이다.
이렇게 클라이언트와 서버가 만들어지면 이 둘은 API를 통해 요청과 응답을 주고받는다.
- 기능을 제공하는 쪽은 서버이다. 클라이언트는 이 기능을 사용한다.
실제 서비스를 개발하여 출시하는 상황을 생각해보자. 웹 그리고 iOS와 안드로이드 기반의 애플리케이션을 통해 데스크롭(PC)과 모바일로 서비스를 제공하는 회사가 있다.
- 이 경우 적어도 4명의 개발자가 필요하다. 웹 클라이언트 개발자, iOS 개발자, 안드로이드 개발자, 서버 개발자이다.
- 클라이언트 개발자는 => 실제 유저가 사용하는 서비스를 만들기 위해 화면을 구현하고 API 요청을 보내야 한다. 웹 페이지를 만들어야 하니까 HTML을 이용해서 뼈대를 잡고 CSS를 통해 디자인을 입힌다. 그리고 JavaScript를 통해 기능을 붙인다. 이는 관리자 페이지도 마찬가지이다. 관리자 또한 서버의 기능을 사용한다는 점에서 클라이언트이다.
- 애플리케이션 개발자는 => iOS, 안드로이드 위에 올라가는 프로그램을 각각 개발한다.
- 서버 개발자는 => 각 요청에 맞는 기능을 만든다. 각 기능들은 대부분 데이터베이스(DB)를 거쳐야 한다. 회원가입 처리를 하려면 DB에 회원 정보를 만들어야 하고, 로그인 처리를 하려면 DB에 해당 ID가 있는지 PW는 맞는지 확인해야 한다. 서버 개발자는 해당 기능을 만든 뒤, 각 기능에 맞춰 API를 만들고 API 문서를 작성한다. 그럼 클라이언트 개발자는 API 문서를 보며 특정 주소로 요청을 보내고 응답을 받는다. 이 과정에서 클라이언트 개발자와 서버 개발자가 활발한 소통을 하게 된다.
- 이제 개발이 끝난 결과를 생각해보자.
  - 웹은 완성 결과물을 서버에 올려둔다. 아마존 AWS에서 서버 컴퓨터를 빌려서 원본 HTML, CSS, JavaScript를 있게끔 해준다. 웹 클라이언트 개발자는 완성한 작업물을 그곳에 배포한다. 일반 유저는 특정 도메인을 쳐서 서버에 요청을 보낸다. 그러면 HTML부터 다운로드 되고 CSS, JavaScript, 이미지, 동영상 등 파일이 일반 유저의 브라우저로 다운로드된다. 일반 유저의 컴퓨터에 다운로드된 파일의 사본은 필요할 경우 서버로 API 요청을 보내고 응답을 받는다. 이게 웹이 동작하는 방식이다.
  - 애플리케이션의 경우, iOS 개발자는 프로그램을 완성하면 앱스토어에 심사 신청을 한다. 심사에 통과하면 앱스토어에서 검색할 수 있고 사람들이 자신의 스마트폰에 해당 앱을 다운로드 한다. 다운로드가 완료되어 설치된 애플리케이션은 필요한 경우 데이터베이스가 있는 서버에 API 요청을 하게 된다.
  - 안드로이드도 마찬가지이다. 구글 플레이 스토어에 심사를 신청해야 하고 이후 과정은 비슷하다.
  - 마지막으로 관리자 페이지도 생각해보자. AWS에서 컴퓨터 서버를 하나 더 빌렸다고 하자. 관리자 로그인을 통해 들어갈 수 있도록 해야 한다. 즉, 로그인 요청을 보내고 응답을 받아야 하는데 그 때 API가 만들어진 서버로 요청을 보내고 응답을 받는다.
키오스크에서도 안드로이드 혹은 윈도우 운영체제가 올라간다. 그리고 그 위에 프로그램이 돌아간다. 그 프로그램은 서버에 API 요청을 보내고 받는다.

Files

ETC.md

Latest commit

History