ডকুমেন্টেশনফাইলে পৃষ্ঠা এবং বিন্যাস
ফ্রন্টএন্ড পেজ
একটি পৃষ্ঠা একটি Nexy অ্যাপ্লিকেশনের মৌলিক একক। এটি src/routes/ এর অধীনে একটি ফাইল দ্বারা সংজ্ঞায়িত একটি URL-অ্যাড্রেসযোগ্য সম্পদ।
ব্যবহার করা ক্লায়েন্ট ফ্রেমওয়ার্ক নির্বিশেষে, প্রতিটি পৃষ্ঠা একই সার্বজনীন জীবনচক্র এবং স্থাপত্যের সীমাবদ্ধতা অনুসরণ করে।
পৃষ্ঠা জীবনচক্র
যখন একজন ব্যবহারকারী একটি পৃষ্ঠায় নেভিগেট করেন, Nexy নিম্নলিখিত পদক্ষেপগুলি সম্পাদন করে:
- রুট ম্যাচিং: রাউটার ইউআরএল-এর সাথে সম্পর্কিত ফাইলটিকে সনাক্ত করে।
- ডেটা ফেচিং: সার্ভারটি প্রয়োজনীয় ডেটা আনতে পৃষ্ঠার Python ফ্রন্টম্যাটার চালায়।
- রচনা: পৃষ্ঠাটি তার নিকটতম
layout.nexy(বা কাঠামো বিন্যাসে) মোড়ানো হয়। - রেন্ডারিং: ফলাফলটি HTML এ রেন্ডার করা হয় (Jinja2, Markdown, বা ফ্রেমওয়ার্ক SSR এর মাধ্যমে)।
- হাইড্রেশন: যদি পৃষ্ঠাটি একটি ক্লায়েন্ট ফ্রেমওয়ার্ক ব্যবহার করে, ব্রাউজারটি স্ট্যাটিক HTML-এর সাথে ইন্টারেক্টিভ লজিক সংযুক্ত করে।
একটি সার্ভার-মোড পৃষ্ঠায় ধাপ 2 থেকে 4: ফ্রন্টম্যাটার আনয়ন করে, টেমপ্লেট রেন্ডার করে এবং রুট লেআউট ফলাফলকে মোড়ানো হয়।
from src.users import all_users users = all_users()<h1>Users</h1><ul> {% for user in users %} <li>{{ user.name }}</li> {% endfor %}</ul>রাউটিং এবং ইউআরএল
রাউটিং কঠোরভাবে ফাইল-ভিত্তিক। ইউআরএলটি ফাইলের পাথ দ্বারা নির্ধারিত হয় src/routes/, বিয়োগ এক্সটেনশনের অধীনে।
ডাইনামিক সেগমেন্ট
একটি রুট তৈরি করতে যা প্যারামিটার দ্বারা পরিবর্তিত হয় (যেমন, একটি ব্যবহারকারীর প্রোফাইল), বর্গাকার বন্ধনী ব্যবহার করুন:
src/routes/user/[id].tsx→/user/123
সেগমেন্টের মান (123) @nexy/client থেকে useParams() হুকের মাধ্যমে পৃষ্ঠায় পাওয়া যায়।
import { useParams } from "@nexy/client"; export default function User() { const { id } = useParams<{ id: string }>(); return <h1>User {id}</h1>;}রুট গ্রুপ
বন্ধনীতে মোড়ানো ফোল্ডারগুলি রাউটার দ্বারা উপেক্ষা করা হয় তবে আপনাকে সাংগঠনিক উদ্দেশ্যে বা ভাগ করা লেআউটগুলির জন্য ফাইলগুলিকে গোষ্ঠীভুক্ত করার অনুমতি দেয়:
src/routes/(auth)/login.tsx→/login
পৃষ্ঠা মেটাডেটা
প্রতিটি পৃষ্ঠা মেটাডেটা (শিরোনাম, বিবরণ, ওপেনগ্রাফ ট্যাগ) নির্ধারণ করতে পারে যা Nexy নথির শেলের মধ্যে ইনজেক্ট করে। একটি .nexy পৃষ্ঠা এটিকে তার ফ্রন্টম্যাটারে, আক্ষরিক বা setMetadata দিয়ে সেট করে:
metadata = {"title": "Blog", "description": "Posts about Nexy"}<h1>Blog</h1>setMetadata হল Python: একটি .tsx, .vue বা .svelte পৃষ্ঠার কোন metadata এক্সপোর্ট নেই, তাই ক্লায়েন্ট মোডে শিরোনাম এবং রুট লেআউটে মেটা ট্যাগ লিখুন। প্রতিটি ক্ষেত্রের জন্য পৃষ্ঠা মেটাডেটা দেখুন।
ফ্রেমওয়ার্ক বাস্তবায়ন
উপরের ধারণাগুলি সর্বজনীন। আপনার নির্দিষ্ট কাঠামোর মধ্যে একটি পৃষ্ঠা কীভাবে বাস্তবায়ন করবেন তা দেখতে, পার্থক্য নির্দেশিকা দেখুন: