input text에서 한글 또는 영어로 디폴트 설정하고 싶을때가 있습니다.

input text창에 스타일 태그만 추가해주면 됩니다.

// 한글/영문
<input type='text' style="ime-mode:auto;">   

// 영문만
<input type='text' style="ime-mode:disabled;">

// 한글 (한글 / 영문 입력가능)
<input type='text' style="ime-mode:active;">

// 영문(한글 / 영문 입력가능)
<input type='text' style="ime-mode:inactive;">

사용자가 input text에 값을 입력할 때 숫자가 한자리인 경우 0을 자동으로 넣어주는 함수를 공유하고자 합니다.

해당 함수를 사용하는 예로는 월을 입력할 때 1~9월인 경우 숫자 앞에 0을 붙일 수 있고(01월, 02월.. 등), 시간이나 분을 입력할 경우(01시, 02시... 등)에도 함수를 사용할 수 있습니다. 

예제를 통해 바로 알아보겠습니다.

zeroFill함수에서 this는 값을 위함이고, 2는 자릿수 입니다.

예를 들어 01, 02의 값이 아닌 001, 002을 채우고자 한다면 3으로 변경해서 사용해주시면 될 것 같습니다.

<input type="text" id="test" maxlength="2" onblur="zeroFill(this, 2);" />

<script>

//숫자가 한자리인 경우 0 붙이기
function zeroFill(target, width) {
  var n = target.value;
  var id = target.id;
  n = n + "";
  if(n.length >= width){
   document.getElementById(id).value = n;
  }else{
   document.getElementById(id).value = new Array(width - n.length + 1).join('0') + n;
  }
}

</script>

테스트 한번 해보세요.

1) 숫자 2자리

2) 숫자 3자리

8. 다운로드 방법 (wget, git)

8.1 리눅스에서 명령어 기반에서 파일 로드 방법

GUI방식은 클릭을 여러 번 하면 쉽게 다운 받을 수 있습니다.

명렁어 시스템에서도 다운 받을 수 있는데요. 이때 프로그램이 필요합니다. 사용할 프로그램은 wget입니다.

 · wget [링크 주소 복사] 

wget http://animal-park.tistory.com/attachment/cfile2.uf@2675D233597721AF11FA10.jsp

아래 사진과 같이 파일이 다운 중인 것을 확인할 수 있습니다.

 · ls -l : 파일이 잘 다운 되었음을 확인할 수 있습니다.

하지만 cfile2.uf@2675D233597721AF11FA10.jsp로 파일명이 조금 지저분 하네요.

파일명을 변경할 수 있습니다. 

 · wget -0 [저장하고자 하는 파일 명=다른 이름으로 저장 개념] [링크 주소 복사]

아래의 사진과 같이 ajaxUpload.jsp라는 파일로 알기 쉽게 저장하였습니다.

8.2 git

git프로그램 사용법에 대해 알아보겠습니다.

git은 버전 관리 시스템이라는 카테고리에 속하는 구체적인 제품 중 하나입니다.

대표적인 예가 바로 git이며, 개발하는 분들은 무조건 필수로 알아야 합니다!!

git은 프로그램의 개선 사항들을 기록하여 과거의 상태를 분석하거나, 과거 상태를 현재의 상태의 돌리거나,

개발자들이 만든 소스를 백업하거나, 개발자들끼리 협업하여 프로젝트를 만들 대 쓰입니다.

git은 기본적으로 리눅스에서만 사용한 것이 아닌 운영체제에 독립적인 프로그램입니다.

git hub는 소스 코드를 온라인 상에 업로드 시켜 협업이 가능하도록 한 홈페이지 입니다.

전 세계 수많은 오픈 소스의 아지트 입니다. 공공재와 같은 중요한 서비스이기도 합니다.

git hub에 있는 소스코드를 git을 이용해서 다운 받아 보겠습니다.

 · sudo apt-get install git  : 먼저 깃을 다운 받습니다.

 · git clone [복사하려는 프로젝트 주소] [디렉토리 주소]

git clone https://github.com/facebook/react.git react_src react_src : react_src라는 디렉토리에 프로젝트 주소가 가리키는 오픈소스 프로젝트가 다운됩니다.

9. 왜 CLI인가?

9.1 GUI(Graphical User Interface) VS CLI(Command Line Interface)

왜 생소하고 배우기 어려운 명령어를 사용하는 것일까요?? (저도 궁금했습니다....)

명령어로 컴퓨터를 제어하는 이유는 

GUI 컴퓨터는 아무래도 동작을 취하기 위한 에너지 소모가 많습니다.

CLI 컴퓨터는 GUI컴퓨터에 비해 에너지를 덜 소모하죠.

또 다른 이유는 서버 컴퓨터나 데이터를 분석하는 시스템은 일반 컴퓨터와는 별개이기에 그래피컬한 컴퓨터가 필요가 없습니다. 메모리나 CPU용량을 덜 차지하는 것이죠.

예를 통해 설명해보겠습니다.

GUI방식은 쉽지만 많은 노동이 필요합니다. 눈에 보이지 않지만 주어진 프로그램을 실행시킬 때 행동을 하고 기다리고 다음의 일을 하고 기다리는 식의 작업을 반복합니다. 배우기는 쉽지만 순차적으로 진행되는 일을 자동화하는 것이 힘듭니다.

