profile
Keep on my way ! :)

Javascript의 scope와 Closure

Javascript의 scope란? 스코프란 현재 접근할 수 있는 변수들의 범위를 뜻한다, 현재 위치에서 볼 수 있는 변수들의 범위. 어떠한 변수가 스코프 안에 선언되었으면 해당 스코프 안에서는 변수에 접근해서 읽거나, 쓸 수 있고 스코프 밖에서는 해당 변수에 접근할 수 없다. 변수는 전역 또는 코드 블록(if, for, while, try/catch...

2019년 12월 26일
·
0개의 댓글

SPA / Client Side Rendering 그리고 Server Side Rendering

SPA와 클라이언트 사이드 렌더링 서버사이드 렌더링을 정리해보았다. SPA : Single Page Application 최초 한번 페이지 전체를 로딩한 이후 부터는 데이터만 변경하여 사용할 수 있는 웹 어플리케이션 (하나의 html파일로만 동작함, 리액트 프로젝트 파일도 보면 다 html파일 하나로 작업) SPA는 클라이언트사이드렌더링 방식이다! Re...

2019년 12월 18일
·
0개의 댓글

TIL - .gitignore 와 yarn.lock

노마드코더의 강의를 다시 들으려고 하면서 repository를 새로 만들게 되었다. 공부한 내용을 올리려고 하고 최초 커밋을 했는데 yarn.lock 파일에 보안취약문제가 있다고 alert를 받았다. image.png serialize-javascript 파일을 수정하는 작업을 진행했다. version을 2.1.1로 수정하고 다시 git에 커밋/푸쉬를...

2019년 12월 15일
·
3개의 댓글

TIL - What's new in ES6

ES6에 새롭게 추가된 문법들 christopher-robin-ebbinghaus-pgSkeh0yl8o-unsplash.jpg ES5에서 ES6로 넘어오면서 새롭게 추가된 문법 중 우리에게 많은 영향을 주는 것들 위주로 정리해보았다. 1. 기본함수 매개변수(default function parameter)의 사용 ES6에서는 기본 함수 매개변수를 ...

2019년 12월 4일
·
0개의 댓글

TIL - 리액트의 특징, 장점 및 Lifecycle

리액트의 특징 및 LifeCycle을 알아보자 1. 리액트란 무엇인가 ? SPA(Single Page Application) 가상 DOM을 활용하여 부분적인 렌더링을 하는 자바스크립트 라이브러리 2. 리액트의 특징 (1) 화면 view단을 구현하기 위한 최소단위로 재사용가능한 component를 사용 (2) component를 조립하여 완성된...

2019년 11월 14일
·
0개의 댓글

TIL - 20191114

1. 함수의 표현방식 함수의 표현방식은 두가지로 나뉘어진다. 함수 선언식 - Function Declarations 함수 표현식 - Fucntion Expressions 두 가지 표현방식에 대해서 알아 보겠다. 1) 함수선언식 일반적으로 가장 많이 쓰는 함수의 선언과 비슷한 형식 함수선언식은 함수의 호이스팅이 적용된다. 2) 함수표현식 자바스크립트...

2019년 11월 14일
·
0개의 댓글

TIL - 이벤트 버블링과 캡처링

