ویرگول
ورودثبت نام
مرتضی دلیل
مرتضی دلیل
خواندن ۶ دقیقه·۳ سال پیش

آموزش Node و Typescript برای تولید api

برای دیدن ویدیوهای من در مورد برنامه نویسی عضو این کانال شوید :
https://t.me/mediapub_channel

میخواهیم یک تمپلیت ساده برای پروژه Node به منظور تولید api بسازیم و به جای جاوااسکریپت از تایپ اسکریپت(Typescript) استفاده کنیم. اگر علاقه ای به تایپ اسکریپت ندارید (که بعید است) میتوانید همین پروژه را با صرف نظر از بخش های مرتبط با تایپ اسکریپت با جاوااسکریپت پیاده سازی کنید و تغییر چندانی در روند کدنویسی نخواهید داشت. پس مراحل موجود در همین مقاله را پیگیری کنید.

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

تایپ اسکریپت یک پوشش کمک کننده در روند کدنویسی است. در نهایت شما کدهایتان را به کمک کامپایلر تایپ اسکریپت به جاوااسکریپت تبدیل میکنید. پس به لحاظ سرعت و پرفورمنس چیزی از دست نخواهید داد.

در این نوشته :

  • فرض شده که شما میدانید جاوااسکریپت و Node js چه هستند و Node را روی سیستم نصب کرده اید.
  • فرض شده که ویژوال کد(Visual Code) را روی سیستم نصب دارید.
  • فرض شده مفهوم Environment Variables را میدانید.
  • فرض شده که مفهوم Api و Http Request را میدانید.

در ادامه خواهید دید که برای ایجاد این تمپلیت کارهای عجیب نکرده ایم. مثلا از دکوریتورها (decorator) برای راحت تر کردن شکل دسترسی ها استفاده نکرده ایم. روتینگ(routing) را پیچیده نکرده ایم. میدل ویرهای(middleware) عجیب ننوشته ایم. معماری Clean Architecture را بطور کامل پیاده سازی نکرده ایم.(برای درک بیشتر این معماری این مقاله را بخوانید) این یک پروژه ساده و «کار راه انداز» است و به درد میکروسرویس هایی که وظایف کوچک دارند میخورد. (نمیدانید میکروسرویس چیست؟ این مقاله را بخوانید)

مراحل زیر را به ترتیب طی می کنیم.

