profile
Web Developer / Composer

🤝airpnp - Retrospect (1)

🤝 airpnp 에어비앤비 클론 프로젝트 회고 서비스 소개 특정 지역의 내가 원하는 재능을 가진 사람의 시간을 빌리는 서비스 팀원 FE: 길도연, 김혜리, 이나은 BE: 이주명, 김은혜, 염기욱 Frontend 개발 초기 세팅은 CRA를 이용하여 직접

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

React - 네이버 맵 API 사용

airpnp 프로젝트를 진행하면서 호스트 리스트 페이지 및 호스트 상세 페이지에서 맵을 사용할 필요가 있었다. 과거 바닐라JS를 사용해서 프로젝트를 진행할 때 네이버 지도를 사용한 경험이 있어서 다른 지도 API보다 우선적으로 네이버 지도를 사용하게 되었다. 초기

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

React Datepicker 사용기

노가다의 서막 airpnp 프로젝트 진행중 Nav.js 검색바와 호스트 상세 페이지에 사용되어질 Datepicker를 제작할 필요가 있었다. 물론 처음부터 다 만들 수도 있었지만 2주라는 짧은 시간 내에 지도 API와 등록페이지까지 다 만들기는 시간이 부족하다는 판단

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

airpnp 프로젝트 중간 점검

airpnp는 airbnb 클론 프로젝트이며 숙소 예약 컨셉에서 인력을 빌리는 컨셉으로 바꿔 프로젝트를 진행하였다. 프론트엔드에서는 React를 사용하였으며, styled-components, react-router, react-datepicker, Naver Map

2021년 12월 19일
·
1개의 댓글

🩺🍪 Dr.Tart - Retrospect (3)

프로젝트의 끝 짧았던 2주가 끝나고 프로젝트 발표도 큰 일 없이 끝낼 수 있었다. 프로젝트가 끝남에 있어서 아쉬운 점이 분명 있었지만, 후에 리팩토링도 하고 새로운 기능도 추가할 생각이 있어서 마냥 아쉽지만은 않다. 이 글에서는 내가 얻어간 것에 대해서 작성하려고

2021년 12월 19일
·
2개의 댓글

🩺🍪 Dr.Tart - Retrospect (2)

전반적인 개요를 작성했으니... 이제 프로젝트를 진행하며 어려웠던 점을 남겨볼까 한다. 조건부 렌더링을 통한 Order 페이지 만들기 클론할 기존의 사이트의 장바구니와 결제 페이지의 레이아웃이 똑 닮았다. 같은 레이아웃 같은 CSS를 위해 파일을 두개씩 더 만들고

2021년 12월 19일
·
1개의 댓글

백준 9375번 "패션왕 신혜빈"

백준 9375번 패션왕 신혜빈각 종류의 의상을 입는 경우의 수를 곱해주면 된다.즉, 해당 종류의 의상 수 + 1(해당 종류를 입지 않는 경우)를 의상의 종류 모두 곱해준 뒤,1을 빼주면 된다(알몸인 경우 제외를 위해 -1을 해준다.).

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

🩺🍪 Dr.Tart - Retrospect (1)

닥터 타르트 프로젝트 결산 회고

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

React - react-router(v6)

!!! 본 포스트는 react-router v6에 대한 포스팅입니다.라우팅이란 각기 다른 경로(url)에 따라 다른 화면(View)를 보여주는 것이다.다만 리액트는 전반적인 프론트엔드에 관련된 기능을 제공하는 프레임워크(Angular.js 등...)와 달리 SPA를 위

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

🩺🍪 Dr.Tart - 1차 프로젝트 1st Sprint 회고

Dr.Tart 프로젝트는 닥터자르트 홈페이지를 클론코딩하는 프로젝트이다. 다만 화장품이 아닌 디저트가 나오도록... 프로젝트 시작 11월 29일 월요일부터 프로젝트가 시작되었다. 우리팀은 닥터자르트 홈페이지를 클론코딩할 예정이었고, 그리고 오늘 2주간의 1차 프로

