디자인

생코 node.js 1

바다를바라보다 2021. 1. 23. 21:18

node.js가 뭘까?

자바스크립트는 기본적으로 web에서만 작동하는데 밖에서도 작동하는 javascript라고 보면 쉽다!

 

그래서 vscode와 cmd 기능을 동시에 사용해야 한다 

vscode에서 그냥 밖에서 끌어다가 놓으면 된다 .... 따로 터미널을 사용해야 하는지 모르겠다~

코드 애니웨어라는 서버에서 작업을 하는 중이다 내용은 터미널과 에디터를 왔다갔다한다.,.

 

노드 js로 웹애플리케이션을 만든다 >> 각각의 스텝마다 노드js 기능을 실행 시켜야한다

중간중간에 자바스크립트 얘기가 나오는데 익숙하고 아는내용이라면 노드js의 기능을 설명하는 강의를 듣길바란다

lacalhost3000 검색창에 쳐서 들어가자

 

소스 파일들을 받고 노드  node main.js 하면 노드 js가 실행이 되는데 여기서 ctrl+c로 노드실행을 멈추면 웹사이트(lacalhost3000)의 실행도 멈춰진다 

 

자바스크립트 문법으로 작성하고 node를 통해서 출력하는건 뭐 똑같다 url에 대해서 알아보자

http:....//opentutorialsorg:3000/main?id-HTML&pa

프로토콜//호스트:(3000)포트?query string 쿼리스트링이 중요하다 물음표뒤

 

개발자 도구를 열어서 엘리먼트 옆에있는 콘솔을 클릭해주고 자바스크립트 언어를 써준다

함수의 뜻을 알아보고 싶으면 구글 검색창에 javaascrpit 그리고 뒤에 함수이름을 써주면 된다

 

콘솔에서 칸 띄우기는 shift = enter다

 

이것은 우리가 특정 함수를 정의하고 그 코드를 써주면 이제 효과를 나타낼 수 있다는 뜻인것 같다

function kim() { alert("좋아요 구독 부탁드립니다."}를 콘솔에서 정의해주고 이제 밑에

kim()를 써주면 효과가 적용이된다

 

만들어 놓은 자바 스크립트 함수가 정말 많다 구글 검색창에 javascrpit 필요한 기능 이라고 검색하면

아니 제이쿼리라는 사이트가 있다 지난 번에 부트 스트랩처러 여러 유용한 자바스크립이 있다

 

그리고 제이쿼리를 연결해주어야하는데 쉬운방법으로 cdn을 클릭 복사해서 

바디태그 끝나는 지점 위에 <script src=""></script> ""사이에 넣어주면 된다

 <script

      src=제이쿼리 코드

      integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc="

      crossorigin="anonymous"

    ></script> 이렇게 넣어주면 연결된다

 

구글에서 찾아쓰는 것이 습관화 되는 것이 좋다 코드는 무한하게 많기 때문...;;

구글에 jquery hide show 검색 우리는 숨겼다 보여줬다를 표현할 것이기 때문

그리고  w3schools 같이 정리가 잘 되있는 곳에 들어가서 스크립트사이에 있는 코드들을 복사해 내 코딩 창에 붙여넣기 해준다

 

이미지에 id = 레이스 와 클로킹을 아이디로 정의 해준다음에

    <script>

      $(document).ready(function () {

        $("#cloaking").click(function () { 

          $("#wraith").toggle();

        });

      });

    </script> 이런식으로 누르는 버튼을 클로킹 그리고 레이스가 토글방식으로 적용된다는 것을 이렇게 대입해주면 된다 그리고 id앞에 #붙이는걸 까먹지말자

 

그리고 제이쿼리 사이트에서 api 옵션을 클릭해서 다양한 함수들을 찾을 수 있다

 

제이쿼리 ui에선 웹사이트에 유용한 함수들을 찾을 수 있다 view소스를 클릭해서 복사해서 적용가능!

 

부트스트랩과 코드펜에서도 유용한 자바스크립트 함수를 찾을 수 있다! javascript원하는 함수 이렇게 쳐서 보면 간단함!

 

다음 강의는 api라는 것을 배워보기로 하자 자바스크립트 심화버전이라 할 수 있나?

여튼 벌써 웹에서 개발까지 오게 됐다.... 뭐 주먹구구식 이긴하지만