OUR + YOUR SPACE

python 1. 파이썬 설치 window 10일 경우 쉽게 설치하는 방법 windows subsystem for linux(WSL) 설치 [윈도우 내에 리눅스 머신을 갖게 됨] 파이썬 설치 sudo apt-get install python3.7 다른 방법 파이썬 3.* 다운로드 https://www.python.org/downloads/ 설치[설치시 Add Python 3.7 to Path 클릭 (필수)] 최종결과 PS D:\> python Python 3.7.7 (tags/v3.7.7:d7c567b08f, Mar 10 2020, 10:41:24) [MSC v.1900 64 bit (AMD64)] on win32 Type "help", "copyright", "credits" or "license" f..

let, const 변수의 기본은 생성하고 초기화하여 사용한다. 변수의 초기화 하거나 생성할때 let, const, var를 이용한다. 기존에는 var로 변수를 선언했으나 지금은 var 보다는 const, let으로 선언을 한다. 변수는 가변적이기 때문에 변할 수 있다. javascript 는 위에서 아래로 순차적으로 실행한다. let a = 111; let b = a -5 ; console.log(b); # 결과값: 106 a = 6; console.log(b, a); # 결과값: 106, 6 var를 쓰지 않는 이유 let,const는 Block scope 이지만 var는 그렇지가 않다. Block scope 이란 코드를 블럭 안에 작성을 하면 블럭 밖에서는 블럭안을 볼 수가 없게 됨에 따라 코드의 ..

Babel 을 이용한 ES6 변환 1. node.js 설치 2. package.json 생성 npm init 실행 PS D:\study\es6> npm init This utility will walk you through creating a package.json file. It only covers the most common items, and tries to guess sensible defaults. See `npm help json` for definitive documentation on these fields and exactly what they do. Use `npm install ` afterwards to install a package and save it as a dependen..

ES6 기본적 개요 ES6은 2009 년에 ES5가 표준화 된 이후 처음으로 업데이트된 버전 많은 변화가 이뤄졌으며 매우 중요한 업데이트로 여겨짐 ES6 = ES2015 특징 ES5의 일부 문제를 해결 이전 버전과의 호환성 제공 현대적인 구문 확장성 제공에 따른 대규모 어플리케이션 제작에 적합 표준 라이브러리의 새로운 기능 제공 최신의 Chrome 및 Firefox에서는 모든 기능을 사용가능하나 일부 브라우저에서는 사용 불가능 그래서 ES6 코드를 ES5 로 변환해주는 Compiler를 이용해야함 babel, traceur, closure

외부에서 가져온 날짜 API를 호출 출처: https://youtu.be/5fAMu2ORvDA [노마드 코더 Nomad Coders] 우선 디바이스의 위치정보를 불러온다. 가져온 위치 정보를 로컬 디바이스에 저장하고 이를 이용 날짜 정보를 가져온다. 키워드1. Navigator 인터페이스 사용자 에이전트의 상태와 신원 정보를 나타냄 Navigator.geolocation : 디바이스 위치에 접근을 허용하기 위한 객체를 반환 키워드2. fetch API 네트워크 통신을 포함한 리소스 취득을 위한 인터페이스 IE 에서는 지원하지 않음 [polyfill 이용] Promise를 기반으로 되어 있음 기본구조 fetch('http://example.com/movies.json') .then(funct..

Image Background 출처: https://youtu.be/aHlJqxLREcY [노마드 코더 Nomad Coders] 배경을 랜덤이미지로 출력 키워드1. Math.random() 0 이상 1 미만의 부동소숫점 의사 난수. //두 값 사이의 난수 생성하기 function getRandomArbitrary(min, max) { return Math.random() * (max - min) + min; // min 보다 크거나 같으며, max 보다 작은값 } //두 값 사이의 정수 난수 생성하기 function getRandomInt(min, max) { min = Math.ceil(min); max = Math.floor(max); return Math.floor(Math.random() * (m..

3단계 삭제 버튼을 눌러 로컬스토리지에서 삭제 및 페이지에서 지우기 출처: https://youtu.be/dbPOjiG5WJ4 [노마드 코더 Nomad Coders] 버튼 클릭시 화면에서 해당 리스트 삭제 로컬스토리지에서 데이터를 삭제 키워드1. filter() 배열의 각요소마다 한번씩 호출이 되며 해당값이 true 인것들을 모아서 반환 자세한 내용은 https://tcss.tistory.com/entry/18-Array-APIs?category=865698 참고 const fruits = ['apple', 'banana', 'orange']; let result = fruits.join(); console.log(result); //결과값: apple,bana..

Array APIs 출처: https://www.youtube.com/watch?v=3CUjtKJ7PJg&t=1142s [드림코딩 by 엘리] Q1. make a string out of an array 배열을 String으로 변환 키워드: join(separator) 메서드는 배열의 모든 요소를 연결해 하나의 문자열로 반환 separator:배열의 각 요소를 구분할 문자열을 지정. 생략하면 배열의 요소들이 쉼표로 구분 const fruits = ['apple', 'banana', 'orange']; let result = fruits.join(); console.log(result); //결과값: apple,banana,orange result = fruits..

2단계 todolist 에 저장한 값을 로컬스토리지에 저장하고 출력 출처: https://youtu.be/JEbOaI_0phc [노마드 코더 Nomad Coders] 사용자의 할일을 입력폼에 등록시 로컬스토리지에 저장 저장한 할일을 출력 키워드1. JSON.stringify, JSON.parse Object형태를 String형태로 상호 변환시킴 자세한 내용은 https://tcss.tistory.com/entry/16-JSON?category=865698 참고 키워드2. forEach 배열반복 Looping over an array 배열 반복 자세한 내용은 https://tcss.tistory.com/entry/Array-%EC%8B%AC%ED%99%94%ED%95%99%EC%8A%B5?category=..

JSON [Javascript Object Notation] 출처: https://www.youtube.com/watch?v=FN_D4Ihs3LE [드림코딩 by 엘리] 1. JSON.stringify(obj) Object => JSON serialize 으로 변환 key,value 형태의 Object 가 String(문자형)으로 변환 기본구문 let json = JSON.stringify(['apple', 'banana']); console.log(json); // 결과값 ["apple","banana"] console.log(typeof json); //결과값: string const rabbit ={ name : 'tori', color: 'whit..