2021년 12월 5일
·
0개의 댓글

React Hooks - useRef

useRef는 current 프로터피로 전달된 인자(initialValue)로 초기화된 변경 가능한 ref객체를 반환합니다. &nbsp 반환된 객체는 컴포넌트의 전 생애주기를 통틀어 유지될 것입니다. &nbsp 본질적으로 useRef는 current 프로퍼티에 변경 가능한 값을 담고있는 상자와 같습니다. &nbsp 리액트 공식문서 useRef? 리액트는...

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

RESTful API

REST(Representational State Transfer)는 월드 와이드 웹과 같은 분산 하이퍼미디어 시스템을 위한 소프트웨어 아키텍처의 한 형식이다.위키백과REST는 프로토콜이나 표준이 아닌 아키텍처 원칙세트이다.어떤 요청이 어디에서 오는지와 상관없이 동일한

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

React Hooks - useEffect

Side Effect Side Effect. 부작용, 부수효과. 이름만 들어서는 약간 부정적인 의미를 가진 것 같기도 하다. 하지만 함수 컴포넌트에서 Side Effect는 단순히 함수 실행시 함수 외부의 상태를 변경하는 연산을 뜻하며, 렌더링외의 함수 외부 환경에

2021년 11월 25일
·
0개의 댓글

React Hooks - useState

리액트에서 데이터를 UI에 반영하기 위해서는 데이터를 상태값으로 저장하고 유지해야 한다. 이 후 상태값이 변화하면 리액트는 이를 인식하고 UI를 그에 맞게 리렌더링한다. 리액트 16.8

2021년 11월 24일
·
0개의 댓글

React Hooks - 개요

기존의 리액트는 컴포넌트를 생성할 때 클래스를 이용했다.다만 클래스형 컴포넌트는 꽤나 높은 자바스크립트 이해도를 요구하여 진입 장벽이 높았으며코드를 길어지기 때문에 코드의 간소화도 힘들었다.이런 단점을 인지한 페이스북 리액트 팀에서는 이를 개선하고자 React.js v

2021년 11월 24일
·
0개의 댓글

프로그래머스 Level1 '숫자 문자열과 영단어'

문제 백준 번 풀이 Python 코드

2021년 11월 24일
·
0개의 댓글

React - map()을 이용한 컴포넌트 표현

지난 번에 알아보았던 리액트의 강점 중 하나는 컴포넌트 기반의 개발이었다.리액트에선 속성만 바뀐 채 여러번 등장하는 컴포넌트를 다시 재사용하기 편하다.그럼 컴포넌트를 이용해서 반복되는 컴포넌트를 표현해보자.근데 이런식으로 일일이 컴포넌트 추가하고 props지정해주고 하

2021년 11월 19일
·
0개의 댓글

JS ES6 - Polyfill

Polyfill : 웹 개발에서 기능을 지원하지 않는 웹 브라우저 상의 기능을 구현하는 코드를 뜻한다. 폴리필? 어떠한 언어든 메이저 업데이트가 발생하는 법이고, 업데이트에 따라 기능들이 추가된다. 그 과정에서 기존에 지원하던 표준들을 배제하는 경우는 흔히 있다.

2021년 11월 18일
·
0개의 댓글

React - 개요

리액트는 페이스북에서 개발하고 관리하는 UI 라이브러리다.React는 javascript를 이용하여 만들어진 프론트엔드 라이브러리이며, 페이스북에서 유지보수하여 계속해서 새로운 기능들이 업데이트 되어지고 있다.또한 현재 많은 기업에서 사용되는 만큼 거대한 생태계를 자랑

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

기본적인 Git 명령어

깃(Git)은 컴퓨터 파일의 변경사항을 추적하고 여러 명의 사용자들 간에 해당 파일들의 작업을 조율하기 위한 분산 버전관리 시스템이다.깃에 커밋을 남기기 위해선 스테이징을 해야 한다.add는 특정 파일 혹은 디렉토리를 스테이징 할 때 사용되는 명령어이다.git add를

2021년 11월 13일
·
0개의 댓글