Advertisement
  1. Code
  2. Parse
Code

شروع ساخت وبلاگ شما با Parse.js: به سرور پارس خودتان مهاجرت کنید.

by
Difficulty:BeginnerLength:LongLanguages:
This post is part of a series called Building Your Blog with Parse.js.
Get Started Building Your Blog With Parse.js: Categories

Persian (پارسی) translation by Pouria Parhami (you can also view the original English article)

Final product image
What You'll Be Creating

متاسفانه Parse.com در تاریخ 28 ژانویه 2017 بسته شد. در سریهای قبل ، من به شما آموزشی دادم که در آن یک سیستم وبلاگ را از ابتدا ساختیم. اما همه چیز بر پایه Parse.com بود. و اگر شما هنوز از آن تکنیک‌ها استفاده می‌کنید، متاسفانه وب‌سایت شما دیگر به وسیله آن‌ها کار نخواهد کرد.

اگر هنوز (مثل من) طرف‌دار Parse.js هستید، و می‌خواهید هم‌چنان از آن استفاده کنید، خبرهای خوبی دارم، مردمی دوست داشتنی وجود دارند که آن را متن باز درست کردند، بنابر این ما می‌توانیم کپی خودمان را در تمام وب هاستینگ‌های محبوب اجرا کنیم. این آموزش با هدف کمک به شما برای ایجاد تغییر و مهاجرت از Parse.com به پارس سرور خودتان در Heroku  ایجاد شده است. 

من متخصص بک اند (Back end) نیستم، اما این ساده ترین راهی است که من پیدا کردم. اگر هر گونه نقصی دیدید یا روش‌های بهتری را می‌دانید با دادن کامنت در زیر به اشتراک بگذارید.

اگر این قسمت را دنبال می‌کنید، مهاجرت به سرور به خودی خود پیچیده نیست. با Docker به راحتی می‌تونید یک پارس داشبورد محلی برای خود برپا کنید، بنابر این شما می‌توانید به راحتی با داده‌های خود بازی کنید.

به هر حال این سری آموزشی بر پایه ورژن 1.2.19 Parse.js ساخته شده است. برای اتصال به یک سرورمستقل پارسه باید نرم افزار آن را ارتقا دهیم تا ورژن 1.9.2 را اجرا کند. ورژن 1.5.0 پارسه Backbone را پشتیبانی نمی‌کند، و این بدان معنا است که باید تغییرات اساسی در کد ها ایجاد کنیم. ما باید Backbone را به صحفه اضافه کنیم و باید از ترکیب پارسه و بکبون در آن استفاده کنیم.  

آن یک مقدمه طولانی است، اما نترسید. ممکن است در طول مهاجرت این‌جا و آن‌جا نیاز به اشکال زدایی داشته باشید، اما مشکلی نخواهید داشت.   شما همیشه می‌توانید کد اصلی من را چک کنید یا کامت بگذارید، من و این جامعه فوق العاده که این‌جاست، همواره تلاش می‌کنیم به بهترین شکل به شما کمک کنیم.

راه اندازی و مهاجرت به سرور پارسه

ابتدا اجازه دهید یک سرور پارسه بسازیم. پارسه این کار را با ساخت یک راهنمای مهاجرت دقیق و ایجاد یک لیست بلند بالا از نرم افزارهای نمونه بر روی تمام پلتفرم‌های محبوب مانند Heroku ,AWS و Azure بسیار ساده کرده است.

من به شما یکی از آسان‌ ترین‌های آن‌ها را که می‌شناسم معرفی خواهم کرد: Heroku + mLab combo. شروع استفاده از آن رایگان است و شما همیشه می‌توانید برای سخت افزار بهتر و داشتن فضای ذخیره سازی بیشتر در آن سیستم پول پرداخت کنید. تنها هشداری که باید به شما بدهم این است که  ورژن رایگان Heroku بعد از 30 دقیقه غیرفعال بودن به خواب می رود. بنابر این اگر کاربران وقتی که سرور خواب است وب سایت شما را مشاهده کنند، ممکنه چند ثانیه منتظر بمانند تا سرور بیدار شود و بعد از آن، آن‌ها می‌توانند داده‌ها را ببینند. (به خاطر همین اگر صفحه دمو این پروژه را چک کردید و محتوای بلاگ من  رندر نشده بود، یک دقیقه وقت بدید تا بروز رسانی شود.)

