Front-end41 [Node.js] Node.js Helloworld & Common JS 모듈시스템 Node.js를 사용해본다. 우선 비주얼스튜디오 코드를 열고, 파일을 열어준다. 그 다음 보기 -> 모양 -> 패널을 클릭한다. 그러면 밑에 이 화면이 나오고, + 버튼을 눌러 powershell을 선택한다. 이 때 터미널이란 무엇일까 ? 우리가 평소에 프로그램을 실행시킬 때 마우스로 아이콘을 누르는 방식을 사용한다. 이를 Grapic User Interface(GUI)라고 한다. 하지만, 명령어를 입력해서 프로그램을 실행시킬 수도 있는데, 이를 Command Lind Interface(CLI)라고 한다. 이 때 명령을 내리는 곳이 터미널이다. 그럼 이제 명령어로 파일을 실행시켜보자. powershell을 열면 위와 같이 폴더의 경로가 다 나온다. 여기에다가 node 파일명 을 입력하면, 위와 같이 코드.. 2023. 8. 6. [Node.js] Node.js & VsCode 환경설정 Node.js 설치 https://nodejs.org/ko Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 공식 node.js홈페이지에서 다운받기 여기서 왼쪽 것을 클릭해서 다운받으면 된다. 설치 과정에서 이것 체크하기! 설치 완료 후 잘 설치되었나 확인하기 윈도우 기준 윈도우 + R 버튼을 이용해서 해당 창을 띄워준 다음 cmd를 입력해서 명령프롬포트 열기 그 다음 node -v와 npm -v를 입력해서 버전 확인하기(-v 앞에 띄어쓰기 안하면 오류나니까 주의) vs코드 설치하기 https://code.visualstudio.com/ Visual Studio Code - Code Edit.. 2023. 8. 3. [Node.js] Node.js란? 우리가 node.js를 배워야 하는 이유는 리액트가 자바스크립트의 라이브러리이기 때문이다. 원래 자바스크립트 코드는 브라우저 내장 자바스크립트 엔진을 이용하여 실행되었다. 이때 크롬의 v8엔진을 브라우저로가 아닌 다른 곳에서도 실행시키는게 가능해졌고, 이를 이용하여 자바스크립트가 브라우저가 아닌 곳에서도 동작할 수 있게 하는 프로그램이 개발되었는데, 이게 Node.js이다. 따라서 node.js는 자바스크립트의 실행환경이고, 이를 javascript's runtime이라고 부른다. 이게 개발되면서 , 다양한 서비스를 만들 수 있게 되었는데, 이때 자바스크립트로 웹서버를 만들 수 있게 되었다. 웹서버는 클라이언트가 서버에 요청을 하면 웹을 반환하는 한다. (url이 웹서버의 주소이다.) 리액트는 브라우저에.. 2023. 8. 2. [JavaScript] API 호출 API란 ? 클리이언트(브라우저)가 서버를 통해 데이터베이스에서 정보를 가져오려고 할 때 서버에 정보를 요청하고 응답을 받는 과정을 api 호출이라고 한다. api호출 과정이 언제 끝날지 모르기 때문에 비동기호출을 해야한다. 이 사이트는 무료로 가상 데이터를 응답해주는 서비스를 지원해준다. 이 사이트에 들어가서 /posts를 누르면 이렇게 코드들과 함께 상단에 주소가 나타난다. 이 때 우리가 사용할 것은 주소이므로 이를 복사해준다. 여기서의 코드는 json형태로, 이렇게 응답하겠다 라는 것을 나타낸다. let response = fetch("https://jsonplaceholder.typicode.com/posts").then((res) => console.log(res) ); 복사한 값을 fetch문.. 2023. 7. 30. [JavaScript] async와 await async async function 함수명(){ return 1; } /////////////////////////////////////////////////////////////// async function 함수명(){ return Promise.resolve(1); } async는 항상 promise 객체를 반환한다. 위 코드에서 빗금을 기준으로 위, 아래 코드는 동일하다. function hello(){ return "hello"; } anync function helloAsync(){ return "hello abc"; } helloAsync.then((res) => { console.log(res); }); 이 코드를 실행하면 hello abc가 출력된다. function delay(ms){.. 2023. 7. 28. [JavaScript] 콜백지옥과 promise 우선 콜백이 무엇인지 헷갈리시는 분은 아랫글을 참고해주세요 https://ethereal-coder.tistory.com/32 [JavaScript] 콜백함수 콜백함수는 함수를 매개변수로 받는 함수이다. 예시 코드 function day(time, morning, night){ if(time === "morning"){ morning(); //wakeUp이 출력 } else{ night(); //goToSchool이 출력 } } function wakeUp(){ console.log("wakeUp"); } f ethereal-coder.tistory.com Promise는 정말 자바스크립트를 공부하면서 고비라고 생각할 정도로 어려웠다. 강의 영상을 정말 5번 정도 돌려봤는데도 이해가 안돼서 앞에 내용을 .. 2023. 7. 25. 이전 1 2 3 4 5 6 7 다음