반면에 CLI의 경우 제가 영수라는 친구에게 "영수야 집에서 설거지 한 다음에 이불 정리하고 그 다음에 보일러는 낮춘 다음에 집에 나갈 때 나한테 전화해 "라는 명령을 합니다. 영수는 작업을 끝난 뒤 전화를 하겠죠. 저는 일에 상관없이 전화만 받으면 됩니다. 즉 여러 작업들을 진행 시키고 기다림 없이 자동화가 가능합니다.

9.2 순차적으로 실행

GUI방식의 예를 적용시켜보겠습니다.

 · mkdir why : why라는 디렉토리를 생성합니다.

 · cd why : why라는 디렉토리로 이동합니다.

CLI방식의 예를 적용시켜보겠습니다.

 · mkdir why; cd why : 명령어 하나에 두 번의 작업을 입력하여 why라는 디렉토리에 접속하였습니다.

위의 작업은 단순하지만 2번의 작업이 한 번에 된다는 것은 2,3,4... 등 무한대의 작업을 진행할 수 있다는 것이죠.

이것이 바로 CLI를 사용했을 때 강력한 효과입니다. (놀라웠습니다...)

단수와 복수의 차이인 것이죠. 명령어를 통해 얻을 수 있는 효과는 명령을 실행하였을 때 프로그램이 끝난 것을 확인하고 다음 것을 하는 것이 아닌 순차적으로 명령어를 입력하면 컴퓨터는 순서대로 명령을 실행할 것이고 결과만 통보할 것입니다. 중간 과정을 지켜볼 필요가 없는 셈이죠. 만약 mkdir 명령어가 언제 끝날지 모를 명령어였다면, 명령을 하나하나 실행하는 것보다 세미 콜론(;)으로 구분하여 끝난 결과만 확인할 수 있습니다. 

9.3 파이프 라인

파이프 라인이란? 

하나의 명령의 실행 결과를 다른 명령의 입력으로 주고,

하나의 프로그램의 결과를 다른 프로그램의 입력으로 주고, 

하나의 프로세스의 출력(결과)를 다른 프로세스의 입력으로 만드는 것입니다.

 · nano linux.txt : 나노 프로그램 편집기를 통해 많은 내용 저장합니다.

 · cat linux.txt : linux.txt파일의 내용을 화면에 출력해줍니다.

 · grep linux linux.txt : "linux"라는 텍스트가 포함되어 있는 행만을 표시해 줍니다. 원하는 정보를 알려주죠.

 · ls --help의 결과 중 sort라는 텍스트가 포함되어 있는 행을 찾아보겠습니다. (grep명령어를 사용하면 되겠죠)

 · ls --help | grep sort 

 · ls --help | grep sort | grep file : "sort"라는  텍스트를 포함하면서 동시에 "file"텍스트를 포함하는 것입니다.

 · ps aux : 현재 실행중인 프로그램을 출력하는 명령어입니다.

 · ps aux | grep apache : apache라는 텍스트가 포함되어 있는 프로그램만 출력됩니다.

10. IO Redirection

10.1 Output

Input(입력), Ouput(출력), Redireaction(방향을 바꾸는 것)

 · ls -l >result.txt : 이를 Redireaction이라고 합니다.  부등호 옆에 1이 생략되어 있습니다.

ls -l 파일 목록을 출력하는 명령어 인데 이를 result.txt라는 파일에 방향을 바꾸어 저장을 하게 됩니다.

 · cat [파일명] : 파일에 있는 데이터를 읽어주는 명령어 입니다.

cat result.txt : 파일 목록이 result.txt에 저장되어 있네요.

10.2 Input

프로그램은 ssd, hdd에 저장되어 있는 것입니다.

프로세스는 프로그램이 실행되고 있는 상태이죠. 

하나의 프로그램은 여러 개의 프로세스를 가질 수 있습니다. 하나의 입력과 두 개의 출력이 존재할 수 있습니다?

 · cat hello.html : hello.html의 파일을 읽어줍니다. [파일명] = Command Line arguments(명령 인자)

 · cat을 누르면 끝나지 않고 계속 대기를 합니다.

hi, linux를 입력하면 hi와 linux를 출력하죠 ctrl+d를 통해 빠져나옵니다.

hi, linux와 같이 사용자가 키보드를 통해 입력하는 정보를 Standard Input(표준 입력)이라 합니다.

 · cat < hello.html : hello.html의 내용을 cat의 입력값으로 받습니다.

 · head -n1 linux.txt : linux.txt파일의 한 줄만 출력하는 명령어입니다.

 · head -n1 < linux.txt : 표준 입력의 예로 결과는 위와 동일합니다.

 · head -n1 < linux.txt > one.txt : one.txt파일에 linux.txt파일의 한 줄 내용을 저장합니다.

10.3 안 중요한 이야기들

 · ls -al >> result.txt : ls -al > result.txt는 ls-al의 출력 결과를 result.txt 저장하는 것입니다. 부등호가 두 개이면 redirection 결과를 추가하는 것입니다. ls -al의 결과를 한 번 더 저장하는 셈이죠.

두 개이면 여러 개의 입력을 하나로 합치는 것입니다.

생활코딩 리눅스 강의