이벤트 캡처링 가장 하위에 있는 태그에 event 가 발생했을 때 제일 먼저 html 에 장착되어있는 event handler 가 실행되고, 그다음 body -> fildeset -> input (btn) 태그 방향으로 이벤트 핸들러가 호출되면 이벤트 캡처링 (부모에 있는 event handler -> 자식 event handler 방향으로 흘러가는 것...

2019년 10월 29일
·
0개의 댓글

TIL [Typescript] Nomad 강의내용정리(6강~12강)

Interface는 typescript에서 쓰이는 개념이지만, js에서는 해당 내용을 컴파일 하지 않는다. Interface와 비슷한 기능을 하지만, js에서도 컴파일 되는 것은 바로 Class! : Interface 가 typescript 측면에서는 더 안전하다, 하지만 리액트나 node, express와 같은 것을 사용할 때는 interface가 아닌...

2019년 10월 4일
·
0개의 댓글

TIL [Typescript] Nomad 강의내용정리(1~5강)

typescript를 사용하면서 콘솔창에 있는 내용이 vs terminal 을 이용해서 보이기 하기 위해서는 니콜라스 초기세팅 1,2강 강의 참고하기 현재 tsc 명령어를 yarn start 로 변경해서 yarn start 로 ts 를 js 로 컴파일 할 때해당 명령어 사용가능 Typescript 타입스크립트를 사용해서 함수를 작성하면 함수 작성시 ...

2019년 10월 3일
·
0개의 댓글

TIL - 생활코딩 객체지향프로그래밍 강의내용 정리

비동기처리 비동기처리는 JAVASCRIPT 에서 AJAX 에서 쓸 수 있다. 여기서 A 는 Asynchronous 개발자도구의 네트워크탭은 웹서버와 웹브라우저의 통신을 보여준다. Ajax…….. Ajax를 제어할 때 우리가 비동기적으로 제어한다고 한다. ajax를 통해서 서버와 웹브라우저가 내부적으로 통신을 할 수 있다. 내가 다른 작업을 하고 있...

2019년 9월 22일
·
0개의 댓글

TIL - Ajax, fetch 함수와 API

Ajax Asynchronous JavaScript and XML의 약자 Ajax는 빠르게 동작하는 동적인 웹페이지를 만들기 위해 쓰이는 개발 기법중 하나! Ajax는 웹페이지 전체를 다시 로딩하지 않고, 웹페이지의 일부분만을 갱신할 수 있음 ! Ajax는 JSON, XML, HTML, 텍스트 파일 등 다양한 형태의 데이터를 주고 받을 수 있음. 이러한...

2019년 9월 21일
·
0개의 댓글

TIL - 자료구조 Session 0918

자료구조 : 자료구조란 데이터에 편리하게 접근하고, 변경하기 위해서 데이터를 저장하거나 조직하는 방법을 말합니다. 모든 목적에 맞는 자료구조는 없습니다. 자료구조의 분류 자료구조는 현재 사진 속에 담긴 것 보다 종류가 훨씬 많다. image.png 제일 많이 쓰는 자료구조의 종류 배열(List) 인덱스가 있기때문에 randam access가 가능 (아...

2019년 9월 18일
·
0개의 댓글

TIL내용 - OOP crach course - ES6 : Classes 강의정리

class 를 활용해서 객체를 생성하는 것은 생성자함수를 만드는 것과 비슷하다. 그대신 class 생성자함수이름 { constructor(프로퍼티, 프로퍼티, 프로퍼티) { 프로퍼티 = 값; 프로퍼티 = 값, 프로퍼티 = 값 } method를 추가하고 싶다면 constructor 닫힌 후에 해당 함수를 정의 해준다. 그러면 class 생...

2019년 9월 17일
·
0개의 댓글

TIL - React ) 관련 문법정리

리액트 관련 문법정리 JSX Self-Closing Tags HTML 은 두가지 태그가 있다. 시작태그와 끝태그 그런데 img / input 같은 태그들은 하나의 태그만 가짐 이런 태그들은 self-closing tag라고 한다. self-closing tag를 사용할 때 HTML에서는 슬래쉬를 붙여도 되고 안붙여도 된다 근데 !JSX에서는 slash를...

2019년 9월 8일
·
0개의 댓글

TIL - CSS > Flexbox

Flexbox -> Flexbox는 해당 flex container에 묶인 아이템들의 공간 배분과 정렬을 수행하기 좋은 CSS의 속성 중 하나 flexbox의 두 개의 축 : flexbox를 다루기 위해서는 두개의 축을 알아야 함 row: 가로 줄 행(인라인방향으로 행따라 아이템이 정렬) column : 세로 줄 열 (페이지상단에서 하단으로 열따라 아이...

2019년 9월 8일
·
0개의 댓글

0908 프론트엔드 Meet Up S2 : Front-End Programmer의 "데이터탐방기"

S2 발표자 : 김우현님 (spoqa) 프론트엔드 개발자로서 데이터 활용사례 공유 본인이 직접 경험하신 데이터 탐방기를 공유해주심 Spoqa는 무슨 회사인가? : dodo point 라고 해서 국내 1위 태블릿 기반 고객관리하는 서비스 제공하는 회사 휴대폰 번호로만 포인트 적립가능 / 얻은 데이터를 가지고 업주들은 마케팅프로모션을 함 PM / Prog...

2019년 9월 8일
·
0개의 댓글

0908 프론트엔드 Meet Up S3. 웹마스터에서 웹퍼블리셔 그리고 프론트엔드개발자로

발표자: 김인숙님 (가비아) 프론트엔드 개발자가 되기까지의 2번의 직무전환 경험 : 웹마스터 -> 웹 퍼블리셔 -> 프론트엔드 개발자 (18년의 경력 중 2번의 직군 전환 ) 웹마스터란 ? : 웹 서버를 관리하면서 프로그래밍도 하고 동시에 디자인 작업까지 맡아서 하는 직군, 풀스택 개발자와 좀 비슷하다고 보면 되는데 다양한 업무를 수행하셨어야 함 웹...

2019년 9월 8일
·
0개의 댓글

0908 프론트엔드 Meet Up S1 : MediaQuery, Breakpoint 내용 정리

발표자: 김수진님(이롭게) RWD : Reponsive Web Design 반응형 웹 디자인 : 반응형 웹디자인은 flexible Image / Fluid Grid / Media Query 세가지로 구현 가능하며, 오늘의 주제는 미디어 쿠ㅓ리~! Media Query란 ? : Media (장치...) + Query (질문v ) -> 여러가지 ...

2019년 9월 8일
·
0개의 댓글

TIL - Array Methods

Array Methods Arrow function을 가장 많이 사용하는 경우 callback 함수로 사용할 때 callback 함수 : 인자로 전달되는 함수 Callback 함수 이 함수에서 map 이라는 method를 쓰면 다음에 오는 콜백함수의 obj는 매개변수 인자자리에는 모든지 다 올 수 있다. Array.map() map method는...

2019년 9월 1일
·
0개의 댓글

TIL - 프로젝트 Git사용법 정리

프론트엔드 프로젝트 중 해야할 것 ! 순서대로 (소스코드 초기세팅 후 깃 클론, 브랜치생성, push, pull 하는 법) 소스코드 초기세팅 create-react-app 기반, sass, react-router-dom, eslint, prettier 등 설치 디렉토리 구조 세팅(ex. pages, components) 초기 설정 (ex. routes....

2019년 9월 1일
·
0개의 댓글