이전 포스트 완성 코드 Log In const loginInput = document.querySelector("#login-form input"); const loginButton = document.querySelector("#login-form button"); function onLoginBtnClick() { console.log("hello", loginInput.value); } loginButton.addEventListener("click", onLoginBtnClick); 자 이제 username의 유효성을 검사해보자 input의 입력될 username은 비어있어서는 안되고, 너무 긴 텍스트여도 안되는 것으로 설정을 하자. 우선, 매번 loginInput.value를 적는 것 대신에 우..

로그인 기능 구현을 위해선 우리가 맨 첫번째로 구상하고 구현해야하는 기능은 무엇일까? 아마도 최우선순위에 있는 첫 기능은 [사용자에게 "what is your name(or ID)?" 라고 질문을 던지는 것] 일 것이다. 그리고 이러한 질문에 대한 사용자의 응답을 우리 개발자는 Input을 해야할 것이다. 그 후 Input받은 Data를 우리는 화면에 표시까지 할 줄 알아야 할 것이다. 그렇다면 이러한 기능을 구현하기 위한 간단한 목차 HTML부터 시작한다 HTML을 작성한 다음, JS에 element들을 끌고 온다 JS에서 작업 1. HTML 코드 작성 input 태그를 작성한다. type은 "tect"로, placeholder도 설정한다. Log In 위 button 태그도 작성한다. Log In 지..

Goal : 로그인 기능 구현을 바닐라 자바스크립트로 구현해보자 목차 Input Values Form Submission Events Getting Username Saving Username Loading Username Recap

echo hello world! > a.txt echo라는 명령어를 이용해서 간단하게 자신이 설정한 디렉토리 안에 새로운 a라는 파일을 만들어보자. 'hello world!'라는 문자열을 위의 형식을 이용해 a.txt파일에 저장을 할 수 있다. 위와 같은 방식으로 b.txt, c.txt 파일까지 만들고 난 후 ls를 입력하여 현재 디렉토리 안이 어떠한 상태인지 확인해보자. a.txt b.txt c.txt 가 있는 것을 확인할 수 있다. git status 명령어를 입력해보자. 지금 현재 파일의 대략적인 정보와 상태들을 확인해 볼 수 이싿. master branch 위에서 작업을 하고 있고 아직 commit은 없고 Untracked 된 파일 세 가지가 있다라고 친절하게 설명이 되어져 있을 것이다. 또한 아..

git workflow Git에는 크게 총 3가지의 작업환경이 나눠져 있다. 첫 번째는 우리가 프로젝트의 파일들을 수정하고 작업하고 있는 working directory가 있고 어느정도 작업하다가 버전 히스토리에 저장할 준비가 되어있는 파일들을 옮겨놓는 staging area와 그리고 버전의 히스토리를 가지고 있는 git repository 또는 git directory로 나눠져 있다. 예를 들어서 프로젝트 폴더에서 파일들을 수정하고 있다가 b와 c 파일은 이제 어느정도 준비가 되었는데 라고 결심을 하게 되면 staging area로 b와 c 파일을 옮겨두게 된다. 그리고 commit 이라는 명령어를 이용해서 staging area에 있느 ㄴ파일들을 Git 버전 히스토리에 저장하게 된다. 그리고 계속 a..

Git은 명령어 단위로 이루어진 간단한 프로그램이다. 터미널에서 Git을 이용하는 연습을 해보도록 하자. Git에 관한 Command들은 모두 git 다음에 명령어 형식으로 이루어져 있다. 예를 들어 git config 라면, configuration에 관련된 명령어를 수행할 수 있고 git commit 혹은 git add 이런 식으로 'git' 다음에 '명령어'의 형식으로 이루어져 있다. 또한 보통은 'git 명령어' 다음에 옵션들이 여러가지가 있어서 같은 명령어를 수행하더라도 어떤 옵션을 붙이냐에 따라서 조금씩 다른 방식으로 진행할 수 있다. git add -option 따라서 어떤 일을 수행할지에 따라서 git 다음에 add, status, diff 이런 명령어들을 붙이면 되고, 또 각각의 명령어에..

1.3 자바 함수 프로그래밍 언어에서 함수라는 용어는 메서드 특히 정적 메서드와 같은 의미로 사용된다. 자바의 함수는 이에 더해 수학적인 함수처럼 사용되며 부작용을 일으키지 않는 함수를 의미한다. 곧 살펴보겠지만 다행히 자바 8에서 함수 사용법은 일반적인 프로그래밍 언어의 함수 사용법과 아주 비슷하다. 자바 8에서는 함수를 새로운 값의 형식으로 추가했다. 이는 1.4절에서 설명할 멀티코어에서 병렬 프로그래밍을 활용할 수 있는 스트림과 연계될 수 있도록 함수를 만들었기 때문이다. 객체 참조는 클래스의 인스턴스를 가리킨다. 프로그래밍 언어의 핵심은 값을 바꾸는 것이다. 역사적으로 그리고 전통적으로 프로그래밍 언어에서는 이 값은 퍼스트클래스값이라고 부른다. 바라 프로그래밍 언어의 다양한 구초제(메서드, 클래스..