آموزش فریم ورک Express.js – بخش دوم

آموزش فریم ورک Express.js – بخش دوم

در قسمت قبل اندکی با مبانی فریم ورک ExpressJS آشنا شدیم و با استفاده از ماژول توکار http یک سرور ساده راه اندازی کردیم. اجازه دهید با استفاده از این API، سرور قبل را به چیزی بهتر تبدیل کنیم.  😉

 

بیایید فرض کنیم که می خواهیم کد قبل را بصورتی تغییر دهیم که کاربر با درخواست صفحه ای مشخص، پیامی مناسب با آن صفحه به او نمایش دهد. ساده به نظر می رسد نه؟! پس بیایید هک را شروع کنیم.  😈

 

 

همانطور که مشاهده می کنید، کد فوق بسیار واضح است. شما می توانید با تغییر در کدها، فریم ورکی مثل Express.js را پیاده ساده کنید.

 

Middleware، لایه میانی

 

لایه میانی این جاوا اسکریپت را middleware گویند. فعلا نیازی نیست “middleware چیست” را در سایت ها جستجو کنید، می توانید برای شروع از مثال های زیر شروع کنید.

 

یک مقدار کد Express

 

اجازه دهید فرض کنیم می خواهیم برنامه Hello World را که در قسمت قبل با NodeJS درست کرده بودیم را این بار با استفاده از Express پیاده سازی کنیم. فراموش نکنید که باید Express را با دستور npm install express نصب کرد.

 

install express

 

وقتی نصب ماژول را به اتمام رساندید، برنامه ما بصورت زیر خواهد بود:

 

 

در اینجا، ما با استفاده از تابع require ماژول Express را به برنامه خود اضافه کرده ایم. و به دنبال آن ماژول HTTP را درست مثل قبل به برنامه اضافه کردیم.

 

توجه داشته باشید که پیکج ها بعد از نصب در دایرکتوری node_modules نصب می شوند.

 

در ادامه، درست مثل مثال قبل، متغیری به نام app را تعریف کرده ایم که به جای ساخت سرور، نمونه جدیدی از express() را در متغیر app قرار دادیم.

 

آنگاه تعدادی middleware به برنامه اضافه کرده ایم. این تنها یک تابع است. ما این را به app.use پاس می دهیم. پیشنهاد می کنم برای اینکه با این نوع از سینتکس آشنا شوید تمام کدها را تایپ کنید و از کپی / پست استفاده نکنید. 😉

 

آنگاه در آخر، سرور را ایجاد و در پورت 3000 تنظیم می کنیم. در این مثال http.createServer یک تابع به عنوان پارامتر قبول می کند، همانطور که حدس زده اید، app یک تابع است. این یک تابع ساخته شده برای Express است که شروع به اجرا تمام middleware ها می کند تا اینکه به آخر برسد. اما توجه داشته باشید این یک کنترل کننده درخواست می باشد که قبلا دیدیم.

 

شاید در کدهای توسعه دهندگان دیگر مشاهده کنید که از app.listen(3000); استفاده می کنند. این نو سینتکس کوتاه شده کد قبل می باشد.

 

خیلی خوب حال بیایید middleware را توضیح دهیم.

 

middleware چیست؟

 

آیا به یاد دارید که در مثال های فوق و بخش قبل، به درخواست ها رسیدگی می کردیم؟ خیلی خوب، هر بخش از middleware خود یک درخواست است. یعنی شروع به رسیدگی به اولین request می کنید، و بعد به request بعدی مراجعه می کند و همینطور ادامه می یابد. (درست مثل if یا for تو در تو).

 

این تکه کد ساده، اساس کار middleware را نشان می دهد:

 

 

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

 

 

اگر این برنامه را اجرا کنید به آدرس localhost:3000 مراجعه کنید، خواهید دید که سرور تعدادی عملیات را چاپ می کند و همچنین Hello World را در صفحه مرورگر مشاهده می کنید.

 

آموزش node.js

 

این مهم است که توجه داشته باشید که هر چیزی که در سرور Node.js کار می کند در middleware نیز کار می کند. به عنوان مثال، اگر بخواهید فعالیت req.method را زیر نظر بگیرید، این حق وجود دارد.

 

درحالی که شما کاملا مختارید کد خود را از صفر بنویسید، اما صدها middleware جذاب در بیرون وجود دارد که می توانید از آنها استفاده کنید. اجازه دهید کد فوق را که قبلا آن را نوشته بودیم را با یکی از middleware های محبوب یعنی Morgan بازنویسی کنیم.

 

ماژول Morgan را با دستور npm install morgan نصب کنید

 

ابتدا برنامه را بصورت زیر ویرایش کنید:

 

 

 

حال سرور را اجرا کنید و به آدرس localhost:3000 مراجعه کنید، خروجی را در مرورگر و کنسول بررسی کنید:

 

 

نصب npm


 

اجازه دهید به عنوان مثال دیگر، فرض کنیم می خواهیم با استفاده از ترکیب چند middleware برنامه ای را درست کنیم:

 

 

سرور را اجرا کنید و به صفحات / و about و صفحه که وجود ندارد مراجعه کنید.

 

ماژول morgan

 

بله، حال ما توانستیم فریم ورک شخصی خود را درست کنیم، حالا که با پشت برده فریم ورک Express آشنا شدیم، حال زمان مناسبی است که به لایه بالاتر یعنی route منتقل شویم. اما باید تا آماده شدن پست بعدی منتظر بمانیم. 🙂 البته منتظر نظرات شما هم هستم. 😉