1. ایجاد فولدر پروژه : فولدری به نام EcommerceMicroservics میسازیم و فولدر Catalog.Api را داخل آن ایجاد میکنیم. این فولدر را در ویژوال کد باز میکنیم. (با دستور . Code) حالا ترمینال ویژوال کد را باز میکنیم و ادامه میدهیم (با شورتکات ctrl+` )

2. اطمینان از نصب Node : مطمئن میشویم node و npm را روی سیستم داریم. برای اینکار داخل ترمینال Visual Code عبارت node --version و npm --version مینویسیم.

3. ایجاد پروژه Node : با دستور npm init پروژه درست میکنیم و سوالات را به شکل زیر جواب میدهیم.(فلش های سبز را جواب میدهیم، بقیه برای شروع کار اهمیتی ندارند) چون میخواهیم از تایپ اسکریپت استفاده کنیم.فایل استارتاپ را به نام server.ts مشخص میکنیم.


در نهایت یک فایل package.json با محتوای اطلاعات وارد شده ایجاد میشود.

4. نصب کتابخانه های مربوط به زمان توسعه : کتابخانه های زیر را نصب میکنیم

npm i -g typescript nodemon ts-node prettier

nodemon : ابزاری برای واچ کردن تاثیر تغییرات روی کد در حین اجرا و دیباگ است

Ts-node : ابزاری برای ایجاد محیط تایپ اسکریپت در توسعه نود است

Prettier : مرتب کننده کد

دقت کنید که به شکل گلوبالی نصب میکنیم(آپشن g-) چون میتوانیم به شکل جدا و مستقل در هر پروژه ای آنها را فراخوانی کنیم.

5. نصب اکستنشن روی ویژوال کد : مطمئن میشویم اکستنشن Prettier روی ویژوال کد نصب باشد تا کدهای ما با فرمت مناسب مرتب سازی شوند.

6. ایجاد فایل تنظیمات تایپ اسکریپت : دستور زیر را برای ایجاد فایل تنظیمات تایپ اسکریپت اجرا میکنیم.

tsc --init

با اینکار tsconfig.json ایجاد میشود. در این فایل پراپرتی outDir برای تنظیم فولدر فایل های جاوااسکریپت تولید شده توسط کامپایلر تایپ اسکریپت تعریف میشود. مقدارش را مثل شکل زیر build قرار میدهیم.

7. اضافه کردن اسکریپت بیلد : حالا روش بیلد شدن را در package.json مشخص میکنیم.

چند دستور نوشتیم که با && جدا کردیم.

اولین دستور برای پاک کردن محتوای قدیم فولدر build است. دومین دستور برای مرتب سازی کدهای موجود در فولدر source است و آخرین دستور یعنی tsc فایل های ts را کامپایل کرده و js تولید میکند.

در ویندوز برای ایجاد و حذف فولدر، به کمک npm دو کتابخانه rimraf و mkdir را نصب کنید و خط build را به شکل زیر بنویسید.
&quotbuild&quot: &quotrimraf ./build && prettier --write source/ && tsc&quot

به کمک دستور npm run build آنچه در پراپرتی build داخل پراپرتی scripts از فایل package.json تعریف کرده ایم اجرا میشود.

8. نصب کتابخانه های مربوط به تولید api : پکیج های مورد نیاز دیگر را نصب میکنیم. (اینبار گلوبالی نیست و برای همین پروژه است)

npm i express body-parser dotenv

اکسپرس : کتابخانه ای که ابزار لازم برای ایجاد api را به ما میدهد.
بادی پارسر : مفسری برای تشخیص دیتای ارسال شده به شکل ریکوئست است.
دات اِنو : دسترسی به متغیرهای environment را به ما میدهد

9. نصب type definition های کتابخانه ها :
باید کتابخانه ای برای ایجاد اینترفیس های قابل فهم توسط تایپ اسکریپت به ازای هر پکیج مرتبط با توسعه ی کد، نصب کنیم.

npm i @types/express @types/body-parser @types/dotenv

10. تنظیمات اکستنشن prettier : از روی داکیومنت مربوط به prettier باید تنظیمات آن را در یک فایل به نام .prettierrc ایجاد کنیم

https://gist.github.com/48cf9aeb20f84cc127a8a59ccff8d0b2

11.تنظیمات پروژه : تظیمات مربوط به پروژه را در فایل setting.json به شکل زیر ایجاد میکنیم. تنظیمات مربوط به اکستنشن prettier و رفتار ویژوال کد با پروژه ماست.

https://gist.github.com/9c82a69f01fb414be1c3ffca4d61c4f5


ایجاد فایل های مورد نیاز پروژه

  1. فایلی برای تنظیمات اولیه پروژه ایجاد میکنیم که مثلا روی چه ip و پورتی هاست شود. این فایل شروطی دارد که اگر environment variable ما متغیرهای مورد نظر را نداشت از مقادیر پیش فرض استفاده کند. این فایل را در فولدر source/configs به نام config.ts ایجاد میکنیم.
https://gist.github.com/30ee64d7da37424d5fc418f50fa7e046

2. فایلی برای متدهای لاگ تعریف میکنیم که فرمت دلخواه و مناسب پروژه شما را باید داشته باشد. این فایل را در مسیر source/configs/log.ts ایجاد میکنیم.

https://gist.github.com/eac118248b42b078c1691110f3510e33

3. فایل شروع کننده را به نام server.ts میسازیم. این فایل نیاز به توضیحاتی دارد که در داخل کد کامنت شده است.

https://gist.github.com/f16069624cbb608a7ba602f2ce673424

4. برای اجرای پروژه از دستور زیر استفاده میکنیم. با این روش هر بار تغییری روی پروژه صورت گیرد کل پروژه دوباره اجرا میشود.

nodemon source/server.ts

5. در مرورگر یا پستمن localhost:4300 را صدا میزنیم. باید پیامی که بعنوان خطا در میدل ویر تعریف کردیم برگرداند چون هیچ روت دیگری ندارد. در ادامه روت و متد های کنترلر را ایجاد میکنیم. ابتدا در ترمینال ویژوال کد با Ctrl+C اجرای پروژه را متوقف کنید.

6.یک متد ساده بعنوان تست در مسیر source/controllers/test.ts ایجاد میکنیم که مقداری را برگرداند و آن را به یک روت (Route) متصل میکنیم.

https://gist.github.com/d756e81282607c474e5cebd6125be9e3

7.یک متد ساده برای تعیین Route در مسیر source/routes/test.ts ایجاد میکنیم که روت ها را به متدهای شماره 5 مپ کند.

https://gist.github.com/76783d8ff1927715ae4403bb9d6d92e5

8. با دستور nodemon source/ts پروژه را اجرا میکنیم و در مرورگر یا پستمن آدرس localhost:4300/test/healtcheck را صدا میزنیم. باید عبارت health check Ok! را ببینید.

9. برای بیلد کردن دستور زیر را مینویسیم و فولدر بیلد ساخته میشود

npm run build

همانطور که در تصویر میبینید این فولدر حاوی فایل های js است و قابل انتقال به سرور برای اجرا است. برای اجرای این فولدر کافیست از دستور node server.js استفاده کنید.

دیباگ در ویژوال کد

برای دیباگ و قراردادن برک پوینت (Break Point) روی خطوط، باید یک فایل launch.json با تنظیمات زیر بسازید. برای اینکار از منوی Run گزینه Add Configuration را انتخاب کنید و کد زیر را بنویسید.

https://gist.github.com/07e25d8b73cb011dcc568d98a5938a85

و حتما در فایل tsconfig.json تغییرات زیر را اعمال کنید.

https://gist.github.com/513a19dbaf01b16f8f71f401a67768a6
اگر فایل شما به این شکل است، پراپرتی ها را پیدا کنید و از کامنت خارج کنید.
اگر فایل شما به این شکل است، پراپرتی ها را پیدا کنید و از کامنت خارج کنید.


حالا به جای نوشتن دستور nodemon با F5 میتوانید پروژه را دیباگ کنید.

اگر علاقمند هستید این پروژه را با یک crud روی دیتابیس mongo تکمیل و در نهایت داکرایز کنید، این مقاله را بخوانید.

برنامه نویسیآموزش nodejsآموزش nodeآموزش typescriptتایپ اسکریپت
برنامه نویس و علاقمند به برنامه نویسی، سینما، فلسفه و هر چیزی که هیجان انگیز باشد. در ویرگول از روزمرگیهای مرتبط با علاقمندیهام خواهم نوشت. در توئیتر و جاهای دیگر @mortezadalil هستم.
شاید از این پست‌ها خوشتان بیاید