profile
일일 개발 기록 블로그
post-thumbnail

Javascript async,await

![](

1일 전
·
0개의 댓글
post-thumbnail

Javascript 콜백함수

자바스크립트는 기본적으로 동기적인 아이이다, 즉 위에서 부터 한 줄 한 줄 읽어나간다는 말이다.호이스팅이 된 이후부터 하나하나 작성한 순서대로 코드가 실행된다는 의미 \- 호이스팅?  var, function선언 들이 자동적으로 제일 위로 올라가는 것을 말한다. as

1일 전
·
0개의 댓글
post-thumbnail

Javascript Promise 기초

JS에서 제공하는 비동기를 간편하게 처리할 수 있게 도와주는 오브젝트정해진 장시간의 기능을 수행하고 정상적으로 기능이 수행되었다면성공의 메세지와 함께 처리된 결과값 전달만약에 기능을 수행하다가 예상치 못한 문제가 발생하면 에러를 전달한다.state: 프로세스가 무거운

1일 전
·
0개의 댓글
post-thumbnail

Mobx로 간단한 입력노트 만들어보기

Mobx란 무엇인가? Redux와 같은 State관리 라이브러리의 일종이다. 기본적으로 객체 지향적인 성격을 띄며, Component와 State를 연결하는 보일러플레이트 코드들을 데코레이터(애노테이션)제공으로 깔끔하게 해결한다. cf) 보일러 플레이트란? 변경없이

2020년 11월 22일
·
0개의 댓글
post-thumbnail

React에서 환경 변수 사용하기

React는 기본적으로 MVC모델을 차용한다고 한다. MVC 모델이란M : model, V: view , C: controller 의 역할을 어플리케이션이 세부적으로 레이어를 나누어 한가지씩 역할을 갖도록 하여, 구조적으로 테스트 및 유지보수를 쉽게 할 수 있도록 하는

2020년 11월 22일
·
0개의 댓글
post-thumbnail

Fetch와 Axios 라이브러리 차이점

공부 배경 fetch("API",{method ...})이런 형태로 서버로 부터 데이터를 받아온 경우가 많았다. 그런데 가끔 검색을 하다보면 axios라는 것을 이용해서 서버로 부터 데이터를 받아오는 코드를 심심치 않게 볼 수 있었다. 그래서 이번에는 이 axios 라

2020년 11월 22일
·
0개의 댓글
post-thumbnail

마켓컬리(Market Kurly)클론코딩, 1차 프로젝트 후기

bro + kurly 라는 이름의 brokurly라는 이름으로 팀명을 정했습니다.한국의 신선 식품 전문 온라인 쇼핑몰인 Market Kurly를 클론 하는 프로젝트를 진행했습니다.마켓 컬리는 수도권 한정으로 당일 주문 시 다음 날 새벽 배송되는 샛별배송 배달 서비스를

2020년 11월 2일
·
0개의 댓글

React function component

리액트에는 두 가지 컴포넌트 클래스가 존재한다.그 두가지는 바로 class형과 함수형이다.오늘 함수형 컴포넌트를 학습하기 전에는 리액트의 작동 방식을 보다 쉽게이해할 수 있게 class형을 이용하여 컴포넌트를 만들어왔다.이번에 한 차례 클래스형을 이용하여 프로젝트로 진

2020년 10월 31일
·
0개의 댓글
post-thumbnail

React Route(loction, history, match)

location

2020년 10월 25일
·
1개의 댓글
post-thumbnail

Instagram 클론 프로젝트 후기

