Skip to content
CodingThailand's Blog
CodingThailand's Blog

by โค้ชเอก

  • Home
  • About Me
  • CodingThailand.com
CodingThailand's Blog

by โค้ชเอก

แนะนำสำหรับคนที่อยากเริ่มเขียน Mobile App ด้วย React Native

04/02/2018

26952542_632242900279259_7302068128138228052_o

สำหรับคนที่อยากเริ่มเขียน Mobile App ด้วย React Native แนะนำดังนี้ครับ

.
1. เราต้องมีความรู้พื้นฐาน HTML, CSS และ JavaScript (แนะนำให้ศึกษา JavaScript เวอร์ชั่น ES6/ES2015 ขึ้นไปนะครับ) สรุปคือต้องเคยเขียนเว็บมาก่อนนั่นเอง

.
2. มีพื้นฐานการเขียน React และเข้าใจ Concept ต่างๆ ยกตัวอย่างเช่น Component, Props, State เป็นต้น

https://reactjs.org/

.
3. ถ้ามีความรู้ หรือเคยเขียน Mobile App แบบ native มาบ้าง จะช่วยได้มากครับ แต่ก็ค่อยๆ ศึกษาเพิ่มเติมทีหลังได้

.
ส่วนคนที่อยากลองเขียนเลย (สำหรับคนที่ใช้ Windows) ให้ทำขั้นตอน ตามนี้

.
1. ติดตั้ง Node.js แนะนำเวอร์ชัน 8 และให้ใช้ npm เวอร์ชัน 4 แทนเวอร์ชัน 5 นะครับ (เวอร์ชัน 5 มีปัญหายังไม่รองรับ)
https://goo.gl/aAKGFH

.
2. ติดตั้ง Python แนะนำเป็นเวอร์ชัน 2
https://goo.gl/qQEmH3

.
3. ติดตั้ง JAVA JDK แนะนำเวอร์ชัน 8
https://goo.gl/vnkT4Y

.
4. ติดตั้ง React Native CLI เปิด Command Prompt แล้วรันคำสั่ง

npm install -g react-native-cli

.
5. สร้างโปรเจคใหม่ ด้วยคำสั่ง
create-react-native-app MyReactNativeProject

.
6. cd เข้าไปในโฟลเดอร์ MyReactNativeProject แล้วรันคำสั่ง npm start

จะมีคู่มือแนะนำต่างๆ และจะได้ QR code มาครับ

.
7. การทดสอบ App ในมือถือ ให้ติดตั้ง Expo Client ในมือถือเราก่อนครับ ตามลิงก์ https://goo.gl/7ppgPm

ส่วนการทดสอบ app นั้นก็แค่ scan QR code จากข้อ 6 จะสามารถทดสอบ app บนเครื่องจริงได้เลย (มือถือกับเครื่องคอมฯเราต้องอยู่ในวงแลนเดียวกัน)

.
8. ถ้าต้องการแก้ไขหรือเขียนโค้ด ก็สามารถใช้ Editor ที่ถนัดได้เลยนะครับ แนะนำ Visual Studio Code

.
ส่วนถ้าใครอยาก build เป็น android app หรือทดสอบผ่านสาย usb เครื่องจริง ก็ให้ติดตั้ง Android Studio ด้วย มีขั้นตอนละเอียดแล้ว ตามดูคู่มือของ React Native ได้เลยตามนี้ https://goo.gl/YK3Dkx

.
ลองดูนะครับ
โค้ชเอก

Views: 13599

Uncategorized

Post navigation

Previous post
Next post

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Posts ล่าสุด

  • การใช้งาน Prefetching ใน Next.js
  • 14 ข้อคิด เพื่อการเป็น Developer ที่ดีขึ้น จาก “Lee Robinson”
  • เคยเจอ “TypeError: Cannot read property ‘x’ of undefined” หรือเปล่า
  • บันทึกการเขียนเว็บไซต์ใหม่ในรอบ 10 ปี ย้ายมาใช้ Next.js
  • ทำไมการจัดการ Error ใน JavaScript ถึงเป็นเรื่องท้าทาย?

Recent Comments

    หมวดหมู่

    • .NET
    • AI
    • Android
    • Angular
    • Angular 2
    • Coding
    • CSS
    • Database
    • Editor
    • Flutter
    • Git
    • HTML5
    • Ionic 2
    • Ionic 4
    • Ionic Framwork
    • JavaScript
    • Laravel
    • Laravel 5
    • Next.js
    • Node.js
    • PHP
    • PHP 7
    • Plugins
    • React
    • React Native
    • Template
    • Tools
    • TypeScript
    • UI
    • Uncategorized
    • Vue.js
    • XAMPP
    • Yii
    • คอร์สเรียน
    • แรงบันดาลใจ

    Archives

    • July 2025
    • April 2025
    • November 2024
    • October 2024
    • April 2020
    • February 2020
    • August 2019
    • September 2018
    • August 2018
    • February 2018
    • November 2017
    • October 2017
    • August 2017
    • July 2017
    • April 2017
    • October 2016
    • August 2016
    • May 2016

    Tags

    .NET android Angular Angular 2 Atom Coding Coding Standard CSS CSS 3 Datepicker Express.js extensions Git HTML HTML5 Ionic2 JavaScript Laravel5 laravel 5.5 MariaDB Material Design MySQL Node.js npm PHP PHP7 plugins PouchDB recaptcha Restful sail.js template typescript typscript XAMPP Yii2

    ผู้เยี่ยมชม

    • 0
    • 1,818,152
    • 547,559
    • 13,599
    ©2025 CodingThailand's Blog | WordPress Theme by SuperbThemes