crabLab

자바스크립트는 꽤 오랫동안 호환성 이슈 없이 발전해왔습니다. 기존의 기능을 변경하지 않으면서 새로운 기능이 추가되었죠. 덕분에 기존에 작성한 코드는 절대 망가지지 않는다는 장점이 있었습니다. 하지만 자바스크립트 창시자들이 했던 실수나 불완전한 결정이 언어 안에 영원히 박제된다는 단점도 생겼습니다. 이런 상황은 ECMAScript5(ES5)가 등장하기 전인 2009년까지 지속되었습니다. 그런데 새롭게 제정된 ES5에서는 새로운 기능이 추가되고 기존 기능 중 일부가 변경되었습니다. 기존 기능을 변경하였기 때문에 하위 호환성 문제가 생길 수 있겠죠? 그래서 변경사항 대부분은 ES5의 기본 모드에선 활성화되지 않도록 설계되었습니다. 대신 use strict라는 특별한 지시자를 사용해 엄격 모드(strict mo..

script 태그 여기서 /path/to/script.js는 사이트의 루트에서부터 파일이 위치한 절대 경로를 나타냅니다. 현재 페이지에서의 상대 경로를 사용하는 것도 가능합니다. 같은 폴더 내에 있는 파일인 "script.js"를 src="script.js"로 참조하는 것처럼 말이죠. 물론 아래와 같이 URL 전체를 속성으로 사용할 수도 있습니다. 요약 웹 페이지에 자바스크립트 코드를 추가하기 위해 와 같이 삽입합니다.

명세서 ECMA-262 명세서(specification) 는 자바스크립트와 관련된 가장 심도 있고 상세한 정보를 담고 있는 공식 문서입니다. 이 명세서에서 자바스크립트라는 언어를 정의합니다. 매뉴얼 Mozilla 재단이 운영하는 MDN JavaScript Reference엔 다양한 예제와 정보가 있습니다. 특정 함수나 메서드에 대한 깊이 있는 정보를 얻고 싶다면 이 사이트가 제격입니다. 링크는 다음과 같습니다. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference 위 사이트에 들어가서 원하는 내용을 직접 검색하는 것도 좋지만, 가끔은 검색 엔진을 이용해 내용을 찾는 게 더 나을 때도 있습니다. Google 검색 엔진에 접속해 'MDN [원하..

정의 자바스크립트는 ‘웹페이지에 생동감을 불어넣기 위해’ 만들어진 프로그래밍 언어입니다. 자바스크립트로 작성한 프로그램을 스크립트(script) 라고 부릅니다. 스크립트는 웹페이지의 HTML 안에 작성할 수 있는데, 웹페이지를 불러올 때 스크립트가 자동으로 실행됩니다. 스크립트는 특별한 준비나 컴파일 없이 보통의 문자 형태로 작성할 수 있고, 실행도 할 수 있습니다. 브라우저에서 할 수 있는 일 자바스크립트의 능력은 실행 환경에 상당한 영향을 받습니다. Node.js 환경에선 임의의 파일을 읽거나 쓰고, 네트워크 요청을 수행하는 함수를 지원합니다. 브라우저 환경에선 웹페이지 조작, 클라이언트와 서버의 상호작용에 관한 모든 일을 할 수 있습니다. 브라우저에서 자바스크립트로 할 수 있는 일은 다음과 같습니다..

node.js Node.js는 크롬 V8 자바스크립트 엔진으로 빌드한 자바스크립트 런타임입니다. 이것으로 웹 브라우저 환경이 아닌 곳에서도 자바스크립트를 사용하여 연산할 수 있습니다. Node.js는 확장성 있는 네트워크 애플리케이션(특히 서버 사이드) 개발에 사용되는 소프트웨어 플랫폼이다. 작성 언어로 자바스크립트를 활용하며 논블로킹(Non-blocking)[3] I/O와 단일 스레드 이벤트 루프를 통한 높은 처리 성능을 가지고 있다. 내장 HTTP 서버 라이브러리를 포함하고 있어 웹 서버에서 아파치 등의 별도의 소프트웨어 없이 동작하는 것이 가능하며 이를 통해 웹 서버의 동작에 있어 더 많은 통제를 가능케 한다. npm npm으로 수많은 개발자가 만든 패키지(재사용 가능한 코드)를 설치하고 설치한 패..

DOM 문서 객체 모델(The Document Object Model, 이하 DOM) 은 HTML, XML 문서의 프로그래밍 interface 이다. DOM은 문서의 구조화된 표현(structured representation)을 제공하며 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여 그들이 문서 구조, 스타일, 내용 등을 변경할 수 있게 돕는다. DOM 은 nodes와 objects로 문서를 표현한다. 이들은 웹 페이지를 스크립트 또는 프로그래밍 언어들에서 사용될 수 있게 연결시켜주는 역할을 담당한다. 자바스크립트는 이러한 객체 모델을 이용하여 다음과 같은 작업을 할 수 있습니다. 자바스크립트는 새로운 HTML 요소나 속성을 추가할 수 있습니다. 자바스크립트는 존재하는 HTML 요소나..

자바스크립트 JavaScript는 웹 페이지에서 복잡한 기능을 구현할 수 있도록 하는 스크립팅 언어 또는 프로그래밍 언어입니다. 페이지의 내용이 — 가만히 정적인 정보만 보여주는 것이 아니라 — 주기적으로 갱신되거나, 사용자와 상호작용이 가능하거나, 애니메이션이 적용된 2D/3D 그래픽을 볼 수 있다면 JavaScript가 관여하고 있을 거라고 생각해도 좋습니다. MVC (모델-뷰-컨트롤러) 는 사용자 인터페이스, 데이터 및 논리 제어를 구현하는데 널리 사용되는 소프트웨어 디자인 패턴입니다. 소프트웨어의 비즈니스 로직과 화면을 구분하는데 중점을 두고 있습니다. 이러한 "관심사 분리" 는 더나은 업무의 분리와 향상된 관리를 제공합니다. MVC 소프트웨어 디자인 패턴의 세 가지 부분은 다음과 같이 설명할 수..

[수업 목표] 서버와 클라이언트의 역할에 대해 이해한다. HTML, CSS의 기초 지식을 이해한다. 부트스트랩을 가져다 쓸 줄 안다! Javascript 기초 문법을 익힌다. 느낀점 여러가지로 거의 다 아는 내용이었지만 그럼에도 배울점은 있었다. 우선 기초가 중요하다는 점 그리고 키-밸류의 딕셔너리를 api를 통한 서비스에서 잘 사용해야 한다는 점이다. 막연하게 당연하다 생각드는거지만 새삼 이렇게 배우니 다시금 중요하다는 생각이 든다. 스파르타코딩캠프는 확실히 실용성면을 매우 중요시 여기는 것 같다. 배우면서 느끼는것은 정말 서비스를 만드는데 있어 필요한것만 쏙쏙 빼와 강의를 구성한 느낌이다. 또한 부트스트랩도 알고는 있었지만 이렇게 사용하니 정말 활용력이 장난 아니었다. 물론 정석대로 우직하게 하나하나..

react로 리팩토링 구글링을 여러가지로 해본 결과 리액트앱으로 시작하여 참고자료들을 사용하며 배우고 적용하는것이 가장 빠른길일 것 같다. 리액트는 그저 라이브러리일 뿐이고 나는 어쩌면 피하고 있었을지 모른다. 그래서 다시 프로젝트를 처음부터 만들어 기존 프로젝트를 포팅했다. yarn으로 react create app 하였고 node-sass와 fontawesome 도 새롭게 하였다. 기존에 계속 react의 기초를 공부하여 그래도 어느정도 쉽게 포팅했다. react, express, nodejs 로 cors문제 해결 약간 비겁하게 해결한 것 같지만 그래도 구글링도 프로그래머의 기초소양이라고 생각한다. 결국 근본적인 해결인 proxy server를 만들어서 문제를 해결했다. MERN(mongoDB, ex..

geolocation 문제 해결 자고 일어나니 해결했다... 내가 해결한 방법은 함수안에 api를 넣은것이다. 문제의 원인이 지오로케이션의 latitude가 success함수 내애서만 정상적으로 나온다는 것인데 그래서 카카오 api를 그 함수내에 넣고 그 latitude를 사용해주었다 이 해결방법이 되는건 알겠지만 도대체 왜 어제 생각못했는지 모르겠다.. 수학문제든 코딩이든 자고 나면 해결되는 경우가 있나보다 CORS 문제 이제 공공데이터의 api를 이용해서 미세먼지농도를 추출하면되는데 쉬울줄 알았던게 오히려 더 어렵게 가는 것 같다. 그러면서도 이제야 좀 알겠는게 rest api를 위해 jquery와 ajax를 공부했다. 그래서 과거에는 몰랐던 카카오 api를 ajax로 응답받는데 성공했다! 하고 나니..