5주차에서 배운 것 1) 수익성 앱: 앱에서 수익을 내는 방법 2) 구글광고,애드몹: 구글을 광고 플랫폼을 이용한 수익창출 3) 배포하기: 리액트 네이티브&Expo 앱 쉽게 배포하기 앱 개발 초보자가 가장 쉽게 수익 구조를 앱에 연결 할 수 있는 방법은 [앱 내 배너 광고 수익 모델] 배너 수익 방식도 다양한데 1. 배너 클릭 2. 배너 광고 시청 3. 배너 광고 사용자 참여 등이 있다. 1. 먼저 [구글광고] 애드몹(AdMob)을 설정한다. 배너 광고 종류도 많은데 이번에는 메인화면 하단의 가로 배너와 사용자가 카드를 눌렀을 때 전면광고를 보게 설정하였다. 메인화면에서 베너광고가 보이기 위해 코드에 적용하였다. - 적용 결과 광고 설정 끝 2. 배포를 위한 순서 1) 로고 제작 2) 스플래시 스크린 제..

3주차까지 화면을 그리는 Frontend 에 대해 배웠다면 이제 데이터를 관리하고, 서버에서 보여주는 방법에 대해 배우자 ! 앱에 모든 데이터를 담을 순 없다. (앱 용량, 데이터의 문제) 서버(= 데이터가 담긴 곳)에서 데이터를 가져오고, 데이터를 변경할 수 있다. 파이어베이스(Firebase) : 대표적 서버리스(serverless) 앱에서 서버에 데이터를 요청하거나 데이터를 보내는 대화를 하려면 서버가 정한 규칙에 따라 대화 요청 (Request)을 해야한다. 정한 규칙에 따라 요청을 하지 않으면 응답(Response)이 오지 않는다. 서버 쪽에서 정한 규칙 = API(Application Programming Interface) 1. 서버가 제공하는 도메인 2. 서버가 만들어 놓은 함수를 그냥 이..

React-Native App을 만들기 위해 알아야 하는 최소한의 리액트 개념! 컴포넌트(Component) 상태(State,useState) 속성(Props) useEFfect 앱 화면이 하나라면 너무 재미없쥬? 앱 안에서 여러 페이지를 두고 버튼을 눌러 이동할 수 있는 기능을 달아보자~ 컴포넌트(Component) : 정해진 엘리먼트들을 사용하여 만든 화면의 일부분 상태(State) : 컴포넌트에서 데이터를 유지하고 관리하기 위한 유일한 방법 == 사용할 데이터 속성(Props) : 상위 컴포넌트에서 하위 컴포넌트로 데이터를 전달하는 방식 == 데이터 전달 useEffect : 화면에 컴포넌트가 그려지면 처음 실행해야 하는 함수들을 모아두는 곳 버튼 하나가 컴포넌트가 될 수 있고, 버튼을 모아둔 영역..

React Native에서 화면을 그리는 방법 앱 개발, 즉 리액트 네이티브 앱 개발에서 구역(레이아웃)을 잡는 문법언어를 JSX라고 부른다. JSX문법은 화면 구역을 잡을 때는 태그를, 글자를 쓸 때는 태그를 사용하라는 것처럼 용도에 맞는 태그를 정해놨다. import {Text, View} from 'react-native'; Hello, I am {props.name}! 리엑트 네이티브는 자바스크립트 언어 하나로 안드로이드 앱과 iOS앱 두 가지 모두 만들어주는 라이브러리이다. Expo 리액트 네이티브로 앱을 개발할 때, 안드로이드 & iOS 코드를 건드려야 하는 대부분의 상황들을 안 건드려도 되게끔 도와주는 툴 리액트 네이티브 공식문서와 Expo 공식 문서를 보면서 사용법에 따라 앱을 개발하면 된..

console.log("Hello World!"); 변수 let으로 변수를 선언 let num = 20 num = 'Bob' let a = 1 let b = 2 a+b //3 a/b //0.5 let first = 'Bob' let last = 'Lee' first+last //'BobLee' first+' '+last //'Bob Lee' first+a //Bob1 변수명은 쉽게 알아볼 수 있게 쓰는 게 중요하고, 다른 특수문자 또는 띄워쓰기는 불가능하다. let first_name = 'bob' // snake case let firstName = 'bob' //camel case let value_box = '값' value_box = '변경한 값'; console.log(value_box) //콘..

import React from 'react'; import main from './assets/main.png'; import { StyleSheet, Text, View, Image, TouchableOpacity, ScrollView} from 'react-native'; export default function App() { return () } const styles = StyleSheet.create({}) 앱의 기본 틀