post-thumbnail

프론트엔드에서의 에러핸들링

하드웨어의 고장 또는 소프트웨어가 본래의 동작을 할 수 없는 상태소프트웨어의 오류는 컴파일 오류와 런타임 오류로 나뉩니다.컴파일 오류 : 코드가 컴파일 될 때 컴파일러가 해석하지 못해서 발생런타임 오류 : 프로그램이 동작할 때 발견할 수 있는 에러자바스크립트에서는 런타

2021년 9월 15일
·
0개의 댓글

typescript & styled-components 세팅

인터페이스로 분리하여 타입지정하는것 뿐 이외에 사용법은 동일

2021년 9월 7일
·
0개의 댓글
post-thumbnail

Flux 패턴

MVC 패턴은 데이터를 다루는 로직 ( Controller ), 데이터 ( Model ), 사용자 인터페이스 ( View )로 나누어 애플리케이션을 구현하는 하나의 개발 모델이다.Controller는 Model의 데이터를 조회하거나 업데이트 하는 역할을 하며, Mod

2021년 9월 2일
·
0개의 댓글

표현식과 문

컴퓨터 공학 전반에서 사용되는 용어에 대한 정확한 이해로 원활한 커뮤니케이션을 가능하게 하자식 ( 표현식,expression)이 평가되어 생성된 결과를 말한다.사람이 이해할수 있는 문자 또는 약속된 기호를 사용해 값을 생성하는 표기법ex. 100, true, unde

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

이벤트 버블링, 캡처

특정 버튼을 클릭했을 때, DOM이 로드되었을 때 등의 어떠한 사건을 의미합니다.브라우저는 이벤트를 감지할 수 있으며 이를 통해 사용자와 웹페이지가 상호 작용이 가능합니다.이벤트 핸들러를 통해 이벤트 발생 시 원하는 함수에 연결하여 실행시킬 수 있습니다.어떠한 이벤트

2021년 8월 31일
·
0개의 댓글

실행 컨텍스트 (Execution Context)

실행 컨텍스트 - 식별자를 등록하고 관리하는 스코프와 코드 실행 순서 관리를 구현한 내부 매커니즘으로 , 모든 코드는 실행 컨텍스트를 통해 실행되고 관리된다.전역 코드 : 전역에 존재하는 소스코드를 말한다. 전역에 정의된 함수, 클래 스 등의 내

2021년 8월 30일
·
0개의 댓글

클로저

한 중첩함수가 외부함수의 식별자를 참조하고 있고, 중첩함수가 외부함수보다 더 오래 살아 있는 경우,(생명 주기가 더 긴 경우) 중첩 함수는 이미 생명주기가 종료된 외부함수의 식별자를 참조 할 수 있다. 이러한 중첩 함수를 클로저라 부른다.이러한 클로저는 본인의 상위 스

2021년 8월 23일
·
0개의 댓글

제네릭

제네릭은 재사용성이 높은 컴포넌트를 만들 때 자주 활용되는 특징입니다.특히, 한가지 타입보다 여러 가지 타입에서 동작하는 컴포넌트를 생성하는데 사용됩니다.제네릭이란 타입을 마치 함수의 파라미터처럼 사용하는 것을 의미합니다.여러가지 타입을 허용하고 싶을 때,\*\*\*

2021년 8월 21일
·
0개의 댓글

SPA와 MPA

SPA (Single Page Application)하나의 HTML 파일을 기반으로 자바스크립트를 이용해 동적으로 화면의 컨텐츠를 바꾸는 방식의 웹 애플리케이션이다.MPA (Multiple Page Application)사용자가 페이지를 요청할 때마다, 웹서버가 요청한

2021년 8월 19일
·
0개의 댓글
post-thumbnail

더 나은 UX를 위한 Skeleton UI

스켈레톤 UI는 실제 데이터가 화면에 로딩되기 전 사용자에게 화면이 로드 중임을 나타내기 위해 사용하는 UI입니다.스켈레톤 로딩 화면은 기본적으로 원본 레이아웃을 기준으로 제작되고 페이지가 로딩되고 사용 가능해질 때 실제 콘텐츠와 유사한 모양으로 페이지를 보여줍니다.

2021년 8월 18일
·
0개의 댓글
post-thumbnail

