webapp.rs

webapp.rs

تطبيق ويب مكتوب بالكامل في الصدأ

الهدف من هذا المشروع هو كتابة تطبيق ويب كامل بما في ذلك الواجهة الخلفية والواجهة الأمامية داخل الصدأ.

 Rust wasm             Rust app
in browser <- REST -> HTTP Server -- actix-web
 |                         |
Yew                   Diesel (ORM) -> PostgreSQL

منشورات المدونة

1. تطبيق ويب بالكامل في الصدأ.
2. الدروس المستفادة في كتابة تطبيقات الويب بالكامل في الصدأ.

يبني

يجب الوفاء بعمليات التبعيات التالية لدعم مجموعة الميزات الكاملة لهذا التطبيق:

• WASM-PACK
• Rollup
• Diesel_cli
• PostgreSQL (LIBPG)
• وقت تشغيل الحاويات ، مثل Podman

يتكون التطبيق من الواجهة الأمامية والخلفية. للبدء في القرصنة ، يمكن اختبار الواجهة الخلفية عن طريق make run-backend ، في حين يمكن اختبار الواجهة الأمامية مع make run-frontend . يمكنك تكييف تكوين التطبيق داخل Config.toml إذا لزم الأمر.

يقوم هذا بتثبيت متطلبات الإنشاء ، الصدأ و WASM-Pack ، على Ubuntu أو Debian.

> sudo apt-get update
> sudo apt-get install -y pkg-config libssl-dev npm sudo wget
> wget https://sh.rustup.rs -O rustup-init
> sudo sh rustup-init -y
> cargo install wasm-pack
> sudo npm install -g rollup

هذا يبني المشروع.

> git clone https://github.com/saschagrunert/webapp.rs.git
> cd webapp.rs
> make all 

يجري

make deploy يستخدم Podman لبدء حاوية postgresql وحاوية الصدأ الخلفية. إذا كنت ترغب في استخدام Docker بدلاً من Podman ، فقم بتعيين CONTAINER_RUNTIME=docker في الجزء العلوي من Makefile . تحرير Config.toml إذا لزم الأمر لتعيين عنوان URL الخلفي وبيانات اعتماد PostgreSQL:

[ server ]
url = " http://127.0.0.1:30080 "
...
[ postgres ]
host = " 127.0.0.1 "
username = " username "
password = " "
database = " database "

تأكد من تثبيت تبعيات وقت التشغيل ، ثم ابدأ الحاوين.

> sudo apt install -y postgresql-client
> cargo install diesel_cli --no-default-features --features " postgres "
> sudo make deploy

يجب الآن الوصول إلى التطبيق على http://127.0.0.1:30080 . أثناء التطوير ، يمكنك بدء الحاويات بشكل منفصل ، باستخدام make run-app لبدء فقط حاوية الصدأ الخلفية ، و run-postgres لبدء فقط حاوية PostgreSQL.

إذا تم تشغيل كل من الواجهة الخلفية والواجهة الأمامية ، فيمكنك زيارة تطبيق الويب على http://127.0.0.1:30080 . بعد التحميل الناجح للتطبيق ، يجب أن ترى شاشة مصادقة مثل هذا:

ستقبل شاشة تسجيل الدخول أي اسم مستخدم وكلمة مرور متساوية ، me (اسم المستخدم) me (كلمة المرور). لا يوجد حاليًا أي مصادقة مستخدم أخرى بعد ، لكن مجموعة غير مطابقة ستؤدي إلى فشل المصادقة. بعد تسجيل الدخول بنجاح ، يجب أن تكون قادرًا على رؤية محتوى التطبيق:

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

التدفق السيطرة

يبدو أن تدفق التحكم الكامل للتطبيق مثل هذا:

المساهمة

تريد المساهمة في هذا المشروع؟ واو ، شكرا! لذا من فضلك شوكة فقط وأرسل لي طلب سحب.