Blog About

เขียนแอพ Android ครั้งแรกโดยใช้ React Native

Apisit N.
13 Sep 2021

บทความนี้จะมาแชร์ประสบการณ์การเขียน mobile app ว่าเริ่มต้นยังไงใช้เครื่องมืออะไรบ้าง จากประสบการณ์ส่วนตัวไม่เคยพัฒนาแอพมาก่อนเขียนแต่เว็บด้วย html css php javascript จึงต้องหาอะไรใหม่ ๆ ลองทำดูบ้าง หวังว่าจะเป็นประโยชน์ต่อผู้สนใจพัฒนาแอพนะครับ

การเลือกใช้เครื่องมือในการพัฒนา

หากพูดถึงแอพก็จะมีอยู่สองฝั่งคือ android และ ios เครื่องมือในการพัฒนาก็จะแตกต่างกันไป หากจะพัฒนาแอพแบบใช้งานเฉพาะฝั่งของ android ใช้ภาษา kotlin, java, c# ฝั่งของ ios ใช้ภาษา Swift, Objective c เป็นต้น

แต่ก็มีภาษาหรือเครื่องมือบางตัวที่สามารถเขียนโค้ดคครั้งเดียวสามารถใช้งานได้ทั้ง android และ ios เช่น xamarin, flutter, react native, kotlin multiplatform เป็นต้น หากเป็นแอพง่าย ๆ ก็สามารถทดลองใช้งานเว็บไซต์อย่างเช่น thunkable, app inventor ช่วยให้เราสร้างแอพได้โดยไม่ต้องเขียนโค้ดเลย

โดยส่วนตัวแล้วได้ลองศึกษา react native เป็นอันดับแรกเพราะเป็น cross platform สามารถทำเข้าใจได้เร็วไม่ต้องเรียนรู้คำสั่งอะไรใหม่มาก syntax ส่วนใหญ่จะเป็น javascript ผสมกับ html เรียกว่า jsx และสามารถนำความรู้ไปเขียนเว็บด้วย ReactJS ได้อีกด้วย เรียนรู้ครั้งเดียวก็เขียนได้ทั้งแอพและเว็บ

this is alt tag

เก็บข้อมูลไว้ที่ไหน

เมื่อเขียนหน้าตาแอพออกมาได้ประมาณนึงก็ต้องมีฐานข้อมูล แล้วจะใช้อะไรดี ก็ต้องดูก่อนว่าในแอพของเราเก็บข้อมูลอะไรบ้างเช่น ข้อมูล รูปภาพ ถ้ามีรูปภาพจะเก็บไว้ที่ไหนเก็บไว้ที่ไหน ผมจึงเลือก firebase realtime database + firebase storage เก็บข้อความและรูปภาพ แบบฟรี หากใช้งานไม่เกินแผนของ firebase

ข้อดีของ firebase คือ google เป็นเจ้าของสามารถใช้งานการล็อกอินด้วยบัญชี google, facebook, twitter, github ได้มีด้วย firebase authentication แถมได้ hosting ฟรีอีก

อัพขึ้น store ใช้เงินเท่าไหร่

ขั้นตอนต่าง ๆ ผมจะไม่เขียนในบทความนี้นะครับ สิ่งที่ต้องมีคือเราต้องมีบัญชี google play console หรือ Apple developer ID เพื่อนำแอพของเราไปแสดงใน play store หรือ app store ฝั่งของ android ต้องจ่ายค่าสมัครบัญชี $25 ในครั้งแรก สำหรับฝั่งของ ios ต้องจ่ายค่าสมัคร $99 แบบรายปี จากประสบการณ์ผมยังไม่เคยเล่นฝั่ง app store ครับ

การสร้างรายได้

  1. in-app purchases เหมือนตอนที่เราซื้อเพชรในเกมด้วยเงินบาท
  2. subscription การสมัครแบบจ่ายรายเดือน
  3. freemium/premium โหลดใช้งานฟรีหากต้องการใช้งานบางอย่างต้องจ่ายเงินเพิ่ม
  4. ติดโฆษณา
  5. โหลดแอพฟรี
  6. จ่ายก่อนโหลด

เครื่องมือที่ใช้ในการพัฒนา

  1. react native
  2. firebase realtime database
  3. firebase storage
  4. react-native-google-signin
  5. react-native-iap

สุดท้าย ก็หวังว่าบทความนี้จะเป็นประโยชน์กับใครหลาย ๆ คนนะครับ