클론 코딩 동영상전 세계적으로 사용되고 있는 인스타그램 클론 코딩을 통해서 웹, 리액트의 기초적인 개념을 실전적으로 익혀보고자 하였다.git을 통한 협업으로 실무환경 경험HTTP 통신을 API, JSON을 활용하여 직접 경험SPA(Single Page Applicati

2020년 10월 18일
·
1개의 댓글

React 검색창 기능 구현 v1.0

검색창에 글씨를 썼을때 해당 글씨와 일치하는 카드 찾기검색창에 입력한 글씨를 포함하면 해당 카드만 출력API주소를 통해서 monsters에 데이터를 가지고 왔습니다.\-> 지금 fetch함수에 method로 get을 써주었는데 사실 fetch함수의 method defa

2020년 10월 18일
·
0개의 댓글

리액트의 Lifecycle(기초)

리뷰 배경 어느정도 리액트를 이용한 단순 화면 구현은 가능해졌다. 그러나 리액트역시 console.log를 통하여 확인해주어야 할 부분이 많고, 상황마다 적절하게 구현되어야 할 다양한 함수들이 존재한다. 이를 효과적으로 사용하기위하여 필요한 것이 리액트의 Lifecyc

2020년 10월 13일
·
0개의 댓글

React의 ref (입문수준)

사용배경 웹사이트를 만들다보면 가장 기본적으로 구현해야할 사항이 있다. 무언가 정보를 입력할 공간이 바로 '그것'이다. 나는 위와같은 기능을 자바스크립트에서 DOM요소를 활용하여 이미 구현을 해본 경험이있기는 하지만 React를 이용해서 만드는 것은 이번이 처음이다.

2020년 10월 11일
·
0개의 댓글

React 댓글 추가/삭제 기능 구현 v1.0

댓글 추가 삭제 기능 구현 단계별 계획 1단계 : 빈 댓글 컴포넌트 구현 2단계 : 1단계 빈 댓글에 들어갈 내용 데이터 저장하기 3단계 : 2단계에서 저장한 데이터 댓글창에 표시 실행 1단계 실행 1. 메인 컴포넌트안에 각각의 comment를 넣어줄 co

2020년 10월 11일
·
0개의 댓글

React 시작하기 (정의 및 특징)

1. React란? 등장 배경 점점 규모가 커지는 웹 어플리케이션의 발전에따라 유지보수 역시 점점 어려워졌는데, 이러한 문제를 해결하기위하여 다양한 라이브러리가 등장하게 되었다. 가장 많이 사용되는 것들에는 Angular, Vue, React이다. 정의 React는

2020년 10월 7일
·
0개의 댓글

javascript 중요한 배열 APIs

2020년 10월 2일
·
0개의 댓글

javascript target 기능구현 v1.0.0

목표 구현 기능 가장 상단 바의 프로필 사진을 누르면 기능 박스가 보이고, 기능 박스 이외의 영역을 클릭할 때 기능 박스가 사라지는 기능 구현하기. 처음에 본 기능을 구현하고자 했을 때는 단순하게 프로필 박스를 클릭할 때만 기능 구현이 가능했다. 사실 당시에는 ev

2020년 9월 30일
·
0개의 댓글

웹 서비스의 역사와 발전

인터넷과 웹이 어떠한 형태로 출현하였는지?1세대, 2세대, 3세대 웹의 발전과 각각의 특징이 무엇인지?Frontend, Backend 가 언제부터 나누어지었고 각각의 역할이 무엇인지?현대 개발팀을 구성하는 여러 직군들이 어떻게 일을 하는지?인터넷은 1960년대에 등장한

2020년 9월 28일
·
0개의 댓글

javascript 버튼만들기 v1.1 (문제점 분석)

버튼만들기 버전 v1.0.0저번 포스팅에서 버튼을 한 번 만들어보았다. 크게 보았을 때 for문을 이용한 버튼 만들기 구현이었는데,기능구현에는 이상이 없었다. 그러나 이 기능은 새로운 버튼을 생성하는 기능과 섞어서 사용할 때 큰 문제가 발생하였다. 어떤 문제인지 지금

2020년 9월 27일
·
0개의 댓글

javascript 버튼만들기 V1.0

동적인 움직임을 구현하는데 EventLisner의 기능 구현은 필수이다.그중에서도 각각의 버튼에대한 기능 구현이 정말 중요한데, 인스타의 하트버튼 활성화 기능을 시험하다가, 댓글 한 개의 버튼을 클릭했을때 그 전체 페이지의 '사랑의 불빛'을 받는 불상사를 경험하게 되었

2020년 9월 25일
·
0개의 댓글