این قسمت تا حد زیادی بر پایه راهنمای Heroku برای استقرار یک پارسه سرور و راهنمای مهاجرت خود پارسه می‌باشد. من فقط ساده‌ترین و کم خطاترین مسیر را انتخاب کردم.

قدم اول: ثبت نام و ایجاد یک برنامه جدید در Heroku

اگر هنوزحساب کاربری در Heroku ندارید، یکی بسازید. Heroku یک پلتفرم بسیار محبوب برای توسعه و میزبانی نرم افزارهای وب می‌باشید.

بعد از این که ثبت نام کردید، به پیشخوان Heroku خود بروید و یک نرم افزار جدید بسازید ـــــ که سرور شما خواهد بود.

Create new app

Give it a name if you want:

Add app name

قدم دوم: اضافه کردن mLab MongoDB

حالا شما به پایگاه داده نیازدارید تا داده‌هایتان را ذخیزه کنید. بیاید از mLab به عنوان یک افزونه استاده کنیم.

به مسیر Resources >Add-ons بروید، mLab را جستجو کرده و آن را اضافه کنید.

Add mLab MongoDB

Sandbox برای رشد و توسعه شما کافی است، هچنین شما همیشه می‌توانید آن را بروز کنید و با پرداخت هزینه بیشتر فضای ذخیره سازی بیشتری در آن داشته باشید.

هنگامی که mLab شما اضافه شود، می توانید URI مونگودیبی را از آن بگیرید.

 به آدرس Settings > Config Variables در پیش‌خوان هیروکو بروید و روی Reveal Config Vars کلیک کنید.

Get MONGODB_URI

در آنجا شما می تونید URI مونگودیبی را برای پایگاه داده خود ببینید. آن را کپی کنید و حالا می‌توانیم مهاجرت از پایگاه داده را شروع کنیم.

قدم سوم: مهاجرت پایگاه داده

به Parse.com برید و نرم افزاری را که می‌خواهید مهاجرت کند را بیابید. ورژن متن باز سرورپارسه برای هر سرور فقط یک نرم افزار را می‌پذیرد، بنابراین اگر می‌خواهید چند نرم افزارداشته باشید، باید این پروسه را تکرار کنید و چند سرور ایجاد کنید، فعلا یکی را انتخاب کنید.

در آن برنامه به آدرس App Settings > General > App Management رفته و روی Migrate کلیک کنید.

Start Migrate

و بعد URI مونگودیبی را که کپی کرده بودید در آن پیست (paste) کنید، و مهاجرت آغاز خواهد شد.

Connect MongoDB

شما باید این صفحه را به زودی ببینید:

Syne Done

دیدن این صفحه بدان معناست که شما باید تمام داده‌های خود را در ام لب مونگودیبی داشته باشید، به اندازه کافی ساده بود، درسته؟

اما نرم افزار شما هنوز به مرحله پایانی نرسیده است ــــ بیایید تا زمانی که بتوانیم داده‌ها را ببینیم و با آنها در پیشخوان محلی پارسه بازی کنیم صبر کنیم، و بعد برگردیم و نرم افزار خود را نهایی کنیم.

قدم چهارم: استقرار سرور پارسه

قبلا از پایگاه داده کوچ کردیم حالا می‌توانیم سرور پارسه خود را مستقر کنیم.  

اگر حساب کاربری گیت هاب ندارید، یکی بسازید. بی شک آنجا یکی از محبوب‌ترین مکان‌هایی است که مردم کدهای خود را به اشتراک گذاشته و مدیریت می کنند.

با حساب کاربری گیت هاب خود مخزن رسمی نمونه سرور پارسه را فورک کنید.

Fork official Parse Server example repo

سپس برگردید به پیشخوان هیروکو خود. به آدرس Deploy >Deployment method بروید و GitHub را انتخاب کرده و به حساب کاربری گیت هاب خود متصل شوید.

بعد از آن ، پارسه (parse) را جستوجو کنید و مخزن parse-server-example را بیابید و به آن متصل شوید.

Connect to GitHub

اگر همه چیزکارکند، شما باید اتصالی مانند این را ببینید:

