패스트캠퍼스 챌린지 6일차

# 강의 제목 : 누적다운로드 120만+ 1인 개발자와 함께하는 앱 개발 입문 Online

# 강의 목표 : 기초부터 운영까지 앱 개발의 전체 프로세스를 이해한다. 
                  내 이름으로 된 앱을 최대 10개까지 만들어 출시할 수 있다. 
                  앱 개발자로 성장할 수 있는 초석을 다진다. 
                  반응 얻는 앱의 특징과 노하우를 알아간다. 
                  향후 강의 없이도 나만의 앱을 개발할수 있는 실력을 가진다. 

# 강의 요약 : 프로그램 설치부터 기본 문법, 광고 다는 법, 클론코딩을 진행하며 필수 지식을 학습한다. 
                 총 10개의 다른 주제로 실제 사용화 가능한 수준의 앱을 만들어본다.
                 나의 앱을 세상에 선보이기 위한 개발자 등록 및 배포를 진행한다. 
                 강사님의 리뷰/클레임 대응사례 등 앱 성공 포인트를 참고해 1인 개발자로서의 입지를 다진다. 

 # 강의 목차 : Flutter, Android Studio 설치 및 설정 
                   변수, 변수타입, 리스트, 맵 개념 및 사용 
                   조건문, 반복문, 클래스, 함수 개념 및 사용 
                   위젯 넣어보기(MaterialApp, Scaffold, Text, Icon, Image)
                   UI 만들어보기 (앱의 타이틀, 화면에 표시되는 텍스트 표현 등)
                   여러 위젯 같이 써보기(가로, 세로로 다양한 위젯 배치)
                   Stateless, Stateful 위젯 넣어보기
                   Firebase, Admob(앱 광고) 사용해보기 (6일차)
                   기능 종합해서 간단한 어플 만들어보기 (숫자카운트어플) (6일차)
                   앱 기획 궁금증 해소 및 앱 제작 꿀팁 (6일차)

# 강의 화면 :  

 

# 강의 내용 : 플로터 배우기 (Firebase, Admob, 숫자카운트어플, 앱기획 궁금증 해소)

1. Firebase
Firebase란 모바일 앱을 분석, 테스트 뿐만 아니라 개발, 서비스까지 할 수 있는 모바일 개발 플랫폼 
   - Analytics: 사용자 분석
   - FireStore: 데이터 저장 및 불러오기 
   - Crashlytics: 모바일 오류 분석 
   - Authentication : 사용자 인증 

https://firebase.google.com/?gclid=CjwKCAjwz5iMBhAEEiwAMEAwGAP65_bVQcZnTRe5n2fjr1q1H0ce02AYanQBnuy584eelaN-r9ZIwhoClDAQAvD_BwE&gclsrc=aw.d

Firebase

# Firebase 데모 보기 
https://console.firebase.google.com/project/fir-demo-project/overview

로그인 - Google 계정

대시보드를 통해 일일 활성사용자수, 수익률 등 다양한 정보 확인 가능

분당 사용자 및 전세계 사용자 분포도 확인 가능 

2. Admob
Admob란 구글에서 제공하는 모바일 광고 플랫폼, 앱을 통해서 수익을 창출할 수 있는 방법 
- 배너 광고 : 화면 하단에 노출 
- 전면 광고 : 화면 전체 노출 
- 보상형 광고 : 게임 아이템 얻기 

수업중에 flutter 에서 실제 광고를 달기 위해 admob_flutter 라이브러리 사용 예정

https://admob.google.com/intl/ko/home/ 

Google AdMob: 모바일 앱 수익 창출

# 앱 기획 궁금증 해소 및 앱 제작 꿀팁

1. Lean Startup (사용자 경험 중심 개발)
 - 사용자의 피드백을 통해 서비스를 증진시키는 소프트웨어 개발 방법론 
 - 아이디어(가정)을 테스트 하기 위해서 빠른 프로토타입을 생성 - 피드백 - 분석 과정을 반복하며 제품을 
   발전시키는 방법론 

2. 앱 개발의 발전 
- 첫 출시 이후 사용자들의 많은 피드백을 통해 현재의 '간단'을 서비스 중 
- '간단' 은 현재도 개발중이며 사용자 피드백에 의해 더욱 사용자 친화적인 어플로 성장 
https://apps.apple.com/kr/app/%EA%B0%84%EB%8B%A8-%EA%B0%84%ED%97%90%EC%A0%81-%EB%8B%A8%EC%8B%9D-%EB%8B%A4%EC%9D%B4%EC%96%B4%ED%8A%B8-%EC%8B%9D%EB%8B%A8-%EA%B4%80%EB%A6%AC/id1467464443

‎간단- 간헐적 단식 다이어트 식단 관리

3. Dog Fooding (개밥먹기)
- Eating your own dog food : 자신이 개발하는 서비스를 직접 사용한다고 생각하고 기획하고 개발 
- 처음 '간단' 앱을 개발한 이유 ? 
    - 간헐적 단식이라는 다이어트에 관심
    - 간헐적 단식 타이머 필요성 느낌 
    - 마땅한 어플리케이션 없음 
=> 내가 쓸만한 서비스를 만들자 ! 

