آموزش Shadcn UI + Next JS - ساخت داشبوردهای زیبا با shadcn

آنچه یاد خواهید گرفت:

• ارزش خود را افزایش داده و دانش خود را به عنوان توسعه‌دهنده وب بهبود می‌بخشید.
• یاد می‌گیرید که چگونه با استفاده از رابط کاربری shadcn یک داشبورد ایجاد کنید.
• اعتبارسنجی سمت کلاینت را با استفاده از Zod و React-Hook-Form می‌آموزید.
• یاد می‌گیرید که چگونه با استفاده از Recharts، نمودارها و مصورسازی‌های زیبای داده ایجاد کنید.

توضیحات دوره

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

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

چرا این دوره؟

• مسیر یادگیری متمرکز - شما روی ساخت یک داشبورد ویژوال و تعاملی تمرکز می‌کنید. با اولویت دادن به فناوری‌های فرانت‌اند، شما به مهارت‌های مورد نیاز در صنعت توسعه وب تسلط پیدا خواهید کرد.
• رابط کاربری Shadcn و Next.js عملی - یاد می‌گیرید چگونه از رابط کاربری Shadcn در اکوسیستم Next.js استفاده کنید که به شما امکان می‌دهد که ری‌اکت سریع و دارای سرور رندر شده ایجاد کنید.
• فرم‌ها و اعتبارسنجی با Zod - به طور عمیق به طراحی فرم‌ها با react-hook-form پرداخته و اعتبارسنجی سمت کلاینت را با استفاده از Zod پیاده‌ می‌کنید تا اطمینان حاصل شود که تمام داده‌ سالم و بدون به خطر انداختن تجربه کاربری هستند.
• کامپوننت‌های قابل گسترش - با رابط کاربری Shadcn خلاق شده و کامپوننت‌های آن را گسترش می‌دهید. این بخش به شما اجازه می‌دهد که عناصر را با توجه به نیازهای خاص پروژه‌هایتان سفارشی کنید.
• استایل‌دهی با Tailwind CSS - شما از رویکرد utility-first با Tailwind CSS برای استایل‌دهی استقبال می‌کنید. شما یاد خواهید گرفت که چگونه داشبورد خود را به طور موثر طراحی کنید بدون اینکه از راحتی HTML خود خارج شوید.
• نمودارهای تعاملی با Recharts - با Recharts داده‌ را به زیبایی مصورسازی می‌کنید. این ماژول به شما کمک می‌کند تا نمودارهای واکنش‌گرا و قابل سفارشی را در داشبورد خود یکپارچه کنید تا جلوه‌ای زیباتر به آن ببخشید.
• تمرکز خالص بر فرانت‌اند - تمام پروژه‌های دوره با داده‌ کدنویسی سخت و داده ساختگی طراحی شده‌اند. هیچ نگرانی برای پیچیدگی بک‌اند و یا احرازهویت جهت توسعه خالص فرانت‌اند برای بهبود مهارت‌های شما، وجود ندارد.

این دوره برای چه کسانی مناسب است؟

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