Repo Connected

حالا به پایین صفحه حرکت کنید. زیر Manual Deploy بر روی Deploy Branch کلیک کنید.

Deploy Branch

شما خواهید دید که سرور پارسه شما شروع به مستقر شدن می‌کند و به زودی شما صفحه ای مانند این را خواهید دید:

Successfully deployed

بر روی دکمه View کلیک کنید این صفحه را خواهید دید:

View Server Page

دیدن این صفحه به این معنا است که سرور شما خوشبختانه در حال اجرا است! و URL که می‌بینید URL سرور شما است، بعدا به آن نیاز خواهید داشت.

می‌دانم که حس غیر واقعی دارید از اینکه این خط ساده را ببینید و بفهمید که سرور بالا است، اما به من اعتماد کنید، نیروگاه آن‌جا در حال کار کردنه. و نرم افزار شما در حال حاضر می‌تواند از ا آنجا بخواند و بنویسد.

If you want to double-check, you can run something like this:

برپایی یک پیشخوان محلی پارسه

اگر شما یک نینجا در خط فرمان هستید، شما هیچ مشکلی در این جا نخواهید داشت. اما اگر شما مانند من از رابط کاربری دوستانه پیشخوان پارسه خوشتون می‌آید، این بخش را دنبال کنید تا پیشخوان پارسه خود را در ماشین محلی خود داشته باشید، بنابراین شما می‌توانید به صورت بصری داده‌های پارسه خود را ببینید و با آن‌ها بازی کنید و به این روش استفاده کنید.

باز هم شما می‌توانید با استفاده از راه‌های متفاوتی پیشخوان خود را نصب کنید، من فقط ساده‌ترین راه را که تجربه کرده‌ام به شما نشان می‌دهم ، از Docker استفاده می‌کنیم.

قدم اول: نصب Docker

اگر داککر را ندارید ابتدا آن را نصب کنید (Mac | Windows).

داککر تمام محیط را درون یک جعبه قرارمی‌دهد، بنابراین نیازی نیست تا شما به دنبال یک آموزش نصب محلی کاملا پیچیده بگردید و از طریق ترمینال بروید در پرتال تخصصی اولیتون. 

قدم دوم: ساختن تصویر پیشخوان پارسه

با اجرا شدن داککر، مخزن پیشخوان پارسه کلون می‌شود و می‌رود در مخزن کامپیتور شما.

برای کسانی که با گیت هاب تازه آشنا شدن و تازه کار هستند، فقط آن را به عنوان فایل زیپ دانلود کنید.

Download Parse Dashboard Repo

از حالت فشرده خارج کنید و در محلی که به خاطر می‌سپرید قرار دهید، نرم افزار ترمینال خود را باز کنید اگر در مک هستید تایپ کنید cd (شما به یک فاصله بعد از cd نیاز دارد) و پوشه را داخل آن بکشید.

Drag in unzipped folder

سپس Enter را بزنید.

شما باید چیزی شبیه به این ببینید، و این به آن معناست که شما در مکان درستی هستید.

حالا با پیست کردن این دستور می‌توانید خیلی سریع چک کنید که آیا داککر شما به درستی نصب شده است یا نه.

اگر مانند این، به شما ورژنی را که در آن هستید نشان داد:

داککر نصب شده و می‌توانید ادامه دهید.

به جای آن اگر گفت:

اگر شما داککر را به درستی نصب کردید باید دوباره آن را با دقت بررسی کنید.

با داککری که درست نصب شده باشه، می‌تونید این دستوررا پیست کرده و Enter را بزنید.

این دستور برای شما یک تصویر محلی می‌سازد (در صورت تمایل میتوانید docker jargon را نادیده بگیرید) برای پیشخوان پارسه شما. 

با پیشمایش شما تعداد خط‌های زیادی را خواهید دید. وحشت نکنید، فقط به آن زمان دهید، و در آخر شما چیزی شبیه به این را خواهید دید.  

آن یعنی شما انجامش داده اید، تصویر با موفقیت ساخته شد.

اگر شما دستور docker images را اجرا کنید ، شما آن را خواهید دید:

گام 3 : اتصال پیشخوان پارسه با سرور پارسه