Styled-components

Javascript 코드 내에서 일반 CSS로 구성요소의 스타일을 지정할 수 있다.기존의 React Component 스타일링 방식은 style 속성에 객체를 전달하거나 별도의 css 파일을 import 하는 방식으로 사용해왔습니다.styled-components는

2021년 8월 17일
·
0개의 댓글
post-thumbnail

공공데이터 API CORS 이슈 해결을 위해 직접 프록시 서버 구축하기

리액트를 사용한 프로젝트에서 공공데이터 API를 사용하려고 했지만 CORS 이슈로 인하여 클라이언트에서 바로 접근할 수 없었다. CORS는 브라우저에 관련된 정책이기 때문에 서버 간 통신을 할 때는 이 정책이 적용되지 않기 때문에 프록시 서버를 Express를 사용하여

2021년 8월 9일
·
2개의 댓글
post-thumbnail

리액트 프로젝트에 폰트 적용하기

index.html head 태그 사이에 사용하고 싶은 폰트 주소를 넣어준다.index.htmlindex.css하지만 매번 import 해오기 때문에 이 방법은 뷰를 그려주는 속도가 느리다.필요한 폰트를 다운로드 후적절한 위치에 파일들을 넣어놓고index.css 파일에

2021년 7월 25일
·
1개의 댓글

알고리즘 - 크레인 인형뽑기 게임 - Javascript

https://programmers.co.kr/learn/courses/30/lessons/64061

2021년 7월 7일
·
0개의 댓글

React Hooks

useEffect는 리액트 컴포넌트가 렌더링될 때마다 특정 작업을 수행하도록 설정할 수 있는 Hook입니다. 기본적으로 렌더링되고 난 직후마다 실행되며, 두 번째 파라미터 배열에 무엇을 넣는지에 따라 실행되는 조건이 달라집니다.useEffect에서 설정한 함수를 컴포넌

2021년 7월 6일
·
0개의 댓글
post-thumbnail

Date 객체

Date, UTC, KST DATE 표준 빌트인 객체인 Date는 날짜와 시간 (연, 월, 일, 시, 분, 초, 밀리초)를 위한 메서드를 제공하는 빌트인 객체이면서 생성자 함수다. UTC UTC는 국제 표준시를 말한다. UTC는 GMT로 불리기도 하며 UTC와 GMT

2021년 6월 29일
·
0개의 댓글
post-thumbnail

7번째 데이터 타입 Symbol

Symbol은 ES6에서 도입된 7번재 데이터 타입으로 변경 불가능한 원시 타입의 값입니다. 다른 값과 중복되지 않는 유일무이한 값이며, 주로 이름의 충돌 위험이 없는 유일한 프로퍼티 키를 만들기 위해 사용합니다.Symbol 값은 Symbol 함수를 호출하여 생성해야

2021년 6월 29일
·
0개의 댓글
post-thumbnail

원시값과 객체의 비교

자바스크립트에서는 데이터 타입을 크게 원시타입 (primitive type)과 객체타입 ( object/reference type)으로 구분할 수 있습니다.데이터 타입을 원시타입과 객체타입으로 구분하는 이유는 뭘까요?원시 타입과 객체 타입은 크게 세가지 측면에서 다릅니

2021년 6월 10일
·
0개의 댓글
post-thumbnail

변수 선언의 실행 시점과 호이스팅

예제에서 변수 선언문보다 변수를 참조하는 코드가 앞에 있습니다.자바스크립트 코드는 인터프리터에 의해 한 줄씩 순차적으로 실행되므로 console.log(score);가 가장 먼저 실행되고 순차적으로 다음 줄에 있는 코드를 실행합니다. 따라서 console.log(sco

2021년 6월 8일
·
0개의 댓글
post-thumbnail

제너레이터와 async/await

ES6에서 도입된 제너레이터는 코드블록의 실행을 일시 중지했다가 필요한 시점에 재개할 수 있는 특수한 함수입니다.제너레이터와 일반 함수의 차이는 다음과 같습니다.제너레이터 함수는 함수호출자에게 함수 실행의 제어권을 양도 할 수 있다.일반 함수를 호출하면 제어권이 함수에

2021년 6월 6일
·
0개의 댓글