뭘 배웠지?

시작은 우리의 설치를 도와줄 Node.js 1. Node.js Node.js 공식 사이트 링크 => https://nodejs.org/en/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 2. VSCode 들어가서 터미널 열고 typescript 설치 npm install -g typescript 3. typescript 잘 깔린지 확인 tsc --version 4. ts 파일 js로 컴파일 tsc index.ts OOOOOOOOOR ts 파일 자체를 console에서 확인하고 싶다면 5. 추가로 ts-node 모듈 설치 npm install -g ts-node 6. ts 파일 확인 ts..

엘리스 SW 엔지니어 트랙 18일차 이고잉님 실시간 강의날 16일차 싱글어플리케이션 복습으로 시작 오늘은 만든 내용을 저장하는 백엔드로 들어간다 프론트엔드 웹 서버에 index.html 등 저장하지만 해석은 클라이언트 브라우저가 한다 클라이언트 사이드 기술 = 프론트엔드 백엔드 일반 웹 서버는 동작이 정해져있지만, 커스텀 웹 서버는 모든일을 할 수 있다 이 커스텀 웹서버는 python, php, node.js, spring 등으로 만들고 DB와 소통한다 서버 사이트 기술 = 백엔드 이번주는 백엔드가 주체 웹 서버가 클라이언트에 응답하는 주체가 Json, xml, csv 요즘은 Json이 압도적으로 우세 fetch가 대박 꼭 알아야겠군 이 코드는 꼭 이해하자 fetch('/topics') .then(fun..

엘리스 SW 엔지니어 트랙 17일차 온라인 강의날 비동기, Promise에 대해 조금 깊게 들어가는날 자바스크립트 엔진은 하나의 메인 스레드 코드를 한 줄씩 실행 동기 반복문, 함수 호출 등 오랜 시간을 메인 스레드를 오래 점유하면 프로그램이 멈춘다 가령 반복문 무한루프 등 비동기 대표적으로 setTimeout(), fetch() 있다. 한 코드가 종료되기전에 다른 코드가 진행된다 시간이 걸리는 행동을 기다리며 동시에 다른 일을 처리할 수 있다 비동기 코드는 정해진 함수(setTimeout, fetch, Promise ... ) 이 함수를 비동기 API라고 부른다 Promise 비동기 처리의 순서 조종 new Promise(callback) callback에는 resolve, reject를 받는다 순서를..

엘리스 SW 엔지니어 트랙 15일차 오티 빼고 한 주에 5일씩 오늘로 3주차 마지막 날이다 1~2 주차는 쉬엄쉬엄 가는듯 하다가 3주차부터 엑셀 사정없이 밟는다 오늘도 잘 모르는 내용 아니 이제 나오는 것들 대부분 잘 모르는 이야기 집중하자! 오늘은 "옛날 옛적에 자바스크립트가 있었는데" 느낌 어떻게 움직이고, 각 역할들에 대한 이야기 자바스크립트 코드는 자바스크립트 엔징을 통해 파싱되고 실행된다 Chrome 브라우저는 V8 엔진 사용 node.js 브라우저 외에서 자바스크립트 코드를 실행할 수 있게 해주는 프로그램!! 그렇구나~ 이거봐 알고나니 개념은 별거 아니잖아 웹을 벗어나기 위한 JavaScript의 도약이라고 알아두자 브라우저 환경, node.js 환경에서 같은 코드를 작성해도 다른 작동이 될 ..

엘리스 SW 엔지니어 트랙 14일차 온라인 강의날 자바스크립트 심화의 날 보니까 실시간 강의 다음날 온라인 강의는 실시간 강의에서 배운 내용을 복습하고 살을 붙이고 튼튼하게 만드는 내용을 담고 있는구나 계획적이었어.. 온라인 강의를 좀 더 성실히 들어야겠다 아무튼 이번 온라인 강의에서는 자바스크립트 함수가 실행되는 과정으로 시작되었다 이제는 알 때가 됐다 바인딩(binding) 우선 bind()는 언제 사용할까? this를 가지고 있는 객체(object)에 사용하는 것처럼 보인다 this를 자유자재로 사용하기 위해서처럼 보인다 this가 작동하지않는/사라지는 경우가 있다 예) setTimeOut() bind에 관한 좋은 설명 링크 => https://ko.javascript.info/bind 바인드 사용..

엘리스 SW 엔지니어 트랙 12일차 온라인 강의날 오늘은 더욱 집중하고 싶은 내용! DOM, 노드 그리고 이벤트에 대한 날~ 어제 실시간 강의에서 들은 내용을 한번 더 복습도 하고, 새로운 내용을 실습하는 내용도 있다 노드 Node를 이번에는 제대로 잡자! HTML DOM에서 정보를 저장하는 계층적 단위라고 엘리스의 선생님은 말하신다 또누군가 이렇게도 설명을 했었다 A node is a connection or a branch in a hierarchy, etc. where node.js would refer to the software - but you can also just call it node for a short form and most people in the coding world will..

엘리스 SW 엔지니어 트랙 10일차 오늘은 한 가지만 하면 됐다 주어진 내용이 담긴 자기 소개 페이지를 만드는 것이다 지금까지 복습한 HTML, CSS, JavaScript 이용해서 만들었다 한 눈에 봐도 멋진 자기소개서를 만들려고, figma도 키고, 리소스도 찾아봤다 결과는 과연 . . . 굉장히 심플한 1페이지 자기소개서가 완성됐다 이 것도 시간이 꽤 걸렸다 갑자기 하려니까 쉽지 않구만~ 머리속에 있는 상상을 코드로 끄집어 내는 연습이 귀찮아도 해봐야 되나보다 결국엔 만족할 수 있는 포트폴리오를 만들어야 되니까