[Sep 15, 2020] 코딩 #3

Javascript 는 HTML/CSS를 동적으로 변화시키는 역할

눌렀을 때 나타나거나 사라지거나 하는.

단순 웹 요소 변화시키는 것 뿐만아니라 요즘은 활용분야 넓어지면서

앱 만들거나 프론트엔드 수준 넘어서서 백엔드 개발에도 활용됨.

자바만 잘해도 웹 앱 서버 디비 등 모든 것을 만들 수 있으니 잘 배워둘 것.

 

Javascript는 앞서 배운 html, css 처럼 구조를 표시하는 언어와 다르게

진정한 프로그래밍 언어. 양이 상당히 많음.

그렇지만 검색이나 직감을 통해 할 수 있는 부분이 굉장히 많다.

조금만 알아도 활용할 수 있는 부분이 큼.

 

: 자바스크립트로 웹에서 할 수 있는 거의 모든 것들을 할 수 있음

양이 방대하여 여기선 크게 보고 세부적인건 따로 공부하기

함수에 대해서 배우고 실습.

함수 = 마법 

함수의 이름을 써준 다음에 괄호를 열고 닫아주면 끝 !

윙가디움레비오사()

자바스크립트 코드를 직접 작성해보기.

쉽게 작성 방법- 개발자 도구 이용.

크롬 f12 - 개발자도구 창 

지난시간까지는 elements창 위주로 사용했다면 이번엔 console탭으로 ㄱㄱ

커서가 깜빡하는 곳에 자바스크립트 코드를 쓰게되면 바로 바로 동작 하는 것 확인 가능

 

alert 는 브라우저에 경고창을 띄워주는 함수

엔터

함수는 이렇게 경우에 따라 암것도 없이 동작할 수 도 있겠지만

특정 재료가 필요한 경우 있음. 그 때는 필요 재료 괄호와 괄호 사이에 넣어줌.

경고창안에 특정 메세지 써주고 싶다면

함수에 어떤 것들이 안에 필요한지, 사용법은 어떻게 되는지는

각각 함수마다 다르므로 정확 사용법은 구글 검색ㄱㄱ

검색 방법 : 

w3schools 설명 굿

syntax 정확설명

마법보다 놀라운 점.

마법은 이미 정해진 주문만 외워서 사용 가능 

but 코딩 함수는 직접 주문 만들거나 변형해서 사용 가능

직접 만들어서 사용해보기.

자바스크립트에서 직접 만드는 방법은

fuction이라고 쓰고 함수 이름 작성

함수 정의 완료 후

이미 유용한 함수 많아서 그냥 가져다 쓰기 굿

자바스크립트 자체를 좀 더 쉽게 사용할 수 있게 해주는 라이브러리 있음.

지난 css시간에 css쉽게 해주는 bootstrap : css를 쉽게 만들어주는 라이브러리

를 배운 것 처럼 자바스크립트에서는 가장 유명한 jQuery 배우고 예제 만들어보기.

유용 함수 많이 내장되어 있고 자바스크립트 자체를 좀 더 쉽게 사용할 수 있도록 만들어 줌.

jQueryui의 경우에는 우리가 화면을 구성할 때 사용할 수 있는 

유용한 함수들을 많이 내장하고 있음.

버튼 눌렀을 때 저 비행기가 사라졌다 나타났다 하는 예제 만들어 보기.