분류 전체보기 (42) 썸네일형 리스트형 [Javascript] Inside Javascript 책 단어 뽀개기 (chapter 4/8) Chapter 4. 함수와 프로토타입 체이닝 4.1 함수 정의 함수 함수(function)란 하나의 특별한 목적의 작업을 수행하기 위해 독립적으로 설계된 코드의 집합 함수를 사용하는 가장 큰 이유는 반복적인 프로그래밍을 피할 수 있다. 프로그램을 여러 개의 함수로 나누어 작성하면 모듈화 사전적인 의미로 "몇 개의 관련된 부품들을 하나의 덩어리로 생산해 장착하는 기술방식" 의미 클로저(closure) 외부함수의 맥락(context)에 접근 가능한 내부함수 좀 더 포괄적으로는 함수 선언시 생성되는 유효 범위 접근하려고 하는 함수의 생명 주기가 종료됐지만, 내부함수가 참조하고 있어서 그 함수에 접근할 수 있는 함수 참고: https://fullest-sway.me/blog/2017/11/13/js-closur.. [React.js] 노마드코더 Movie App 서비스 만들기 #1 Setup 1. 리액트 앱 생성 및 실행 생성하고 싶은 위치로 이동한 다음에 터미널에서 React app을 생성한다. npx create-react-app movie_app_practice 성공적으로 만들어졌으면 내가 생성한 리액트 폴더(movie_app_practice) 로 이동한 후, npm이나 yarn을 시작한다. cd movie_app_practice yarn start 성공한다면 다음과 같은 창이 뜬다. 2. 프로젝트 초기화 App.js를 초기화 하는 작업이다. 필요없는 것들은 빼고 우리가 필요한 상태로 만들어보자. - logo.svg -serviceWorker.js -index.css -App.test.js -App.css - 남아 있는 파일들을 확인해보고, 위에 있는 파일이 import가 되어있다면 찾.. [Javascript] Inside Javascript 책 단어 뽀개기 (chapter 3/8) 3.1 자바스크립트 기본 타입 타입(data type) 프로그램에서 다룰 수 있는 값의 종류 기본(원시) 타입 (Primitive type) 자바스크립트에서는 여러 가지 형태의 타입을 미리 정의하여 제공하고 있으며, 이것을 기본 타입이라고 한다 자바스크립트에서 기본 타입은 숫자, 문자열, 불린값을 비롯해 null과 undefined라는 타입이 있다 이들 타입의 특징은 그 자체가 하나의 값을 나타낸다. 즉 값을 그대로 할당 (기본 타입을 제외한 모든 값은 객체) - 종류: 숫자(number), 문자열(string), 불리언(boolean), 심볼(symbol, ECMAScript 6부터 제공) , undefined, null 모든 원시 타입은 값을 표현하는 리터럴 형식이 있다. 리터럴이란 코드에 직접 입력.. [Javascript] Inside Javascript 책 단어 뽀개기 (chapter 1/8) Chapter 1. 자바스크립트 기본 개요 1.1 소개 자바스크립트 웹 브라우저에서 동작하는 스크립트 언어 스크립트(Script) 언어 소스 코드를 컴파일(Compile)하지 않고도 실행할 수 있는 프로그래밍 언어 자바스크립트는 객체지향언어이다. 자바스크립트는 프로토타입 기반 언어이다. 자바스크립트는 웹페이지를 동적으로 변경해주는 언어이다. - ex) C언어, JAVA, 비주얼베이직 같은 경우 작성한 소스를 컴파일러를 통해 기계어 코드로 변경해야 사용자가 실행할수 있는 실행 파일이 얻어지는데 비해 스크립트 언어는 별도의 컴파일 없이 내장된 번역기에 의해 번역 되므로 바로 실행 할 수 있다. - 장점 : 소스를 작성한 후 컴파일 과정 없이 바로 실행하여 결과를 확인할 수 있다 - 단점 : 번역 과정을 거쳐.. [J-query] mousewheel이 크롬에서는 작동하지만 파이어폭스에서는 안되는 이유 크롬, 익스플로어, 사파리, 오페라는 mousewheel 이벤트를 지원하지만 파이어폭스는 DOMMouseScroll 이벤트를 지원한다. 그러므로 on() 메서드를 사용하여 둘 다 걸어주면 된다. 크롬에서 휠을 내리면 음수, 올리면 양수로 표현하곤 하는데 (익스도 동일) 재밌게도 파이어폭스는 반대이다 파이어폭스에서는 휠을 내리면 양수, 올리면 음수로 표현된다. 그러므로 우리는 이 부분을 신경써서 조건식을 사용해야 한다. 일단 이벤트가 어떻게 나오는지 살펴보자. 크롬 콘솔창에 찍었을 때 459번 라인에 WheelEvent가 나오고 이것을 펼치면 wheelDelta라는 속성을 찾을 수 있다. 파폭 콘솔창에는 DOMMouseScroll이 나오고 이것을 펼치면 detail라는 속성을 찾을 수 있다. 필자는 E.d.. [J-query] scroll, offset() 메소드 [Web] 사이트에 보안 연결할 수 없음, localhost에서 잘못된 응답을 전송했습니다. ERR_SSL_PROTOCOL_ERROR 문제. 크롬 빼고 다 됨 npm이나 yarn start를 하다보면 다음과 같은 창이 뜬다. 이 문제는 이러한 문제를 해결해보자. 1. SSL 캐쉬 지우기 제어판 > 네트워크 및 인터넷 > 네트워크 및 공유 센터 > 인터넷 옵션(우측 하단) 인터넷 옵션 > 내용(상단에 4번째 탭) > 인증서 > SSL 상태 지우기 클릭 > 구글 크롬 다시 시작 필자는 위와 같은 방법으로 캐시를 삭제해주면 아주 일시적으로만 가능하다가 금세 같은 페이지가 뜨곤 한다. 근데 웃긴게 크롬에서만 이런 문제가 생기고 다른 브라우저는 아무런 문제가 없다는 것이다. 그래서 코딩할 때는 파이어폭스를 이용한다. [React.js] React npm start 안될 때, 다시 초기화시켜보기 npm을 오랜만에 사용하면서 터미널에서 npm start 를 쳐도 사이트에 보안 연결할 수 없음, ERR_SSL_PROTOCOL_ERROR 위와 같이 뜨길래 다시 한번 공부를 하면서 내 머릿 속에 순서 없이 있는 것들을 정리하기 위해 이 글을 작성하게 되었다. 필자의 경우는 window를 사용하고 있기 때문에 cmd창에서 이행한다. 자 그럼 react를 사용하기 위한 환경을 설정해보자! 1. node.js, npm를 설치한다. npm은 node.js와 함께 설치됨. node.js는 nodejs.org에서 다운 받으면 된다. node.js와 npm이 설치가 되었는지 확인하기 위해서는 node. -v, npm -v와 같이 각각 치면 된다. 2. npx를 설치한다. npm install npx -g 3. re.. 이전 1 2 3 4 5 6 다음
