chobyeonggyu03 님의 블로그

7월 10일까지 프로젝트 x

7월 10일까지 진행중인 프로젝트 완성해야하는데 일정이 촉박해서 해당 프로젝트가 끝나면 밀렷던 블로그 정리하도록 하겠습니다.

● 이번 글에서는 React Native의 기본 컴포넌트들과 간단히 style지정방법에 대해 정리해보고자 한다.  View 컴포넌트는  Javascript에서 태그와 비슷한 개념으로 다른 요소들을 감싸주는 컨테이너 역할을 하는 컴포넌트이다. 또한, 이름 그대로 화면에 View 컴포넌트는 안에 있는 요소들 보여주며, 주로 레이아웃을 구성하는데 많이 이용된다   View 컴포넌트의 특징컨테이너 역할 : View 컴포넌트는 다른 컴포넌트들을 감싸는 컨테이너 역할을 해줌 중첩 가능 : View 컴포넌트는 여러 개 중복되어 사용할 수 있음 레이아웃 구성의 편의성 :  View 컴포넌트는 Flexbox 레이아웃 시스템을 사용하여 내부 컴포넌트들의 정렬과 배치를 관리하므로 비교적 쉽게 레이아웃 디자인을 할 수 있음..

이번 글에서는 React Native에서 처음 프로젝트를 생성할 때 초기 파일 구조에 대해 정리해보고자 한다. 프로젝트 생성하기 VScode에 npx react-native init --version [버전] [파일멸] 을 입력하여 프로젝트 생성하기 -> 버전에 따라 어떤 버전은 Android SDK버전과 호환이 안될 수도 있고 자동으로 app.js가 포함된 파일들이 생성되지 않을 수도 있음 가장 좋은건 공식사이트에 들어가서 프로젝트 생성 코드를 그대로 치는 것--> npx @react-native-community/cli@latest init [파일명]      프로젝트를 정상적으로 만들었다면 위의 사진처럼 app.tsx나 app.js파일이 섞인 프로젝트가 생성되어 있어야 함(app.js와 app.ts..

이번글에서는 공모전에 나가게 되는 프로젝트의 와이어프레임이 완성되어 해당 프로젝트의 와이어프레임에 대해 정리해보고자 한다.               [로그인 화면] API만을 사용한 로그인화면을 구현함     [메인 화면] 바로 장소를 검색하거나 추천장소와 주변 축제정보를 볼 수 있는 페이지를 구현함      [검색 화면] 하단 아이콘을 누르거나 메인화면에서 검색하기를 누르면 원하는 어르신들의 숙소를 검색할 수 있음     [숙소 정보 화면] 원하는 숙소를 누르면 해당 숙소에 대한 정보와 무료로 제공할 수 있는 서비스에 대한 아이콘을 같이 띄워주며 후기와 지도화면으로 넘어가 자세한 정보를 조회할 수 있고, 이 화면을 통해 해당 숙소를 예약할 수 잇음     [지도 보기화면 - 카카오 맵] 숙소 정보 화면..

이번글에서는 React Native을 본격적으로 공부하기에 앞서, React Native를 공부하는 데에 도움이 되는 기본 React 개념들에 대해 정리해보고자 한다.  State란?● State는 React 기본문법으로, 컴포넌트 내에서 렌더링 되는 데이터를 저장하고 관리하는 Javscript언어의 객체이다.   State의 특징캡슐화 : state는 일반적으로 해당 컴포넌트 내에서 관리되기에, 컴포넌트 외부에서 직접적으로 접근할 수 없어  캡슐화하여 렌더링 할 데이터를 관리하는데 유용하다. 데이터 유지 보수 및 관리 편의성 : state를 사용하게 되면 따로 렌더이할 데이터들을 객체로 묶어 관리할 수 있게 되며, 직접 텍스트를 하나하나 렌더링 하는 것보다 한번 필터링된 데이터를 선별적으로 출력하는 것..

이번에는 Javascript의  ES6버전에서 추가되어 최근에 JS에서 자주 사용되는 Rest 연산자와 Spread 연산자에 대해 한번 정리해보고자 한다,  Rest 연산자(' . . . ')란?● Rest 연산자는 2015년에 업데이트된 Javascript 버전인 ES6에서 새로 추가된 연산자로 이름처럼 남은 매개변수들을 하나의 배열로 묶어주는 연산자이고, 변수 앞에 '. . .' 를 붙여 선언한다.   Rest 연산자는 무엇이고 어떤 특징을 가졌는지에 대해선 아래 예제를 통해 자세히 알아보도록 하자.   function rest_operator(num1, num2) { console.log(num1, num2);}rest_operator(1, 2, 3, 4, 5);     위의 예제는 함수가 전..