روز ۴۴ یادگیری MERN Stack

سرور Express.js من قبلاً فقط داده‌های JSON ارسال می‌کرد. امروز این موضوع را تغییر دادم.

یاد گرفتم چگونه HTML، CSS و تصاویر را مستقیماً از بک‌اند خود سرو کنم. این کار پروژه من را از یک API ساده به یک اپلیکیشن فول‌استک تبدیل می‌کند.

من مسیر یادگیری بک‌اند Complete Coding را برای تسلط بر مسیریابی فایل‌ها (file routing) دنبال کردم.

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

این تنظیماتی است که امروز استفاده کردم:

  • میان‌افزار (Middleware) express.static() Express شامل یک ابزار داخلی به نام express.static() است. این ابزار به شما اجازه می‌دهد پوشه‌ای مانند public یا assets را برای سرو کردن به مرورگر انتخاب کنید.

  • path.join() من از ماژول path در Node.js و متغیر __dirname استفاده کردم. این کار تضمین می‌کند که سرور من فایل‌ها را در ویندوز، لینوکس یا مک بدون خطا پیدا کند.

کد به این صورت است:

const express = require("express");
const path = require("path");
const app = express();
const PORT = 8000;

app.use(express.static(path.join(__dirname, "public")));

app.get("/", (req, res) => {
    res.sendFile(path.join(__dirname, "public", "index.html"));
});

app.listen(PORT, () => {
    console.log(`Server running on http://localhost:${PORT}`);
});

ساختن این مبانی به من کمک می‌کند تا بفهمم وب چگونه کار می‌کند.

منبع: https://dev.to/ali_hamza_589ec7b3eb6688d/day-44-of-learning-mern-stack-3c0m