بناء تطبيق اللياقة البدنية مع React Native

أنا متعطش للتطبيقات مثل Freeletics و Headspace التي تستهدف اللياقة البدنية للجسم والعقل. ساهمت هذه التطبيقات كثيرًا في نمو شخصيتي وأصبحت الآن في يوم سبت ، وكنت أتطلع لمعرفة ما إذا كان بإمكاني المساهمة في شيء ما.

أصبحت مهتمة باللياقة أثناء السفر إلى وادي السيليكون للعمل. كنت مستيقظًا في وقت مبكر نتيجة تأخر الرحلة ، ذهبت إلى المكان الوحيد المفتوح في بالو ألتو في الساعة 5 صباحًا - الإعتدال. هناك كنت مع مجموعة رائعة من الناس ، بما في ذلك تيم كوك ، أعدوا أنفسهم لليوم المقبل على أفضل طريقة ممكنة. لقد أوحى لي ذلك باتباع إجراءات الصباح نفسها التي اتبعوها ، بصرف النظر عن وقت مبكر. مرة أخرى في زيوريخ ، بدأت الانضمام إلى العديد من فصول اللياقة الجماعية. لقد أدركت بسرعة أنه بينما كان الناس يمارسون تمرينًا رائعًا معًا ، فإن مجتمع الإحساس كان منخفضًا إلى حد ما ، على الرغم من كثافة التجربة المشتركة. يمكن تعزيز هذا مع التكنولوجيا؟ شاركت مع مؤسسي برنامج اللياقة البدنية المسمى Athleticflow من أجل بناء تجربة. تم اعتماد تطبيقنا للتو من متجر التطبيقات ، وفي هذه القصة ، أود أن أشارك تجربتي في إنشائه.

لقطات من تطبيق Athleticflow

بالنظر إلى مدى قلة ما تحتاجه لإنشاء تطبيق جوال اليوم ، فإن ذلك أمر رائع. لم يكن حاجز الدخول منخفضًا جدًا. من خلال منهج "تعلم مرة واحدة ، والكتابة في أي مكان" ، مكنت React Native المجتمع الأمامي من إنشاء تطبيقات ذات نهاية احترافية باستخدام مهارات JavaScript و CSS فقط تقريبًا. كما أنه يقلل بشكل كبير من فجوة التطوير بين iOS و Android. مكنت المستجدات في لغات البرمجة مثل ES6 و Typescript و Flow المطورين من كتابة أكواد JS قابلة للتطوير مع تكاليف صيانة منخفضة. علاوة على ذلك ، توفر الواجهة الخلفية كمنتجات خدمة مثل Firebase جميع الإمكانيات اللازمة لواجهة خلفية محمولة بتكلفة تمهيد بقيمة صفر دولار: قاعدة البيانات والتخزين وإخطارات الدفع والبرامج الوسيطة والتحليلات. الابتكارات ضمن هذه المنتجات سريعة وكبيرة: إن كتابة تطبيق React اليوم أصبح أبسط بكثير مما كان عليه عندما بدأت لأول مرة. الكرز على رأس الكعكة؟ المجتمع والأدوات حول هذه التقنيات رائعة. من الصعب تخيل وقت ومكان أفضل لكتابة البرامج.

مصدر واحد للحقيقة

عندما يتعلق الأمر بجعل تطوير تطبيقك فعالًا من حيث التكلفة ، فربما تكون التكنولوجيا الأكثر تجاهلًا هي الكتابة الثابتة. إذا لم يكن لديك أي خبرة في ذلك ، فقد يكون من الأسرع إعداد نموذج أولي لشيء ما بدونه. ومع ذلك ، بمجرد أن تبدأ فعلًا في بناء شيء ما ، فأنت في حاجة ماسة إليها: كلما زاد الضغط الذي تمارسه على مدقق الكتابة ، كان ذلك أفضل.

من أجل رياضي ، صممت نموذج بيانات التطبيق باستخدام Firebase Bolt Language. يتم استخدام ملف التعريف لإنشاء قواعد أمان قاعدة البيانات والتحقق من الصحة. كما أنه يستخدم لإنشاء كود TypeScript المستخدم في جانب React Native والوسيطة.

يتم استخدام ملف تعريف واحد للحفاظ على جميع أجزاء النظام متسقة.

يحافظ الاحتفاظ بمصدر واحد للحقيقة على تطور أجزاء التطبيق بشكل منفصل: لا يمكن أن يحتوي Firebase على تعريف نوع مختلف عن React Native والعكس. يمكن إعادة هيكلة نموذج البيانات بسرعة وبثقة: سيعلمك مدقق الكتابة إذا ارتكبت خطأ.

هناك نوعان من أدوات فحص النوع المتوفرة في JavaScript: TypeScript و Flow. لقد استخدمت TypeScript ببساطة لأنني كنت أمتلك خبرة بالفعل. إذا كنت جديدًا في كلا النظامين من النوعين ، فقد أوصي بـ Flow لأنه يعمل خارج التطبيق مع تطبيق create-react-native-app. ومع ذلك ، ليس لدي خبرة كبيرة في ذلك حتى الآن ، لذلك احذر من هذه النصيحة.

