#1.0 Welcome
#1.1 What Are We Building
모멘텀
- 로그인 : 사용자 기억
- Geolocation : 시계, 날씨, 위치
- to-do list
#1.2 Requirements
- 선수 : HTML, CSS
- HTML : 폼, 인풋, 버튼, body/head
- CSS : class, selector
#1.3 Software Requirements
해당 사항 없음
#1.4 Why JS
- 자바스크립트의 역사
1995.12.
자바스크립트 10일만에 개발
넷스케이프라는 브라우저를 위해 인터렉티브하게 만드려고 개발한 언어
프론트엔드에서 유일하게 사용할 수 있는 언어
자바스크립트를 설치할 필요 없음
브라우저가 이해하는 세 언어 ; html, css, javascript
- 왜 자바스크립트가 유명한가?
프론트엔드에서 유일하게 사용할 수 있는 언어
- 자바스크립트의 문제
유일한 선택지임
#1.5 Why JS 2
- JS로 만들 수 있는 것
three.js : 자바스크립트 3D, 비디오 게임, 시각화
예술적 감각이 있다면, 할 수 있음.
자바스크립트가 좋은 선택이 될 것이다.
3D 모델링만 도움을 받으면 된다.
모든 상호작용을 자바스크립트로 만들 수 있다.
자바스크립트를 깊게 배우고 싶다면, 프레임워크로 넘어가면 된다.
내가 하려는 것을 도와주는 프레임워크
ex) 리액트 네이티브 - ios, 안드로이드
ex) 일랙트론 - 컴퓨터 프로그램 : 피그마, 슬랙, 트위치, vs code
백엔드도 가능함
완전 강력한 언어. 둘다 할 수 있다.
3D로 하려면, 자바스크립트 매우 중요함 : socket.io
자바스크립트 ml5.js 머신러닝도 가능함
하나의 언어만 알면 된다.
#2.0 Your First JS Project
alert("hi");
undefined
1+1
2
브라우저는 html을 읽고, html은 css과 자바스크립트를 가져온다.
html이 접착제 역할을 한다.
파일을 여는 것만으로는 되지 않는다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Document</title>
</head>
<body>
<script src="app.js"></script>
</body>
</html>
이렇게 CSS, JS를 연결함
대부분의 시간을 자바스크립트를 수정하며 보낼 것이다.
#2.1 Basic Data Types
// 데이터 타입 1. integer, float
2+2
4
1.5
1.5
// 데이터 타입 2. string
"hello"
#2.2 Variables
console.log(523432);
console.log("String");
console.log('String');
게으르는 법
console.log(523432);
console.log("String");
console.log('String');
console.log(5+2);
console.log(5*2);
console.log(5235/2432);
const a = 5;
const b = "a";
console.log(a*10);
console.log(a-10);
console.log(b);
'Computer Science > FrontEnd' 카테고리의 다른 글
노마드 코더 JS | #6 Quotes and Background (0) | 2022.02.24 |
---|---|
노마드 코더 JS | #5 Clock (0) | 2022.02.22 |
노마드 코더 JS | #4 Login (0) | 2022.02.22 |
노마드 코더 JS #3 | JavaScript on the browser (0) | 2022.02.21 |
노마드 코더 JS #2 | Welcome to JavaScript (0) | 2022.02.20 |