فعلا آن فقط یک تصویراست، و هنوز نمی‌تواند سرور را راه اندازی کنید، ما می‌خواهیم زمانی که آن اجرا می‌شود یه سرور پارسه و منگودیبی که ساختیم متصل شود.

برای این کار ابتدا باید چند کلید در هیروکو بسازیم، به این ترتیب می‌تواند بگویدچه کسی اجازه دسترسی به داده‌ها را دارد.

به پیشخوان هیروکو خودرفته و دوباره به آدرس Settings > Config Variables بروید. این بار باید دو داده را به آن اضافه کنیم APP_ID و MASTER_KEY. APP_ID میتونه هرچیزی باشه که بشه به راحتی به خاطر آوردش ، در صورتی که MASTER_KEY بهتره یک پسورد طولانی پیچیده باشه.

Add APP_ID and MASTER_KEY

حالا با این دو کلید، می‌توانیم یک فایل پیکر بندی ساده را در دایرکتوری ریشه (root directory) پوشه پیشخوان پارسه بنویسیم کنیم. می‌توانید از هرچیزی استفاده کنید از vimگرفته تا TextEdit یا Notepad هدف این است که یک فایل متنی ساده config.json با این محتوا ایجاد کنیم: 

و البته باید your-app-url را با لینک URL (همان صفحه‌ای که می‌گوید " من آرزو دارم یک وب سایت باشم ") جایگزین کنید، اما parse/ درآخر کد نگه دارید ; your-app-id وyour-master-key با داده‌های پیکربندی که اضافه کرده ایم جایگزین کنید ; یک نام به نرم افزارخود بدهید و آن را با your-app-name جایگزینش کنید.

فایل را ذخیره کرده و دستور ls را در ترمینال اجرا کنید تا مطمئن شوید config.json را در مکان درستی گذاشته‌اید.

اگر config.json را در این لیست مشاهده می‌کنید ، کارتان خوب بوده می‌توانید ادامه دهید.

حالا دستور pwd را اجرا کنید تا آدرس مکانی که در آن هستید را دریافت کنید:

مسیر را کپی کنید.

سپس آن را در این دستور کپی کنید تا Docker container ایجاد شود (مجددا می‌توانید jargon را نادیده بگرید) وپیشخوان پارسه را را اجرا کنید. به یاد داشته باشید تا مسیر من را با مسیری که خود بدست آورده‌اید جایگزین کنید.

از بالا به پایین ، این دستور این چیزها را دارد (که می‌توانید آنها را نادایده بگیرید):

اگر همه چیز به درستی اجرا شود، شما باید یک رشته بلند بدون پیام خطا مانند این را دریافت کنید:

و حالا پیشخوان پارسه ما در حال اجرا می‌باشد، آن را در ./http://localhost:8080 چک کنید.

در ابتدا ممکن است کند باشد با صفحه خالی نشان دهد، اما جند دقیقه به آن مهلت دهید و صفحه ورودی را خواهید دید:

Local Parse Dashboard Login

حالا می‌توانید وارد شوید با userبه عنوان نام کاربری و passبه عنوان کلمه عبور، در حالی که تا الان متوجه نشده باشین آنها در config.js تعریف شده اند، همچنین شما می‌توانید آنها را به هر چیزی که می خواهید تغییر دهید.

و رابط کاربر آن را در ماشین محلی‌تان بسیار آشنا خواهید دید، و می‌توانید با دادهایتان بازی کنید (در ام لب منگودیبی) همان طوری که همیشه انجام می‌دادید. 

Local Parse Dashboard

یک جفت از نوشته های پایانی در این پیشخوان محلی:

اولا شما می توانید هر زمان که خواستید با این دو دستور این کانتینر را متوفق و شروع کنید:

بنابر این زمانی که شما کامپیوتر خود را دوباره راه اندازی می کنید (restart) نیازی نیست مراحل قبل را دوباره انجام دهید ، فقط به آن بگویید دوباره شروع (start) کنید .

و دوما، اگر چند سرور پارسه دارید، نیازی نیست چندید پیشخوان پارسه ایجاد کنید. فقط نرم افزارهایتان را به config.json اضافه کنید مانند این:

هر بار که تغییری در config.json ایجاد می‌کنید، باید داککر کانتینر را دوباره راه اندازی کنید (restart):

