profile
쿼카를 사랑하는 프론트엔드 개발자입니다 :)
post-thumbnail

Typescript _ 초기 세팅 및 기본 문법

typescript 로컬 설치npm install typescript --save-devtypescript 컴파일러 설치글로벌 설치한 경우: tsc --init로컬 설치한 경우: npx tsc --init 👉 'tsconfig.json' 파일 생성됨브라우저는 .js

2021년 11월 1일
·
0개의 댓글
post-thumbnail

2차 프로젝트 회고 _ KOOTED

빠르고도 알찬 2주가 지나 벌써 2차 프로젝트가 끝났다!두 번째 프로젝트라서 그런지, 1차 프로젝트 때보다 더 완성도 있는 결과물을 만들고 싶어서 더 열정적이었던 것 같다. 특히 원티드는 내가 만들어보고 싶다고 제안했었던 사이트였고, 팀장까지 맡게되어 더 책임감을 가

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

Js _ 재귀함수

⏳ 문제 재귀를 사용하여 팩토리얼(factorial)을 구하는 함수를 구현해주세요. 팩토리얼이란 1에서부터 n까지의 정수를 모두 곱한것을 말합니다. 재귀함수란? 내부에서 자기 자신을 호출하는 함수 무한루프를 방지하기 위해 함수를 종료하는 조건식을 포함해야함 반복문보다

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

React _ Hook

이번주에 React Hook을 배웠다.여태까지 클래스형 컴포넌트를 사용했는데, hook을 이용하면 함수형을 사용할 수 있었다. 사실 왜 굳이 함수형을 써야 되는지도 잘 몰랐고, 이미 class형에 많이 익숙해져 있던 상태라 예제만 보고는 코드가 쉽게 눈에 들어오지 않았

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

1차 프로젝트 Git 사용기 및 Rebase

1차 프로젝트를 시작하면서 Git의 전체적인 사용법을 익히게 되었다.원래 commit, push밖에 할 줄 몰랐고 Git에 대한 두려움도 있었는데,브랜치에서 작업하고, PR도 해보고, master에 있는 내용을 merge도 해보면서 많이 익숙해진 것 같다.지금부터 1차

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

1차 프로젝트 회고 _ 이마트 PEACOCK 클론

드디어 1차 프로젝트가 끝이났다! 물론 리팩토링 해야할 것들이 산더미이지만, 1차 프로젝트 기간으로 잡은 2주가정말 쏜살같이 지나갔다. 내 삶에서 손에 꼽을 정도로 가장 바쁘고 알차게 보낸 2주였는데, 몸은 힘들었지만 정말 행복하고 보람찼던 것 같다.우리조가 클론할 사

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

React _ Pagination & Query Parameter

PEACOCK 프로젝트를 하면서 상품 리뷰 기능을 구현해야 했었다.상품 리뷰를 처음에는 3개만 보여주고, 더보기를 누를때 마다 3개씩 더 보여주는 방식이었다. 내가 맡은 기능은 아니었지만, 팀원이 이 부분을 어떻게 구현해야할지 고민해서 같이 고민해보다가 Paginati

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

React _ 동적 Routing

Routing은 다른 URL에 따라 다른 화면을 보여주는 것이다.저번 인스타그램 클론 프로젝트에서 react-router-DOM이라는 라이브러리를 사용하여 라우팅을 구현했었다. 로그인에서 메인으로 넘어가는 부분만 라우팅 해주면 됐었고, 페이지 주소가 바뀔 상황은 없었기

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

React _ LifeCycle과 조건부 렌더링

React를 사용하다 보면 상위 컴포넌트로부터 데이터를 잘 전달받았는지, 현재 어떤 데이터를 가지고 있는지 등을 확인 하기 위해서 console.log를 자주 쓰게 된다.componentDidMount에서 받아온 state값을 로그로 찍는다고 했을 때, 바로 값이 받아

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

React _ ComponentDidUpdate 무한 렌더링 이슈 해결

이마트 피코크 사이트를 만들면서 상품 리스트 불러오기, 장바구니, 상품 좋아요 누르기 등 다양한 기능들을 구현하고 있다. 내가 맡았던 카테고리별 상품 리스트 불러오기 페이지를 개발하던 중, 막히는 부분이 생겼다.KOREAN에 마우스를 올려놓으면 한국 음식 리스트를 불러

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

