본문 바로가기
반응형

스터디

 (17)
[노마드코더] 바닐라 JS로 크롬 앱 만들기 #2.13 Conditionals - #2.16 Recap #2.13 Conditionals conditional(조건문)은 true인지 false인지 알려주기 때문에 매우 중요 예를들어 사용자가 로그인되어 있다면 >> 무엇인가를 보여준다. parseInt() : string을 받아서 number로 바꾸는 함수 #2.14 Conditionals part Two isNaN(): 입력된 parameter가 Not A Number인지 아닌지를 반환해주는 함수. if/else 문 테스트 코드 const age = parseInt(prompt("How old are you?")); console.log(age); if (isNaN(age)) { // isNaN(age)가 true라면 실행 console.log("Please write a Number"); } else {..
[노마드코더] 바닐라 JS로 크롬 앱 만들기 #2.11 Returns - #2.12 Recap #2.11 Returns 함수가 그냥 어떤 기능을 수행하는 것이라고 생각하기 보단, 어떤 일을 수행하고 그 결과를 알려주는 것. function 안에서 무언가를 return 하면, 어디선가 function을 실행 할 때 return 값으로 대체된다. #2.12 Recap function에서 return을 하는 순간 function은 종료 function은 계속 남아 있는 게 아니다. >> (실행되고 나면) 사라지고, 마지막엔 결과를 남긴다. const calculator = { plus: function(a, b) { console.log("hello"); return a + b; // not executing console.log("bye bye"); }, }; const plusResult = cal..
[노마드코더] 바닐라 JS로 크롬 앱 만들기 #2.7 Function part One - #2.10 Recap II #2.7 Functions part One function은 반복해서 사용할 수 있는 코드 조각 선언방법 : function 함수명() { 실행코드 } #2.8 Functions part Two - function에게 정보를 보내는 방법 function의 () 안의 매개변수에서 argument를 받을 수 있다. 여러개의 argument도 받을 수 있으며, 순서가 중요. Object 안에서 매개변수가 argument를 받을 수 있다: #2.9 - #2.10 Recap let과 const의 차이는, let은 업데이트를 할 수 있다는 것. never: var, always: const, sometimes: let. array 활용법 : const toBuy = ["potato", "tomato", "pizza..
[노마드코더] 바닐라 JS로 크롬 앱 만들기 #2.4 Booleans - #2.6 Objects #2.4 Booleans true/false null : 아무것도 없는 것으로 값이 채워짐. (variable 안에 어떤 것이 없다는 것을 확실히 하기 위해 쓰는 것) undefined: variable이 메모리에는 있는데 값이 없는 것 #2.5 Arrays 데이터를 나열하기 위한 방법 중 하나. array의 목적: 하나의 variable 안에 데이터의 list를 가지는 것. [rules] 시작과 끝에 대괄호 []를 사용. array 안 각각의 항목은 쉼표로 분리. const daysOfWeek = ["mon", "tue", "wed", "thu", "fri", "sat"]; ※ 숫자, string, boolean, null, undefined 등 어떤 값도 넣을 수 있다. ex) array에서 5번째 ..
[노마드코더] 바닐라 JS로 크롬 앱 만들기 #2.1 Basic Data Types - #2.3 const and let #2.1 Basic Data Types 문자(string)와 숫자(integer, float)가 존재 #2.2 Variables 위 예제에서 5를 10으로 바꾸고 싶다면? >> Variable 사용 variable을 만들기 위해서는 const를 사용한다. string의 경우에도 동일한 형식으로 variable 정의. ex) const myName = "nico" #2.3 const and let variable을 만들 때 let을 사용 가능하다. [const / let/ var 차이점] - let 재선언 금지, 재할당 가능 - const 재선언 금지, 재할당 금지 - var 재선언 가능, 재할당 가능 기본적으로 const 를 사용하고 변수를 업데이트 하고 싶다면 let을 사용한다. 그리고 var은 쓰지말..
[노마드코더] 바닐라 JS로 크롬 앱 만들기 #1 INTRODUCTION | #2 Your First JS Project Requirements internet explorer를 제외한 브라우저 ( 크롬, 엣지 ) 및 visual studio code Why JS ? JS는 10일만에 만들어졌다고 한다. 자바스크립트는 모든 브라우저에 내장되어 있다. 프론트엔드에는 JS가 유일한 옵션이며 Visual Studio 및 SLACK도 자바스크립트, HTML, CSS을 이용해 만들어졌다. Your First JS Project 자바스크립트는 이미 브라우저에 설치되어 있기 때문에, 브라우저의 inspect - Console 창을 통해 Javascript를 이용 가능하다. 하지만 콘솔은 한줄씩 작성해야 해서 유용하진 않아 Visual Studio를 이용. 브라우저는 HTML을 열고, HTML은 CSS와 자바스크립트를 가져온다. VS P..
[노마드코더] 바닐라 JS로 크롬 앱 만들기 #1 INTRODUCTION | CSS3 독학백서, 이도해 앞의 HTML 글에 이어 CSS 관련 스터디 한 내용을 이어 적어보고자 한다. 밀리의 서재 - "CSS3 독학백서, 이도해" 를 참고했다. HTML - 폼을 어떻게 작성하는지, 인풋, 버튼, body, head CSS - class와 id의 차이점, selector CSS class 와 id는 HTML 태그를 특정하기 위해 사용되는 속성으로, 태그에 정의된 클래스 및 아이디는 CSS, Javascript 등에서 선택자로 사용된다. class id 보다 유연한 속성으로, 한 번 선언되고 사용된 클래스를 다른 태그에도 중복하여 사용할 수 있다. 또한 class는 하나의 태그에 띄어쓰기로 구분한 여러개의 클래스를 적용할 수도 있다. HTML의 역사 HTML 최초의 일반 공개 설명은 1991년 말에 버너스리가 ..
[노마드코더] 바닐라 JS로 크롬 앱 만들기 #1 INTRODUCTION | HTML5 독학백서, 이도해 #1.2 Requirements HTML, CSS를 통해 웹사이트를 만든 후 Javascript로 interactive 하게 만들 수 있다. 따라서 웹사이트를 만들기 위해 HTML, CSS에 대한 기본적인 수준의 지식이 필요하다. HTML - 폼을 어떻게 작성하는지, 인풋, 버튼, body, head CSS - class와 id의 차이점, selector 강의에서는 위 항목들 대한 이해도가 필요해 코코아톡 클론 코딩이라는 선수 과정을 추천한다. 하지만, 유료과정이라 간단하게 밀리의 서재 - "HTML5 독학백서, 이도해" 로 정리해 보려한다. 읽어보니 초보자도 이해하기 좋은 책인 것 같다. HTML 이름 button widget 버튼 위젯은 다음과 같은 type 속성을 가진다. : ' button/ su..
반응형

티스토리툴바