4. 일단 맞자 
- "누구나 그럴싸한 계획을 가지고 있다. 한 대 처맞기 전까지는" - 마이클 타이슨 -
- 기획은 간결하고 효율적으로 
- 기획에 너무 많은 시간을 쏟기 보단 기능 중심으로 기획
- 간단 : 간헐적 단식 타이머에 집중
- 오늘의 운동 : 운동 세트 카운트에 집중 
=> 최대한 빠르게 사용자에게 맞아보는 것이 중요 (단, 빠르지만 어설프진 않게 만드는 것이 중요함)

5. 1일 개발자가 해야할 일
- 앱 설계 및 개발 
- 디자인 
- 마케팅 
- 앱 데이터 및 사용자 분석
- 앱 운영(고객센터/리뷰 관리 등)
=> 모든 과정을 혼자서"

6. AdobeXD 
- Adobe에서 개발한 UI 설계 프로토타이핑 툴 와이어프레임 제작 가능 
https://www.adobe.com/kr/products/xd.html

7. 고객센터 
- 카카오채널 : 카카오톡을 통해 고객센터 상담 가능, 빠른 고객 응대가 가능해 사용자 반응이 높음
- 이메일 고객센터 : 카카오톡으로 문의 넣기 부담스러운 사용자를 위한 기능 
- 인스타그램 : 인스타그램 채널을 운영

# 숫자 카운트 어플 만들기 
- 축구, 탁구, 배드민턴 등 다양한 운동 종목에서 사용 가능한 점수 카운트 어플 
- 각 종목에 맞게 종료 점수를 변경할 수 있으며 점수를 증가, 감소할 수 있음 

counter 어플 예시

# main.dart 소스코드

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter APP Counter',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(title: 'Flutter APP Counter'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  int count1 = 0;
  int count2 = 0;
  String victeam = "";

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Column(
        children: [
          Container(height: 50),
          Text("농구 대회", style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold),),
          Container(height: 50),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: [
              Text("고려대학교"),
              Text("연세대학교"),
            ],
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: [
              Text("$count1점", style: TextStyle(fontSize: 25, fontWeight: FontWeight.bold),),
              Text("$count2점", style: TextStyle(fontSize: 25, fontWeight: FontWeight.bold),),
            ],
          ),
          Container(height: 50),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: [
              Row(
                children: [
                  IconButton(
                    icon: Icon(Icons.add),
                    color: Colors.blue,
                    onPressed: (){
                    setState(() {
                      count1 = count1 + 1;
                      if(count1 > 10){
                        victeam = "고려대학교 승리!!!";
                      }
                    });
                    },
                  ),
                  IconButton(
                    icon: Icon(Icons.remove),
                    color: Colors.red,
                    onPressed: (){
                    setState(() {
                      count1 = count1 - 1;
                    });
                    },
                  ),
                ],
              ),
              Row(
                children: [
                  IconButton(
                    icon: Icon(Icons.add),
                    color: Colors.blue,
                    onPressed: (){
                    setState(() {
                      count2 = count2 + 1;
                      if(count2 > 10){
                        victeam = "연세대학교 승리!!!";
                      }
                    });
                    },
                  ),
                  IconButton(
                    icon: Icon(Icons.remove),
                    color: Colors.red,
                    onPressed: (){
                    setState(() {
                      count2 = count2 - 1;
                    });
                    },
                  ),
                ],
              )
            ],
          ),
          Container(height: 20),
          Text(victeam, style: TextStyle(fontSize: 50, color: Colors.green ),)
        ],
      )
    );
  }
}

 

# 교육 소감

오늘은 Firebase와 Admob, 앱 기획 궁금증 해소, 최종적으로 그동안 문법을 정리하며 숫자 카운트어플 만드는 법에 대해서 공부하였다. 2016년에 출시된 구글의 firebase는 앱개발을 할때 필요한 도구와 인프라를 제공하기 위해서 구글이 만든 것이라고 했는데, 데모를 확인하고, 사용자 지역별 접속 현황 등 앱 개발에 있어서 중요한 Analytics을 위한 기능들을 제공할 뿐만 아니라, 앱 개발을 하는데 있어 개발에 집중할수 있도록 다양한 Develop 툴들을 제공한다는 데에 놀라웠다. 물론 무료가 아니라서 유로라는 점에서 앱 개발하고 운영하는데 있어, 비용 부담이 발생하긴 해도 꼭 필요한 기능들만 선택해서 활요하면 굉장히 유용한 툴이라고 생각됐다. Admob 역시 앱 개발자에게 부가가치를 창출할수 있도록 광고를 삽입하여, 앱을 방문한 사용자에게 광고를 노출 시키며, 수익을 벌어들일 수 있는 유용한 도구라는 생각이 든다. 나중에 앱을 만들고, Admob 에 등록하여 광고를 꼭 달아보도록 해야겠다. 최종적으로 교육받은 내용으로 Count 어플을 제작했는데, 간단히 Dart 언어를 사용하여 쉽게 Flutter 앱을 개발해 볼수 있었다. 지금까지 Dart 문법에 대해서 이해하는 과정을 거쳐 간단한 미니앱인 Counter 어플을 만들면서 향후 다양한 응용앱을 만들면서 점점 Dart 응용 문법을 익히고 유용한 앱 기능들을 만들어보고자 한다.    

# 본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성되었습니다.

https://bit.ly/3FVdhDa

수강료 100% 환급 챌린지 | 패스트캠퍼스