بعد تغییراتی را که اعمال کرده‌اید خواهید دید.

گام 4 : نهایی کردن مهاجرت

حالا با پیشخوان جدید پارسه خود بازی کنید و اگر همه چیز کارکند، می‌تونید به Parse.com برگردید و مهاجرت خود را نهایی کنید.

Finalize migration

سپس اگر نرم افزار و پیشخوان خود را بررسی کنید، خواهید دید که تمام آن‌ها به صورت معجزه آسایی بدون مشکل به سرور جدید شما اشاره می‌کنند.

بروز رسانی کد برای اجرا در Parse 1.9.2

این عالی است، آرزو می‌کنم همین‌طور بماند تا ما بتوانیم آموزش خود را زود تمام کنیم، اما همان‌طور که ذکر کردم، نرم افزار قدیمی Parse.js شما هنوز متکی به سرورهای Parse.com است تا به درستی به سرور جدید شما اشاره کند و کار آنها بعد از 20 ژانویه 2017 تمام خواهد شد.

برای این‌که برای همیشه اجرا شوند (اگر خدا بخواهد و مشکلی پیش نیاد) باید استفاده از کلیدهای جاوااسکریپت را که به نرم افزار اشاره می‌کنند (آنهایی که متکی به Parse.com هستند تا به پایگاه داده مربوطه را پیدا کرده و به آن اشاره کنند) و آنهایی که مستقیما به سرور پارسه ما اشاره دارند را متوقف کنیم.

گام 1: به‌ روزرسانی کتاب‌خانه‌های جاوااسکریپت

اول بیاید فایل Parse.js  را که در index.html استفاده کردیم، به روزرسانی کنیم.

به جای استفاده از ورژن 1.2.19:

می‌رویم به ورژن جدید تر:

هم‌چنین ، بیاید بکبون(Backbone) و لودش(lodash) را اضافه کنیم، در این لحظه پارسه پشتیبانی از بکبون را متوقف کرده است، ما نیاز داریم تاآن را با استفاده از Views و Router اضافه کنیم.

گام 2: اشاره به سرور پارسه خودتان

سپس، بروید به site.js

اولین چیزی که آن‌جا برای به روزرسانی وجود دارد فانکشن ()Parse.initialize است، تا به سرور پارسه ما اشاره کند.

قبل از تغییر ممکن است به این شکل باشد:

اکنون ، به سرور پارسه شما اشاره می کند.

گام 3 : از ری اکت (React) تا بکبون (Backbone)

بیاید یک به روزرسانی سریع برای تغییر تمامParse.View ، Parse.Router بهParse.historyو Backbone.View و Bckbone.Router به Backbone.histrory انجام دهیم، این‌ها دیگر توسط پارسه پشتیبانی نمی‌شوند پس ما نیاز به یک تجدید نظر داریم.

مسلما این چیز دلپذیری نیست که Class هایی مانند آن‌ها را با هم ترکیب و هماهنگ کنیم، اما اگر می‌خواهید آخرین تغییرات را در کدتان ایجاد کرده و آن را اجرا کنید، این ممکن است ساده ترین راه باشد.

گام 4:  مجموعه‌ای از پرسوجو(Query) ; از fetch(رفتن و آوردن) تا find (پیدا کردن)

چیز دیگری که پارسه هم اکنون پشتیبانی نمی‌کنید Collection است. و این بیشتر از سه تای دیگر موجب ناراحتی است. تعویض از Parse.Collection به Backbone.Collection کار نخواهد کرد. ما نیاز داریم تا با استفاده از Parse queries  منطق را دوباره بنویسیم.

برای مثال من از مجموعه Blogs استفاده کردم تا به شما نشان دهم چگونه می‌توانیم وبلاگ خود را بروز رسانی کنیم تا با Parse.js جدید کار کند.

قبلا ما یک Class برای Blogs تعریف کرده بودیم:

سپس در تابع ()BlogRouter.start ما یک نمونه ایجاد می‌کنیم که شامل مجموعه ای از بلاک‌ها است.

بعد از آن ما ()fetch را در مجموعه صدا می‌زنیم تا داده‌های blogs را بگیریم. مشابهش در ()BlogRouter.index

