1. 학습한 내용

자바스크립트

웹 개발이란?

• 웹 개발은 웹 브라우저 화면에 보이는 겉모습을 만드는 것이 전부가 아니다
• 웹 사이트에서 사용자에게 제공할 기능과 서비스까지 모두 담아야 한다

• 프론트엔드 계열의 경우 => 굳이 수학이 필요없다
  알고리즘을 짜거나, 빅데이터쪽에 관심이 있다면 수학을 준비할 필요가 있다.

• 자바스크립트의 주요 부분은 프론트엔드, 물론 노드JS라고 백엔드에도 이용된다.

• 자바스크립트는 이벤트를 처리하는, 소비자가 요청하는 행동에 대해 반응을 해주는, 상호작용을 해주는 것을 처리

• 클라이언트 - 프론트엔드 => 웹브라우저
  서버 - 백엔드 => 웹 요소와 여러 정보가 저장됨

• 프론트엔드 개발 => 웹 브라우저 화면에 보이는 부분을 다룸, 웹사이트 제작, html,css

• 백엔드 개발 => 서버를 다룸, 데이터베이스를 설계하거나 데이터 처리, 자바, 파이썬, PHP

• 일론 머스크의 space X의 인터페이스는 크롬기반 웹 브라우저에 html,css,javascript로 만들어졌다

• 웹 개발의 기본 영역 = HTML, CSS, 자바스크립트, 깃/깃허브

• 프론트엔드 영역
  라이브러리 => 제이쿼리, 부트스트랩 등
  프렘임워크 => 리액트, 앵귤러, 뷰 등

• 백엔드 영역
  리눅스 서버, 네트워크, 데이터베이스 구축 기술
  언어 => 파이썬, 자바, PHP, 닷넷 등
  프레임워크 =>노드제이에스, 스프링, 장고, 코드이그나이터 등

• 개발을 할 때 다른 사람들이 만들어 놓은 것들 중 필요한 것들을 효과적이고 효율적으로 가져다 쓰고, 또한 가져온 것들을 마음대로 다룰 수 있을 줄 알아야 한다.

웹 개발, 어디서부터 시작할까?

1. 웹 문서의 뼈대를 만드는 HTML
   웹 브라우저 창에 웹 문서의 내용을 보여주기 위한 약속
   HTML에서 약속한 표기법을 사용해서 문서 작성해야함

2. 웹 문서를 꾸미는 CSS
   웹 문서를 꾸미거나 웹 요소를 적절하게 배치하는 방법
   다양한 디바이스에 맞는 반응형 웹 디자인을 만들기 위해 필수적으로 학습해야 함

3. 사용자 동작에 반응하는 자바스크립트
   사용자 동작에 반응해서 동적인 효과를 만들기 위한 기술
   자바스크립트를 알고 있다면 새로운 프레임워크를 배우기 쉬움

자바스크립트로 무엇을 할까?

1. 웹요소를 제어

• 웹 요소를 가져와서 필요에 따라 스타일을 변경하거나 움직이게 할 수 있음
• 웹사이트 UI부분에 많이 활용

2. 웹 애플리케이션을 만든다

• 최근의 웹사이트는 사용자와 실시간으로 정보를 주고받으면서 애플리케이션처럼 동작

3. 다양한 라이브러리를 사용할 수 있다

• 웹을 중심으로하는 서비스가 늘어나면서 브라우저에서 처리해야할 일이 늘어남 -> 라이브러리와 프레임워크가 계속 등장

4. 서버를 구성하고 서버용 프로그램을 만들 수 있다

• node.js : 프론트엔드 개발에 사용하던 자바스크립트를 백엔드 개발에서 사용할 수 있게 만든 프레임워크

자바스크립트 기본 용어

• alert("경고,알림창 띄우기")

• prompt("값을 입력받기")

• console.log("콘솔창에 출력")

• var name = prompt("이름을 입력하세요")
  document.write(name + "님 어서오세요");
  (콘솔창 입력시 줄바꿀때 shift+enter)

• ctrl shift j => 콘솔창만
  ctrl shift i => F12창

• 식별자: 프로그래밍언어에서 이름을 붙일 때 사용하는 단어, 주로 변수명이나 함수명 등으로 사용
  -키워드 사용 x
  -숫자로 시작불가
  -특수문자는 _와 $만 허용
  -공백문자를 포함할수없음
  

• 식별자를 만드는 일반적인 관례
  -클래스의 이름은 항상 대문자로 시작
  -변수와 인스턴스, 함수, 메소드의 이름은 항상 소문자로 시작
  -여러 단어로 이루어진 식별자는 각 단어의 첫 글자를 대문자로 사용
  

• 주석: 프로그램 코드를 설명할 때 사용
  //를 입력하는 것으로 한 줄 주석을 표현
  /* */를 입력하여 여러 줄 주석을 표현

• 자바스크립트 스타일 가이드
  -코딩 규칙
  -자바스크립트는 더이터 유형이 유연해서 오류발생이 잦다
  -팀 프로젝트를 진행한다면 통일된 코딩 규칙이 필요하다
  -코딩 규칙에 따라 작성된 웹사이트는 유지보수도 수월하고 그만큼 비용도 줄어둔다

• 기본 가이드

1. 코드를 보기 좋게 들여쓴다

2. 세미콜론으로 문장을 구분한다

3. 공백을 넣어 읽기 쉽게 작성한다

4. 코드를 설명하는 주석을 작성한다

5. 식별자는 정해진 규칙을 지켜 작성한다
   -첫 글자는 반드시 영문자나 언더스코어(_), 달러 기호($)로 시작해야 한다
   -두 단어 이상이 하나의 식별자를 만들 때 단어 사이에 공백을 둘 수 없다
   -예약어(키워드)는 식별자로 사용할 수 없다
   

6. 중괄호의 위치
   

7. 자료형, 숫자형
   
   
   
   

• 자바스크립트의 데이터 유형 자동 변환
  자바스크립트의 편리한 점이면서도 약점인 부분이 데이터 유형이 유연하다는 것. 다시 말해 변수의 데이터 유형이 중간에 바뀔 수 있다. 책에 있는 ‘나이 계산 프로그램’에서는 프롬프트창을 통해 사용자의 태어난 해를 입력받는데, 이때 프롬프트 창에서 입력받은 값은 문자열이지만 사칙연산에 사용된 문자열은 자동으로 숫자형으로 변환되어 계산된다.

2. 학습한 내용 중 어려웠던 점

아직은 생활코딩 선생님과 해봤던 것이기도 하고 초반부이기에 크게 어려웠던 점은 없는 것 같다.

3. 해결방법

이후 좀 더 심화적으로 들어가기까지는 코드와 조금은 친해져있기 때문인지 3월에 시작했던 때보다 훨씬 수월하다.

4. 학습소감

백엔드쪽에 대한 공부가 반드시 필요하며, 향후 직업적으로도 크게 도움이 된다고 하니 개별적으로 잘 준비해야봐야겠다.