RESTful API

웹상에서 아용되는 여러 리소스를 HTTP URI로 표현하고, 그 리소스를 어떻게 할 것인지(불러올 것인지, 받아올 것인지 등) HTTP Method로 정의하는 방식이다.HTTP Method + Payload 형식으로 깔끔하게 표현 가능하다.PayloadHTTP requ

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

Instagram Clone Review

2주간 Instagram 로그인 페이지와 메인 페이지를 클론코딩 해보았다.먼저, 어떤 기능들을 구현했는지 간단하게 정리해보자.id에 @가 포함되고, pw가 5글자 이상인 유효성 검사를 통과하면 로그인 되어메인 페이지로 넘어가는 기능이다. 처음에는 id의 value를 가

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

React _ 서버와 통신하기

만들어두었던 인스타그램 Login 페이지를 이용하여, 백엔드로 Request를 보내서 회원가입과 로그인을 하는 연습을 했다.어떤 방식으로 통신이 이루어졌는지 간단한 흐름을 정리해보자.아이디와 패스워드를 입력하고 버튼을 클릭했을 때, 서버로 아이디와 패스워드 값을 전송하

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

인증 & 인가

웹사이트에서는 유저에게 해당하는 권한을 부여하기 위해 회원가입과 로그인 과정을 거친다. 인증과 인가는 프론트엔드와 백엔드가 유저 데이터를 주고 받기 위해 필수적으로 알아야 하는 개념이다.회원가입과 로그인하는 과정이다.유저의 아이디, 패스워드, 이메일 등을 이용해서 지금

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

React_Map 사용시 'Unique Key Prop' 오류

React를 사용하여 인스타그램 클론코딩을 하던 중, 콘솔창에 다음과 같은 에러가 뜨는 것을 발견하였다.정확히 어떤 부분에서 오류가 났는지도 파악하기 어렵고, 오류는 나지만 기능적인 부분에서 딱히 작동이 안되는 부분이 없어서 무시했다. 기능을 다 구현하고 나서 코드 리

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

React_State & Props

React를 사용하면 화면을 컴포넌트 단위로 구분해서 구현한다. Nav, Main, Footer로 나뉘어져 있을 것이고, 또 Main은 프로필 컴포넌트, 제품 설명 컴포넌트를 가지고 있을 것이다. 따라서 부모 컴포넌트 아래에 자식 컴포넌트가 속해 있는 구조가 되고, 부

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

Git _ Conflict(충돌)

여러 사람이 깃허브로 프로젝트를 관리하다 보면, 코드를 수정하는 과정에서 충돌이 발생할 수가 있고 이를 conflict가 발생했다고 한다. 꽤 자주 접할 수 있는데, 제대로 안다면 해결하고 간단히 끝낼 수 있지만, 모른다면 해결하는 과정이 상당히 두려울 것이다. 따라서

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

React 시작하기

React를 사용하는 이유 3세대 웹 요즘 웹은 예전처럼 단순하지 않다. 다양한 기능, 사용자의 눈길을 사로잡는 디자인, 다양한 기기에 따른 반응형의 구현, 그리고 넘쳐나는 데이터들에 맞는 웹을 만들다 보니, 이전보다 훨씬 동적이고 복잡해졌다. 따라서 웹을 개발할 때

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

HTTP 통신

웹사이트에서는 클라이언트와 서버가 통신을 한다. 서버에서 필요한 데이터를 가져오고, 클라이언트에서 변경할 데이터를 서버에 다시 보내준다. 데이터를 주고받기 위해서는 서로 어떤 형식으로 보내줄 것인지 약속을 정해야하는데, 그것이 바로 HTTP이다. HTTP(Hyper

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

Git & GitHub

개인이나 회사에서나 개발 프로젝트를 진행할 때 대부분 Git을 사용하는 것을 볼 수 있다. Git이 무엇이고, 왜 사용하고, Git을 사용하는 방법에 대해서 정리를 해보고자 한다. Git이란? Git은 VCS(Version Control System)중에 하나로, 로

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