در حال حاضر ما فقط می‌توانیم اعلان کلاس (Class declaration)را حذف کنیم و یک کویری پارسه BlogRouter.blogs  بسازیم، 

و هنگامی که بخواهیم آن را صدا بزنیم، به جای ()fetch از ()find استفاده می‌کنیم.

ازآنجا که تعداد کمی از موارد استفاده مختلف در این سری داشتیم این قسمت ممکن است کمی طولانی شود. ممکن است در این نقطه نیاز باشد کمی مشکل زدایی (debug)کنید، ممکن است هنوز صفحه به درستی رندر نشود حتی اگر داده به درستی واکشی شده باشد.  اگر ترجیح می‌دهید ببینید چیزها همان‌طور که درستشان کردید رندر می‌شوند، از ابتدا تا انتها را بخوانید، و شروع به تغییر کدها و اشکال‌زدایی آن‌ها کنید.

گام 5 : بررسی اشیا نمایش (View Objects)

وقتی تمام داده‌ها به درستی واکشی شوند، چیز دیگری که باید بررسی شود داده‌ای است که شما به شی View منتقل می‌کنید.

قبلا هر چیزی را که می‌خواستیم می‌توانستیم به شی view منتقل کنیم، در این مثال و ما username را به طور مستقیم به blogsAdminView پاس دادیم، بنابر این می‌توانیم به کاربران با نام کاربری آنها خوش آمد بگوییم.

این هم از کار خواهد افتاد، هنگامی که ما View را تغییر می‌دهیم تا ازطریق شی Backbon.View گسترش پیدا کنه (extended) .در حال حاضر ما فقط می‌توانیم به model و collection پاس دهیم.

بنابر این ما نیاز داریم تا currentUser را به عنوان مدل پاس دهیم:

و براساس آن BlogsAdminView را نیز تغییر می‌دهیم.

متذکر می‌شوم که ممکن است کمی نیاز به تست و اشکال‌زدایی داشته باشیم تا مطمئن شویم همه چیز کار می‌کند.

گام 6: به روزرسانی قالب Handelbar برای انتطباق با ساختار داده جدید

در نهایت، بین تغییر نسخه‌ها، ساختار داده شی پارسه نیز کمی تغییر می‌کند.

قبلا تمام اشیا این شکلی بودند:

حالا این ساختار جدید آن‌ها است:

این بدین معنا است که ما باید قالب Handlebar خود را نیز، به روزرسانی کنیم، تا داده‌های جدید را به درستی رندر کند. 

برای مثال ،قبلا برای دسته بندی‌ها در نوار کناری ما این قالب را نوشته بودیم:

حالا باید {{objectId}} را به {{id}} و {{name}} را به {{attributes.name}} به روزرسانی کنیم. 

اکنون صفحه شما رندر می‌شود.

باز هم اگر منطق سایت را به طور کامل و واضح به یاد ندارید ،اگر به مشکل خورده‌اید همیشه می‌تونید کد اصلی من را بررسی کنید.

نتیجه گیری

خوش‌بختانه آن به شما کمک خواهد کرد تا داده‌های خود را قبل از این‌که Parse.com خاموش شود ذخیره کنید، یا اگر هر زمان نیاز دارید کدهای خودرا احیا کنید. شما تمام داده‌هایتان را بعد از 28 ژانویه 2017 از دست خواهید داد، اما اگر کدها را به روزرسانی کنید، آن‌ها را خواهید داشت و آن‌ها دوباره عمل خواهند کرد.

بازهم برای من فوق العاده غم انگیز است که Parse.com  دیگر هیچ‌وقت در حال اجرا نخواهد بود و این سری آموزشی برای تازه کاران کار نخواهد کرد (مگر این که آن‌ها به این قسمت پایانی رجوع کنند). اما خوش‌بختانه به تعدادی کمک کرد تا یاد بگیرند چگونه کد وب سایت بنویسند.

از این نقطه به بعد هر چیزی که برای مهاجرت انتخاب کنید با زبان جدید یاد بگیرید، تمام آن به خود شما بستگی دارد، امیدوارم این کمی ساده‌تر باشد چون شما تعدادی از مفاهیم مفید را این‌جا یاد گرفتید.

اگر این سری آموزشی مفید بوده کامنت بگذارید، با بهترین آرزو ها!

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.