자바스크립트의 기본기를 제대로 잡아보고자 '모던 자바스크립트 Deep Dive'라는 책을 읽어보려고 한다.  예전에 Next.js로 만들어놓은 블로그에 작성하려고 했지만, 해당 블로그는 나중에 대대적인 리팩토링이 필요할 예정이라 어디에 글을 써야 할지 고민이 많았다. 일단 다음의 조건이 필요한데,1. 이후에 Next.js로 만든 블로그와 연동할 수 있어야 함 (GitHub의 README 파일로 정리해야 함)2. GitHub에서 보는 것은 다소 불편하니, 블로그처럼 사이트에서 쉽게 볼 수 있었으면 좋겠음 따라서 GitHub에 새로운 레포지토리를 생성하고 GitBook과 연동하기로 결정했다..  그리고 단순히 책의 내용이나 개념을 공유하는 것은 어디서나 쉽게 찾아볼 수 있는 정보이기 때문에 의미가 없다고 느..

에러 메시지 next : The term 'next' is not recognized as the name of a cmdlet, function, script file, or operable pro gram. Check the spelling of the name, or if a path was included, verify that the path is correct and try again. -> next가 없다는 의미 이므로 설치해주면 됨 해결 방법 npm install next -g

Hidden Field란? 화면의 폼에는 보이지 않지만(사용자는 볼 수 없음), 사용자가 입력을 마치면 폼과 함께 서버로 전송되는 요소 (예제) 히든 필드를 사용해 사용자가 사이트에서 로그인하는 정보를 서버로 넘겨줌 아이디: 비밀번호: 실행하면 아래와 같이, hidden filed의 내용은 보이지 않는다. HTML 삽입 미리보기할 수 없는 소스 하지만,, 위의 예제로는 도대체 hidden field를 왜 사용하는지 이해가 되지 않아서 찾아봤는데,, 위의 예제는 hidden field의 내용은 실제로 사용자의 눈에 보이지 않는다는걸 알려주기 위해 나온듯 하고 Hidden field에 대해 좀 더 정확히?자세히 말하면 사용자가 입력할 필요가 없는 정보/ 사용자가 몰라도 되는 정보,,이지만 폼 전송과 같이 전..

Object vs Array //Array var members = ['kbs','k0214','1999k']; console.log(members[1]); //How to get information //Object var roles = { 'programmer' : 'kbs', 'designer' : 'k0214', 'manager' : '1999k' } console.log(roles.designer); How to get information Array : 각각의 정보를 순서에 따라 정리 (각각의 정보는 고유한 식별자가 존재) Object : 순서가 없는 정보 저장 (식별자가 숫자가 아닌 이름으로 존재) 순서 식별자 literal Array O 숫자 [ ] Object X 이름 { } object..

사용자가 서버 쪽으로 data를 전송하기 위한 방식으로 HTML의 form 태그 사용 태그 웹 페이지에서의 입력 양식으로, 화면에 보이지 않는 추상적인 태그 (ex. 로그인 창, 회원가입, 등) 속성 action 은 사용자가 입력한 정보를 어디로 보낼 것인지 링크를 설정해준다. 태그 사용자가 양식을 입력하기 위한 태그 속성 type(종류), name(데이터 이름), value(기본 값) type를 text로 설정하면 문자를 입력할 수 있는 폼이 생성됨 type를 password로 설정하면 사용자가 입력하는 문자가 별표 처리 된다. type를 submit으로 설정하면 제출하는 버튼이 생성된다.

Function - 일련의 프로그램에 대해 이름을 붙인 것 - 가독성을 높일 수 있음 - 유지 보수의 편의성이 급격히 높아짐 ex) 함수를 호출하는 곳이 1억개라면, 1억개가 동시에 바뀜 function f123(){ console.log(1); console.log(2); console.log(3); } f123(); console.log('A'); f123(); Input console.log(Math.round(1.6)); //2 console.log(Math.round(1.4)); //1 Math : javascript가 내장하고 있는 객체 (객체: 함수들을 관리하는 directory) round : 반올림을 해주는 함수 round 함수를 살펴보면 입력값이 존재함 (1.6과 1.4) functio..

Array data type (배열) 배열에서는 자릿수가 0부터 counting 된다. 배열의 개수를 셀 때는 0부터가 아닌 1 부터 counting한다. (배열이름.length)이용 배열의 끝에 데이터를 추가하고 싶으면 " javascript array add data" 검색 - (배열의이름.push )사용 //배열 생성 var arr = ['A','B','C','D']; //배열 읽기 console.log(arr[1]); //B console.log(arr[3]); //D //배열요소 바꾸기 arr[2]=3; //배열의 개수 console.log(arr.length); //배열의 끝에 데이터 추가 arr.push('E'); Array & Loop var number = [1,400,12,34,5]; ..

1. Number Data type 이항연산자 - 왼쪽(좌항)에 있는 값과 오른쪽(우항)에 있는 값을 처리해서 하나의 값을 만들어내는 역할 console.log(1); console.log(1+1); console.log(4-1); console.log(2*3); console.log(10/2); 2. String Data type String(문자열) 표현 : " " , ' ' 어떤 데이터를 사용하냐에 따라 연산자의 의미가 바뀜 "+" 이항연산자 -> 결합 연산자 //이항 연산자 console.log(1+1); // 2 //결합 연산자 console.log('1'+'1');// 11 String count string.length console.log('abcd'.length); 3. Variable ..