نویسنده مشترک: @felipeguzmansierra
در حال حاضر، شما می توانید یک برنامه وب به صورت سفارشی و با تمام قابلیت های مورد نیاز خود و به اندازه کافی قوی برای حل هر مشکلی بسازید. این به لطف تعداد زیادی فناوری در دسترس توسعه دهندگان، مانند زبان های برنامه نویسی، چارچوب ها و ابزارهای وب، امکان پذیر است.
مزیت کار بر روی برنامه های وب این است که می توانید فقط یک برنامه ایجاد کنید که می تواند در هر مرورگر وب استفاده شود، به این معنی که می توانید از همان نرم افزار بر روی هر رایانه یا تلفنی با برنامه مرورگر نصب شده استفاده کنید. اگرچه، گاهی اوقات یک برنامه بومی می تواند به طور قابل توجهی روی کاربر تأثیر بگذارد زیرا در سیستم نصب شده است و می تواند با ابزارهای دستگاه مانند اعلان ها، حسگرها، سایر ماژول های سیستم و غیره تعامل داشته باشد. یک پروژه برای هر سیستم (برای مثال iOS، Android، Windows، MacOS، Linux). این مستلزم تلاش، منابع، زمان و دانش زیادی از فناوری توسعه دستگاه خاص (زبان برنامه نویسی، سیستم عامل) است.
چرا Live View Native؟ اینجا جایی است که تمام مزایای آن نشان داده می شود، اجازه ایجاد یک برنامه بومی که توسط سمت سرور اجرا و مدیریت می شود تنها با استفاده از یک زبان برنامه نویسی (Elixir). این به شما امکان می‌دهد با استفاده از دانش قبلی خود در LiveView به عنوان پایه، برنامه‌هایی بسازید و برخی از ابزارهای مورد نیاز برای ایجاد رابط کاربری برای LiveView Native را بیاموزید. این امکان پذیر است زیرا کتابخانه از سوکت ها برای اصلاح نماها استفاده می کند و از همان منطق استفاده شده در برنامه وب استفاده مجدد می کند. زمان کمتر، کدنویسی و سرعت بخشیدن به فرآیند.
به همین دلیل است که کتابخانه LiveView Native را بررسی کردیم و در مورد Light Proof of Concept که در این پست وبلاگ توسعه داده ایم و مزایای آن بحث خواهیم کرد.
مقدمه: LiveView Native
LiveView Native یک پروژه منبع باز است که توسط DockYard توسعه یافته است که مفهوم LiveView را به برنامه های بومی در iOS و Android گسترش می دهد و به Backend که فقط با Elixir و Phoenix LiveView ساخته شده است، اجازه می دهد تمام تغییرات را در سمت مشتری پردازش کند. برای دستیابی به این هدف، DockYard یک کتابخانه برای هر سیستم ایجاد کرد که مجموعه ای از برچسب های نشانه گذاری را بر اساس کد سوئیفت یا کاتلین (مانند hstack یا vstack) و امکان ایجاد یک اتصال با سوکت LiveView که ارتباط دائمی با سرور را حفظ می کند، تعریف می کند. نسخه وب LiveView). به این ترتیب، کتابخانه‌ها به توسعه‌دهندگان اجازه می‌دهند به تمام قابلیت‌هایی که LiveView می‌تواند ارائه دهد، دسترسی داشته باشند.
LiveView Native دارای نسخه مشتری پایدار iOS برای توسعه است و نسخه اندروید برای Jetpack در حال توسعه است. همچنین، این کتابخانه اسنادی در مورد زبان‌های نشانه‌گذاری مورد استفاده کتابخانه در iOS، چند آموزش برای یادگیری نحوه استفاده از آنها و چند نمونه در مخزن رسمی برای نشان دادن پتانسیل این فناوری دارد.
چگونه با LiveView Native توسعه دهیم؟
همانطور که در بالا توضیح داده شد، LiveView Native فقط یک نسخه در دسترس برای iOS دارد، بنابراین برای به دست آوردن بهترین تجربه، توصیه می شود روی یک دستگاه MacOS کار کنید که می تواند نسخه Xcode 13.3 یا بالاتر را نصب کند. اگرچه، کار بر روی یک ماشین لینوکس با استفاده از ماشین مجازی با MacOS، که در آموزش Docker-OSX توضیح داده شده است، امکان پذیر است، جایی که می توانید نسخه های اخیر سیستم عامل و Xcode را نصب کنید. مهم است که بگوییم کار بر روی یک ماشین مجازی منابع زیادی را مصرف می کند و می تواند روند توسعه را پیچیده کند.
فرآیند توسعه در LiveView Native مستلزم ایجاد یک پروژه در Phoenix LiveView و یک پروژه در SwiftUI با Xcode است که در آن کتابخانه باید وارد شود. در مرحله بعد، در پروژه SwiftUI، یک هماهنگ کننده (یک شی تعریف شده در کتابخانه) باید برای شروع و حفظ اتصال با سوکت LiveView تعریف شود و وظیفه ارائه نمای روی برنامه تلفن را بر عهده خواهد داشت.
// coordinator example
import SwiftUI
import PhoenixLiveViewNative
struct ContentView: View {
@State var coordinator: LiveViewCoordinator<EmptyRegistry> = {
var config = LiveViewConfiguration()
config.navigationMode = .enabled
return LiveViewCoordinator(URL(string: "http://localhost:4000/")!, config: config)
}()
var body: some View {
LiveView(coordinator: coordinator)
}
}
برای توسعه Front-End، لازم است از تگ های نشانه گذاری تعریف شده در کتابخانه (اسناد) یا آنهایی که توسط کاربر در پروژه swift که در آموزش توضیح داده شده است، برای ایجاد یک HTML سفارشی استفاده کنید.
// example use of swift-like markup tags
<%= for transaction <- @transactions do %>
<hstack id={transaction.id} list_row_inset-leading="1">
<zstack>
<rectangle fill-color="system-white" />
<text color="system-black"><%= transaction.created_at %></text>
</zstack>
<zstack>
<rectangle fill-color="system-white" />
<text color="system-black" font="headline"><%= format_public_key(transaction.source_account) %></text>
</zstack>
<zstack>
<rectangle fill-color="system-white" />
<text color="system-black"><%= transaction.fee_charged %></text>
</zstack>
</hstack>
<% end %>
مورد مطالعه: با استفاده از LiveView Native چه کار می کنیم؟
Stellar یک شبکه غیرمتمرکز و باز است که در سال 2014 راه اندازی شد و برای تبادل نمایندگی دیجیتال تقریباً هر چیزی (پول، املاک و غیره) طراحی شده است. از یک بلاک چین برای همگام سازی شبکه و مدیریت میلیون ها تراکنش روزانه استفاده می کند. در این مورد، تصمیم گرفتیم اپلیکیشنی ایجاد کنیم که با شبکه Stellar تعامل داشته باشد تا نشان دهد چگونه می توان از این فناوری استفاده کرد. برای دستیابی به این هدف، از Elixir Stellar SDK برای درخواست اطلاعات در مورد حساب های Stellar (موجودی دارایی ها و اطلاعات مربوط به تراکنش ها) استفاده کردیم.
برنامه (به نام StellarNative) دارای دو نمای است: اولی به کاربر اجازه می دهد یک کلید عمومی را وارد کند، سپس سیستم پس از فشار دادن دکمه “جستجو” توسط کاربر، وجود حساب را جستجو می کند. اگر حساب وجود داشته باشد، coordinator نمایش را برای نمایش پیامی با کلید عمومی و دکمه جدیدی به نام «جزئیات بیشتر» به‌روزرسانی می‌کند تا اطلاعات مربوط به حساب را دریافت کند. اگر کلید عمومی معتبر نباشد، پیامی به کاربر نشان داده می شود که دلیل آن را بیان می کند.
نمای دوم تمام دارایی های مربوط به حساب و موجودی مربوطه آنها را نشان می دهد، همچنین فهرستی از ده تراکنش آخر با اطلاعاتی مانند تاریخ، حساب مربوطه و کارمزد را نشان می دهد.
این برنامه تنها با استفاده از Phoenix with Elixir توسعه یافته است و فقط از برچسب های تعریف شده توسط کتابخانه استفاده می کند.
مزایا و معایب
پس از مطالعه و پیاده سازی یک برنامه کاربردی با کتابخانه، مجموعه ای از مزایا و معایب را یافتیم که می تواند برای افرادی که علاقه مند به استفاده از کتابخانه در پروژه های خود هستند مهم باشد. نکته مهم این است که برخی از معایب مربوط به وضعیت فعلی پروژه است و در آینده قابل حل است.
مزایای:
- از توسعه برنامه های جدا شده از سمت مشتری و سمت سرور خودداری کنید. شما می توانید فقط یک برنامه بسازید که همه چیز را مدیریت کند.
- در آینده، برنامه های وب و موبایل خود را از همان پروژه مدیریت کنید. شما نیازی به جداسازی (کاملا) پروژه ها نخواهید داشت.
معایب:
- در حال حاضر، این فناوری در اولین نسخه های خود قرار دارد. به عنوان مثال، بسیاری از تگ‌های نشانه‌گذاری در SwiftUI در دسترس هستند اما در کتابخانه موجود نیستند، بنابراین محدودیت‌هایی در توسعه view دارد.
- از آنجایی که فقط کلاینت iOS دارای نسخه پایدار است، فقط افرادی که دارای MacOS اپل هستند می توانند با کتابخانه کار کنند. و حتی اگر گزینه‌هایی مانند ماشین مجازی برای آزمایش برنامه بر روی سایر سیستم‌های عامل وجود دارد، این عمل خوبی نیست و می‌تواند کار را بیشتر از آسان‌تر کردن آن پیچیده کند.
نتیجه گیری
هدف LiveView Native بهبود سرعت توسعه ساخت برنامه های بومی با استفاده از چارچوبی مشابه برنامه های وب فونیکس است. اگرچه این فناوری زودرس است، اما از آنجایی که تنها برای توسعه iOS در دسترس است، محدودیت هایی دارد. ما فکر می‌کنیم این فناوری گام بزرگی است زیرا اکوسیستم Elixir را افزایش می‌دهد و به توسعه‌دهندگان گزینه‌های بیشتری برای ایجاد برنامه‌های قدرتمند با مزایای زبان و چارچوب می‌دهد، و به همین دلیل است که این فناوری پتانسیل و قابلیت تسریع توسعه پروژه را دارد. . با این حال، این کتابخانه ای نیست که بتوان از آن در محیط تولید استفاده کرد.
