profile
Junior front-end developer
post-thumbnail

React - 파라미터와 쿼리 (동적 라우팅)

파라미터와 쿼리는 주소를 통해서 어떤 동적인 값을 읽어와야 할 때 사용한다.URL Parameter/profiles/sanghoid, username 처럼 정해진 특정 데이터를 조회할 때 많이 사용한다.Query/filter?type=book&sort_by=date 다

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

React - Life Cycle & 조건부 렌더링

1차 프로젝트를 진행 기간 중 세션 때 배웠던 Life Cycle에 대한 개념을 정리하고자 한다.constructorrendercomponentDidMount(fetch 완료)render(setState)componentDidUpdate (setState 되었기 때문에

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

React - Mock Data 활용법 (feat. fetch( ) 함수)

UI를 구현하다 보면 API가 나오기 전에 페이지가 먼저 나오는 경우가 많습니다. 프론트엔드 개발자는 API가 나오지 않더라도 mock data, 즉 가짜 데이터를 만들어서 미리 내가 만든 화면에서 데이터가 어떻게 나타나는지 테스트하며 개발을 진행할 수 있습니다. mo

2020년 9월 12일
·
0개의 댓글
post-thumbnail

React - Props & Event

props : properties(속성)단어 뜻 그대로 컴포넌트의 속성값입니다.props는 부모 컴포넌트로부터 전달 받은 데이터를 지니고 있는 객체입니다.props를 통해 부모 컴포넌트로부터 자식 컴포넌트에게 state의 상태값, event handler를 넘겨줄 수

2020년 9월 12일
·
0개의 댓글
post-thumbnail

React - State & Event

state : 상태단어 뜻 그대로 컴포넌트 내부에서 가지고 있는 컴포넌트의 상태값입니다.state는 화면에 보여줄 컴포넌트의 정보(상태)를 지니고 있는 객체입니다.state는 컴포넌트 내에서 정의하고 사용하며 얼마든지 데이터(객체)가 변경될 수 있습니다.위에서 stat

2020년 9월 12일
·
0개의 댓글
post-thumbnail

React - Router

SPA (Single Page Application) - 페이지가 한 개인 애플리케이션Westagram-frontend : login.html, main.html - 페이지 수만큼 html 파일이 존재리액트 프로젝트에서 .html 파일의 개수는? 1개 >>> SPA(S

2020년 9월 12일
·
0개의 댓글
post-thumbnail

React - Component & JSX

component : 재활용 가능한 UI 구성 단위ex. westagram 메인 페이지 \- 예를 들어, westagram main 페이지를 Component로 나눈다면, \- 크게 Nav 컴포넌트와 Main 컴포넌트, 그리고 Main 컴포넌트 안에는 Fee

2020년 9월 12일
·
0개의 댓글
post-thumbnail

React - CRA (Create-React-App)

Node.js 는 자바스크립트가 브라우저 밖(ex. 서버)에서도 동작하게 하는 환경을 의미한다. 리액트 애플리케이션은 웹 브라우저에서 실행되는 코드이므로 Node.js와 직접적인 연관은 없지만, 프로젝트를 개발하는 데 필요한 주요 도구들(ex. 바벨, 웹팩)이 Node

2020년 9월 12일
·
0개의 댓글
post-thumbnail

React - Why React? & What is React?

브라우저를 열고 사이트에 들어가면 보여지는 것 (UI: User Interface) 과 할 수 있는 것 (UX: User Experience) 이 굉장히 많다. 이러한 이유로 요새는 웹 페이지(Web Page)라는 단어보다 웹 애플리케이션이(Web Application

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