المغلي

استخدم تطبيق create-react-native-app للتمهيد لمشروعك. يتيح لك تشغيل "Hello World" على جهاز iOS / Android الخاص بك في غضون دقائق. يستخدم المشروع الذي تم إنشاؤه المعرض. هذا يعني أنك لست بحاجة إلى تثبيت XCode أو Android Studio لتطوير تطبيقك. يمكنك اختباره على جهاز iOS دون شراء حساب المطور من Apple. يمكن مشاركة تطبيق التطوير على اختبار بيتا بسهولة شديدة عبر رابط أو رمز الاستجابة السريعة. مع التقدم في تطوير تطبيقك ، قد ترغب في "فصل" المشروع من أجل أن يكون لديك إعداد مدمج خاص بك. هذا مفيد إذا كنت بحاجة إلى كتابة رمز أصلي مخصص على سبيل المثال.

دورة حياة مشروع اكسبو

ومع ذلك ، يغطي المعرض الكثير من حالات استخدام الأجهزة المحمولة ومن الممكن نشر تطبيق كامل على Apple App Store و Google Play Store دون "فصل".

أخيرًا وليس آخرًا ، يمكّنك expo من تحديث التطبيق الخاص بك على الفور دون أي تحديث لمتجر التطبيقات بنفس طريقة تحديث صفحة HTML. إذا كان "مشروعك" منفصلًا ، يمكنك استخدام Microsoft CodePush لتحقيق نفس التأثير. في الأسبوع الماضي ، أعلمني صديق عن خطأ مطبعي في تطبيق Athleticflow. لقد دفعت التصحيح لإتقان نظام التكامل المستمر الخاص بي بدوره دفع التحديث بشفافية لجميع المستخدمين. توجد دائمًا هذه الأنواع من التحديثات غير الملحومة على الويب وهي ممكنة الآن في تطبيقات الأجهزة المحمولة. بشكل عام ، أجد أن هذه الممارسات الجديدة في مجال تطوير الأجهزة الجوالة تسبب اضطرابًا كبيرًا.

من خارج منطقة الجزاء ، يوفر تطبيق create-react-native-app لوحة تحليلية لكتابة اختبارات الوحدة والمكونات. للاختبار الشامل ، لا يوجد معيار فعلي متاح حتى الآن. تتمتع Appium بشعبية كبيرة ويبدو أن مشروعًا جديدًا يسمى Detox يبدو واعداً للغاية (iOS في الوقت الحالي فقط).

الاجتماعية الأولى

بنيت العديد من التطبيقات حول طبقة اجتماعية. توفر الطبقات الاجتماعية تجارب جذابة للغاية للمستخدم. ومع ذلك ، فإن عمليات التكامل مع الأنظمة الأساسية الحالية مثل Facebook أو Instagram محدودة للغاية. باستثناء تسجيل الدخول والوظائف المشتركة ، لا يحدث الكثير. هذا لا يترك للمطورين خيارًا كبيرًا سوى إعادة اختراع العجلة في العديد من حالات الاستخدام الاجتماعي لتطبيقهم. تشمل حالات الاستخدام المتابعين والخلاصات والإعجابات والتعليقات. هذه ليست تافهة لتنفيذ. على سبيل المثال ، قد يكون تنفيذ شيء بسيط مثل التمرير خلال قائمة صور عملية معقدة بالفعل. علاوة على ذلك ، لدى المستخدمين توقعات عالية للغاية. يضع كل من Facebook و Instagram والتطبيقات الاجتماعية الأخرى معيارًا قويًا للغاية من غير المرجح أن تنجح. يبدو أن هناك حاجة قوية إلى "شريط من وسائل التواصل الاجتماعي". المنصات مثل Facebook و Instagram تقدم القليل فقط للمطورين.

فجر جديد

من خلال منهج "تعلم مرة تكتب في أي مكان" من React Native ، يمكن الاستفادة من مهارات تطوير الويب لإنشاء تطبيق أصلي حقيقي من إصدار boilerplate إلى إصدار متجر التطبيقات. ويمكن أن يتم ذلك دون لمس XCode أو Android Studio. أصبح نموذج تحديث تطبيقك الآن شفافًا مثل التحديثات على الويب. باستخدام مدقق الكتابة ، يمكنك كتابة قاعدة بيانات قابلة للصيانة بدرجة كبيرة وتقليل تكاليف التطوير بشكل كبير. أخيرًا ، توفر الواجهة الخلفية كخدمة مثل Firebase جميع الإمكانيات اللازمة للبنية التحتية للهواتف المحمولة بتكلفة التمهيد البالغة صفر دولار. إنه يوم جديد ، إنه فجر جديد لتطوير الأجهزة المحمولة.

ظللت مجلة لرحلتي تمر عبر تطوير React Native عبر العديد من القصص. بعض المكونات التي قمت بإنشائها مفتوحة المصدر ، وبعضها الآخر أحزمه حاليًا كحلول تسليم المفتاح لمشاريع الأجهزة المحمولة.