أحب أن أبدأ مشاريع جانبية مختلفة ، أعتقد أن هذه واحدة من أفضل الطرق لتعلم شيء جديد وجدير بالاهتمام حقًا. ولدي عيب واحد خطير - يكاد لا أنجز الأشياء. هذا ، بالطبع ، لا يتعلق بمشاريع الدراسة التي سأحصل على درجة أو مهام يحددها صاحب العمل. أنا أتحدث عن أفكاري الخاصة التي أضيء بها خارج العمل أو الدراسة المستمر. في كل مرة أتقن فيها بعض المهارات الجديدة تمامًا التي أعتبرها مطلوبة ولا أرى احتمال تعلم شيئًا آخر من هذا القبيل ، أنسى المشروع على الإطلاق. لكن هذه المرة قررت تحسين نفسي - لبدء المشروع وإكماله والتحدث عن المسار الذي سلكته.
القليل عن نفسي
لديّ تعليم متخصص ، ودرجة البكالوريوس في الرياضيات ، ودرجة الماجستير في تكنولوجيا المعلومات. والمثير للدهشة أن الكثير من الأشياء التي أتقنتها في الجامعة كانت مفيدة لي ، خاصة درجة الماجستير. على أي حال ، تمكنت من ضبط عقلي في الاتجاه الصحيح من أجل استيعاب المعلومات الضرورية بشكل مثمر ، وإظهار نفسي جيدًا في هذا المجال ، والعثور على وظيفة ، والتقدم في مسيرتي المهنية.
أثناء الدراسة ، كنت من محبي C ++ ومطور ألعاب. ثم طورت محركًا مكتوبًا ذاتيًا وكتبت عليه ألعابًا وجربتها. حصلت على دبلوم في C وكنت على صلة باستخدام معالجات الرسومات في العمليات الحسابية. ثم أصبحت مهتمًا بتطوير Java و Android. أكمل العديد من المشاريع التعليمية بهذه اللغة ، وبعد ذلك ، كجزء من مشروع طلابي ، وبدعم من شركة دولية ، كتب أداة وحدة تحكم لتحليل أداء البرنامج. كل هذا تطور بعد ذلك إلى تطبيق Android مع القدرة على اختبار هاتفك من حيث الأداء والمقارنة مع الآخرين.
كان عالم الثعبان في الأفق. بشكل غير متوقع ، بناءً على اقتراح صديقي العزيز ، أصبحت مهتمًا بعلوم البيانات والثعبان ، كان ذلك منذ أكثر من أربع سنوات. من قبيل الصدفة ، اضطررت إلى تغيير الوظائف وتم تقييم مهاراتي على أنها مناسبة لبدء العمل على الخلفيات الخلفية للخدمات التحليلية الداخلية. لذلك ، من خلال تحليل البيانات ، أتيت إلى تطوير الويب بهذه اللغة.
من خلال الواجب ، كان علي أن أكون مطورًا متكاملًا عندما يكون مطورو الواجهة الأمامية مشغولين للغاية أو عندما لا تكون معايير جودة واجهة المستخدم في المقام الأول.
هذا وصف للمسار الذي سلكته لإنشاء تطبيق ويب كامل خاص بك دون الانغماس الكامل في التفاصيل الفنية. سيتم إسقاط روابط الالتزامات من المستودع الخاص بي على طول الطريق. باختصار عن مراحل هذه الرحلة:
- UI
- , , CI
- production-
- production-
- https
- AWS. , .
أما اختيار موضوع التطبيق فهو قصة أخرى ، فالاختيار الأخير يقع على عادات التتبع. ستحتوي الصفحة الرئيسية على مجموعة من الأزرار ذات العادات المتعقبة. لقد اتخذنا إجراءً - بالضغط على الزر - وهكذا كل يوم. يجب حفظ البيانات وعرضها في صفحة منفصلة في شكل جدول ، والعادات في الصفوف ، وأيام التقويم في الأعمدة ، تشير الخلية المعبأة إلى أنه تم تنفيذ الإجراء المطلوب في ذلك اليوم. مثل متعقب بسيط للعادة على الورق.
كان المكدس التكنولوجي واضحًا بالنسبة لي: رد فعل ، دجانغو ، بوستجرس ، إنجينكس ، أووسجي.
تخطيط واجهة المستخدم الأولية
قررت أن أبدأ من واجهة المستخدم وتثبيت nodejs.org/en/download/package-manager ، github.com/facebook/create-react-app ، ثم خلق المشروع:
npx create-react-app easytrackوبدأت في التخطيط. منذ البداية ، لم أستطع التفكير في أي شيء أسهل من ترميز قائمة بأشياء منطق الأعمال مباشرة في البرنامج وعرضها كقائمة في علامة ul. هذه الكائنات هي: مجموعة الموضوع ، والعنصر المتعقب ، وسجلات التتبع الفعلية لعنصر معين في يوم معين.
في الصفحة الأولى ، كان لدي مجموعات مواضيعية ، والنقر فوق أي منها يؤدي إلى فتح قائمة بالعناصر التي يمكن تتبعها.
كما أنشأت صفحة أخرى تحتوي على جدول بسيط بإحصائيات الأيام الماضية.
تطوير الخلفية
في هذه المرحلة ، كانت هناك حاجة إلى خلفية. هناك حاجة إلى حفظ الكائنات في قاعدة البيانات ، وإدارة المستخدمين ، والتمييز بين الحقوق. كان علي بالفعل استخدام Django لمشاريعي الخاصة (لم أتوصل إلى نهايتها المنطقية بالطبع) ، ولكن كانت هناك صعوبة واحدة - كان علي استخدام إطار عمل Django Rest ، والذي لم أتعامل معه على الإطلاق. بفضل بناء تطبيقات الويب Django 2.0 [1]. لقد مررت بها من الغلاف إلى الغلاف ، باستثناء الفصل الأخير ، حيث قاموا بإنشاء واجهات برمجة التطبيقات على DRF ، وتصفحها بأم عيني. في سياق القصة سوف ألجأ إليها أكثر من مرة.
في أي مكان تذهب إليه ، فتحت وثائق www.django-rest-framework.org وبدأت في تدخينها ، والتفت أيضًا إلى الكتاب المذكور.
قمت بتثبيت وتنشيط البيئة الافتراضية ، وقمت بتثبيت Django وأنشأت مشروع django في جذر المشروع:
virtualenv venv
. ./venv/bin/activate
pip install django
django createproject configسأعيد تسمية المجلد الرئيسي إلى django ، بحيث يكون كل شيء عن محتوياته واضحًا على الفور بالاسم. سيكون بداخله وحدة Python تسمى config ، وهي أيضًا مريحة للغاية. رمز الواجهة الأمامية ملفوف في مجلد التفاعل. هذه هي الطريقة التي تطورت بها بنية المجلد العامة ، والتي بقيت حتى يومنا هذا ( انظر إلى Github ).
في جذر المشروع ، قمت بإنشاء التطبيق الرئيسي:
django createapp coreتم إنشاء فئات من نماذج منطق الأعمال بنفس التنسيق تمامًا الذي قمت بترميزها في المقدمة ، والمسلسلات والعروض ( رابط للالتزام في Github ).
نحن لا نهتم بقاعدة البيانات ونستخدم SQLite الافتراضي. من خلال لوحة الإدارة ، قمت بتحميل بعض عينات بيانات الاختبار التي قمت بترميزها مسبقًا في المقدمة. نحن نحاول الاتصال بالواجهة الأمامية. python3 manager.py runserver في علامة تبويب واحدة ، ويبدأ الغزل في علامة تبويب أخرى ويقود.
يعمل خادم تطوير React على المنفذ 3000 ، ويعمل Django على المنفذ 8000. لا شيء أسهل من كتابة طلب جلب ('http: // localhost: 8000 / ...') في المقدمة. لكنها لم تعمل بهذه الطريقة بسبب cors-origin - حماية خاصة تمنع أي موقع من تقديم طلبات تلقائية إلى أي خادم. لذلك ، دون التفكير مرتين ، قمت ببنائه في الخلفيةdjango-cors-headers ) ، قم بتكوينه - لقد نجح. عندها فقط خمنت إضافة قسم وكيل إلى package.json والإشارة إلى الواجهة الخلفية ، ثم بدأ الجلب ('/ api / v1 / ...') في العمل بشكل طبيعي ولم تعد هناك حاجة إلى إعدادات إضافية.
في البداية ، كان الأمر ساذجًا بشكل رهيب ، لأنني قدمت طلبات غير متزامنة في المُنشئ - كل شيء نجح معي ولا بأس. في وقت لاحق فقط ، تعرفت على طرق دورة الحياة ، حيث يمكنك وأين لا يجب عليك القيام بهذا النوع من العمل. الآن تم عرض العناصر ، يمكن إنشاء عناصر جديدة.
تنفيذ إدارة المستخدم وفصل الحقوق
في هذه المرحلة ، كان الشيء الوحيد المفقود هو فصل حقوق عناصر البيانات: فقد تم إنشاؤها جميعًا نيابة عن مستخدم مجهول لا يقوم بتسجيل الدخول. كنت بحاجة إلى الاندماج فيه بطريقة ما دون كسر نظام django البيئي.
بادئ ذي بدء ، قمت بترميز تسجيل الدخول / كلمة المرور على الواجهة الأمامية وشكلت رأس التفويض بالقيمة "أساسي" + شفرة base64.encode (اسم المستخدم + ":" + كلمة المرور). ثم فكرت في إنشاء سلسلة بتنسيق base64 وحفظها على العميل عند إدخال اسم مستخدم / كلمة مرور. لكن كانت هناك شكوك كبيرة حول هذا القرار فيما يتعلق بالسلامة ، أردت تجربة شيء مختلف.
لقد بحثت في الإنترنت لفترة قصيرة وتعرفت على تقنية JWT ووحدة django-rest-framework-simplejwالتي قدمت فئات مصادقة لـ DRF وطرق عرض للحصول على زوج من الرموز المميزة ولتحديث رمز وصول.
من جانب الواجهة الأمامية ، كان يكفي حفظ رمزين في localStorage وتمرير رأس التفويض بالقيمة "Bearer access-token". أخيرًا ، لقد وضعت صفحات تسجيل الدخول وأغلقت كل الوصول للمستخدمين غير المصرح لهم إلى الموقع باستخدام فئات الأذونات ( رابط إلى التزام Github ) في المقدمة ، إذا لم يكن هناك رمز تحديث مميز ، فقد قمت بإعادة توجيهي إلى صفحة تسجيل الدخول ( رابط إلى Github الالتزام ).
بعد ذلك ، جعلت من الممكن التسجيل في الموقع ، وأنشأت عرضًا على الواجهة الخلفية ، ووضعت صفحة ، وأعدت طلبات الإرسال. في المستقبل ، كان حلمي هو كتابة تفعيل الحساب عن طريق البريد.
Refactor ، تنفيذ الوظائف الأساسية المفقودة ، CI
في هذه اللحظة ، ظهر تطبيق قليل الاستخدام وأردت جمع التعليقات. عرضت التطبيق على زوجتي وطلبت استخدامه دون مطالبة واحدة من جانبي. كان التسجيل ناجحًا للغاية ، ولكن بعد ذلك لم يسير كل شيء كما كنت أعتقد. ثم أدركت أن مجلدات الموضوعات لا ينبغي أن تكون في المقدمة ، بل يجب أن تكون أداة مساعدة ، كما نحتاج إلى إضافة تلميحات بأننا نقوم بإنشاء مجموعة من الأزرار حتى نتمكن من النقر فوقها مرة واحدة يوميًا. لقد توقعت أن يكون الأمر مثل متتبع عادات الورق العادي مع جدول بيانات حيث تحتاج إلى الطلاء على الخلايا. عندما أدركت ذلك ، بدأت في إعادة البناء. وإلى جانب ذلك ، كان هناك شيء يجب إعادة بنائه. لقد تجاوزت هيكل الوحدة تقريبًا من الصفر.
في هذه المرحلة ، قررت إضافة الجمال وأنماط css والتخطيط سريع الاستجابة. في هذا لست قويًا بشكل خاص واعتمد على أطر CSS. وقع الاختيار على Bulma ، بناءً على عدد النجوم ، التي يتم تنزيلها من npmjs.com ، على الرغم من حقيقة أنني لم أرغب في استخدام Bootstrap. على الأقل ، لقد تعاملت مع هذه المهمة.
بالتوازي مع ذلك ، قمت بتحسين وظائف الواجهة الخلفية. صنع الخام الكامل. كما تحقق حلم تأكيد التسجيل عبر البريد. اكتشفت وظائف إرسال الرسائل ، واكتسبت القدرة على تصحيح كل شيء من خلال خادم بريد تصحيح الأخطاء.
python -m smtpd -n -c DebuggingServer localhost:1025للإعداد ، بدأت حساب Google غير الهام وتمكنت من إعداد إرسال الرسائل عبر بريد Google.
بالنسبة للتغطية الاختبارية للواجهة الخلفية ، فقد نجح كل شيء بشكل جيد ، ولكن بالنسبة للواجهة الأمامية ، كل شيء بطيء تمامًا حتى الآن. لكنني لا أشعر باليأس ، فجأة سيتحول الأمر إلى تعديل.
كانت الخطوة التالية هي إعداد CI ، لقد بدأت GithubActions لإجراء الاختبارات ، واستخدمت منشئي التكوين لتشغيلها ، وقمت بتعديلها قليلاً وهذا كل شيء.
توليد الإعدادات لبيئة الإنتاج
بعد وقت قصير من ترتيب الكود والتفاصيل الصغيرة للمنطق ، كان علي البدء في تكوين تكوين الإنتاج. لهذا استوحيت من نفس الكتاب [1]. لقد قسمت ملفات تكوين django وتبعيات python إلى 3 أجزاء ( رابط إلى Github الالتزام ):
- مشترك - كل ما تحتاجه لأي بيئة
- dev —
- prod —
, .
uwsgi, nginx , dockerfile, .
[1] «1 — 1 », , , . phusion/baseimage, Ubuntu, .
, , postgres, . ( Github).
production-
, [1], AWS, . , - . , , , , . Free Tier, , , ? .
, AWS - , . , . , ECS.
Elastic Container Service
رأيت أن منشئ إجراءات Github يسمح لك بإنشاء تكوين لمهمة نشر حاوية مستمرة على AWS ECS. لنفترض أنني بدأت في الخوض في هذه الخدمة وأدركت أنه في وحدة التحكم المحلية أحتاج إلى إنشاء مجموعة وإنشاء تعريف للمهمة ووصف الحاوية ، بعد أن حفظت صورتها مسبقًا في خدمة AWS ECR أخرى ، وهي Dockerhub حسب الوظيفة. قدمت وحدة التحكم نوعين من المجموعات: Fargate و EC2. التقنية الأولى هي بدون خادم تمامًا ، مما يعني أننا بدأنا الحاوية وسيهتم وقت التشغيل بكل شيء. تعمل الحاويات في مجموعة من النوع الثاني على مثيل الجهاز الظاهري الخاص بها في السحابة. لا أرغب في الغوص في هذا لفترة طويلة ، لقد قمت بإنشاء مجموعة قائمة على Fargate. لكنني واجهت حقيقة أنني لا أستطيع تمرير قيم سرية إلى الحاوية ،وبسبب هذا ، كانت المهمة تتراجع باستمرار.
بينما كنت أحاول إحضار الحاوية إلى حالة العمل ، كانت المجموعة تعمل لعدة ساعات وتمت إضافة الأموال إلى علامة التبويب الخاصة بي مع الدفع مقابل الخدمات. تبين أن التكنولوجيا نفسها مدفوعة الأجر ولا تنطبق على المستوى المجاني. دفعت للمجموعة وقررت التعامل مع الدفع بعد ذلك بقليل. قرأت في الوثائق أنك لست بحاجة إلى دفع المزيد مقابل استخدام ECS أعلى EC2 ، باستثناء استخدام موارد EC2 ، لكن EC2 مشمول بواسطة Free Tier وقررت تجربة هذا المسار.
دعم AWS
في النهاية ، كذب أحدهم عليّ وطلبوا مني مزيدًا من المال مقابل هذا التكوين. إجمالي 0.32 دولار ، وإن كان قليلاً ، لكنه ما زال مخزياً. ثم كتبت دعماً ، وقلت إنني واجهت صعوبات في الإعداد وظننت طوال الوقت أنني منضم إلى الطبقة المجانية ، لكن لم ينجح شيء بالنسبة لي ، وتم سحب الأموال. طلبت المساعدة. رداً على مكالمتي ، استجابوا بسعادة ، وقدموا قسيمة بقيمة 1 دولار ، والتي غطت جميع النفقات غير المتوقعة. بشكل جميل.
نتيجة لذلك ، كان علي أن أنسى خدمة الحاوية هذه وأتقن EC2 في أنقى صورها.
سحابة الحوسبة المرنة
EC2 — . Free Tier 750 . , , - , .
[1] docker-machine, . , EC2. docker .
, dockre-machine create… EC2. docker-compose up -d . 80 . , «Public DNS» , .
Relational Database Service
AWS RDS. . , ( postgres) , Free Tier, . , , .
Simple Email Service
كان علي أيضًا مواجهة حقيقة عدم إرسال الرسائل. الحقيقة هي أن جميع خدمات البريد تحظر عناوين IP التي تطابق مثيلات EC2 من أجل مكافحة البريد العشوائي. كان من الضروري استخدام SES. خدمة AWS أخرى.
قمت أيضًا بتكوينه ، وأشرت إلى صناديق البريد التي سأرسل الرسائل منها ، كل شيء على ما يرام. ومع ذلك ، ليس كل شيء ورديًا حتى الآن. الحسابات الجديدة في وضع الحماية افتراضيًا ، مما لا يسمح بإرسال رسائل البريد الإلكتروني إلى صناديق البريد غير المؤكدة. اضطررت إلى تأكيد المربعات لمختبري بيتا.
قم بتسجيل مجال وتكوين شهادة للوصول إلى https
لاختبار التطبيق بالكامل ، كان مطلوبًا إعداد اتصال https ، واتضح أن هذا مستحيل بدون تسجيل مجال. لم أرغب في تعريض عناوين البريد الإلكتروني وكلمات المرور والرموز المميزة للخطر عن طريق نقلها عبر اتصال غير آمن. في هذه الحالة ، بحثت في الإنترنت بالكامل. لم يكن بعض المسجلين مناسبين ، لأنها باهظة الثمن ، لكنها باهظة الثمن في مكان ما ، إلى جانب أن العديد منهم لديهم مراجعات رهيبة. أثناء بحثي ، فهمت شبكة إعلانات Yandex ما أريده وقدمت لي على الفور شركة حيث يمكنك تسجيل نطاق مقابل 39 روبل. كان هناك المزيد من المراجعات حول هذه الخدمة ، لذلك قمت بإنشاء حساب ، واخترت مجالًا مجانيًا وقمت بتسجيله لي.
بعد ذلك ، من أجل الوصول إلى مثيل EC2 الخاص بي باستخدام هذا المجال ، قمت بإنشاء منطقة استضافة في خدمة AWS Route 53 ، وسجلت إعدادات DNS ، وأعدت كتابة سجلات NS في الحساب الشخصي للخدمة حيث تم تسجيل المجال في أمازون.
لقد استخدمت خدمة Let's Encrypt لإنشاء الشهادة. توقفت عند هذا التكوين: يقوم nginx المحلي بعمل proxy_pass لعنوان الحاوية ، وتدور الحاوية ويمكن الوصول إليها من خلال المنفذ 8080. لم يكن من الصعب استخدام الأداة المساعدة certbot console ، وإنشاء شهادة وتكوين https تلقائيًا. أخيرًا ، اسمح بالوصول إلى الجهاز الظاهري على المنفذ 443.
لقد وصل تطوير المشروع إلى نهايته المنطقية
, . , , SES , . , . , , , , , , , , . , , . :
- , , . .
- -
- ,
- , -
— , , . React , AWS, , , .
لكن الإدراك الرئيسي هو أن الشخص في الميدان ليس محاربًا على الإطلاق. عملت في هذا المشروع لأكثر من شهرين ، عدة ساعات في أوقات فراغي ... أتعلم ماذا؟ أنا لم أخيط بشكل رهيب حتى الآن. يصبح من الملاحظ أنه كلما تقدمت في العمر ، كلما قلت الرغبة في تعلم شيء "مثل هذا تمامًا" ، تقل الرغبة في العمل كثيرًا على بعض الأشياء "المثيرة للاهتمام فقط". لكن في نفس الوقت تلاحظ أن هناك المزيد من الفرص المتاحة لفعل شيء من أجل الصالح والمنفعة. تبدأ في تقدير الجهود المركزة والعمل الجماعي وكذلك الاسترخاء والوقت الذي تقضيه مع الأشخاص المقربين.