ساخت یک Notion Clone با React و TypeScript

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

• یاد بگیرید چگونه یک اپلیکیشن React را با TypeScript ایجاد کنید.
• درک مزایای اپلیکیشن‌های React TypeScript
• ساخت یک پروژه پورتفولیوی جامع و برجسته که کارفرمایان را شگفت‌زده کند.
• چونه اپلیکیشن‌های React TypeScript را تست کنید؟
• تکنیک‌های پیشرفته UI، مانند درگ و دراپ کردن، برای ایجاد رابط‌های کاربری تعاملی
• مهارت‌های برنامه‌نویسی Type-safe برای داشتن کدی مطمئن‌تر و قابل نگهداری‌تر

چرا این پروژه React TypeScript فوق‌العاده است؟

زیرا فرصتی عالی برای یادگیری چگونگی استفاده از React با TypeScript در حین ساخت یک پروژه پورتفولیو است!

این زمین بازی شما برای بررسی، یادگیری و خلق چیزی واقعاً تأثیرگذار است. نه تنها مهارت‌های فنی خود را تقویت خواهید کرد، بلکه اپلیکیشنی شایسته پورتفولیو خواهید ساخت که فریاد می‌زند: «من می‌توانم اپلیکیشن‌های پیچیده و Full-stack بسازم، بدون هیچ زحمتی!»

در اینجا آنچه در این پروژه React TypeScript خواهید آموخت آمده است:

اول از همه، React.js وجود دارد. این روزها نان و کره توسعه وب است. مدرس شما را با ایجاد کامپوننت‌ها، کار با DOM nodeها، مدیریت رویدادها مانند یک حرفه‌ای و مدیریت State هم به صورت سراسری و هم محلی آشنا می‌کند. همه چیز درباره واکنش‌گرا و تعاملی کردن اپلیکیشن است تا اطمینان حاصل شود کاربران تجربه‌ای روان دارند. React Router DOM را برای ناوبری در اپلیکیشن فراموش نکنید. پیاده‌سازی مسیرهای خصوصی بررسی خواهد شد تا اطمینان حاصل شود بخش‌های خاصی از اپلیکیشن فقط برای کاربران احراز هویت شده قابل دسترسی است. این یک دانش ضروری برای هر توسعه‌دهنده وب است.

سپس، DNDKit وجود دارد – زیرا چه کسی عاشق کمی درگ و دراپ کردن نیست؟ مدرس نشان خواهد داد چگونه با یک درگ ساده ماوس، المان‌های صفحه را قابل جابجایی کنید. یاد خواهید گرفت اهداف درگ سفارشی راه اندازی کنید و المان‌ها را به‌طور یکپارچه مرتب‌سازی مجدد کنید. این مهارتی است که جلای بیشتری به پروژه‌های شما می‌بخشد.

البته، نمی‌توان TypeScript را فراموش کرد. همه چیز درباره ضدگلوله کردن کد، شناسایی خطاها در مراحل اولیه و روان‌تر کردن فرآیند توسعه است. مدرس به چگونگی استفاده از TypeScript با React، تعریف Typeهای جدید و استفاده از Typeهای کتابخانه‌ها برای تمیزتر و مطمئن‌تر کردن کد خواهد پرداخت.

ابزار Vite بلیط عبور سریع شما برای راه‌اندازی سریع پروژه‌هاست. این یک ابزار ساخت است که تماماً بر سرعت متمرکز است و به شما اجازه می‌دهد پروژه‌های خود را سریع‌تر از همیشه راه‌اندازی کنید، بسازید و اجرا کنید. عاشق کارایی‌ای خواهید شد که به جریان کاری شما می‌آورد.

ابزار Supabase جایی است که داده‌های اپلیکیشن شما زندگی می‌کنند. از مدیریت پایگاه داده گرفته تا ذخیره تصاویر و مدیریت احراز هویت کاربر، همه چیز را پوشش می‌دهد. این ابزاری قدرتمند است که کار Backend را ساده می‌کند و به شما اجازه می‌دهد بیشتر روی ایجاد تجربیات کاربری شگفت‌انگیز تمرکز کنید.

در نهایت، CSS Modules انتخاب اصلی برای استایل‌دهی خواهد بود. با تداخل‌های استایل خداحافظی کنید و به CSS ماژولار و قابل استفاده مجدد که ظاهر اپلیکیشن را خیره‌کننده می‌کند، سلام کنید.

اگر آماده‌اید این ایده پروژه Full-stack React فوق‌العاده (و با پاداش) را واقعی کنید، بیایید شروع کنیم!

صبر کنید... پروژه چیست؟

یکی از رایج‌ترین چیزهایی که از دانشجویان می‌شنویم این است: «می‌خواهم پروژه‌های بیشتری بسازم!»

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

اما همچنین... وقتی واقعاً چیزی واقعی می‌سازید حس بسیار خوبی دارد!

به همین دلیل است که ما پروژه‌های ZTM را ایجاد کردیم. مجموعه‌ای از پروژه‌های جامع پورتفولیو و تمرینی که می‌توانید برای ارتقای دانش، یادگیری مهارت‌های جدید، ساخت پورتفولیو و گاهی اوقات فقط برای تفریح از آن‌ها استفاده کنید!

چه چیزهای دیگری باید بدانم؟

با عضویت در ZTM، شما نه تنها به تمام دوره‌ها، بایت‌ها و پروژه‌های ما دسترسی خواهید داشت.

بلکه همچنین می‌توانید به کلاس درس آنلاین و زنده اختصاصی ما بپیوندید تا در کنار هزاران دانشجو، فارغ‌التحصیل، منتور، دستیار آموزشی و مدرس یاد بگیرید.

مهم‌تر از همه، شما از یک حرفه‌ای صنعت یاد خواهید گرفت که تجربه واقعی در استفاده از React و TypeScript برای ساخت پروژه‌ها دارد. او استراتژی‌ها و تکنیک‌های دقیقی را که در نقش خود استفاده می‌کند، به شما آموزش می‌دهد.

در نهایت، مانند تمام دوره‌های ZTM، این دوره یک موجود زنده است. با تغییر چشم‌انداز، به طور مداوم به‌روز می‌شود تا بتوانید از آن به عنوان منبع اصلی خود برای ساخت ایده‌های پروژه React اکنون و در طول حرفه خود استفاده کنید.

به هزاران فارغ‌التحصیل Zero To Mastery بپیوندید که استخدام شده‌اند و اکنون در شرکت‌هایی مانند Google ،Tesla ،Amazon ،Apple ،IBM ،JP Morgan ،Facebook ،Shopify و سایر شرکت‌های برتر فناوری کار می‌کنند.

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

بنابراین هیچ دلیلی وجود ندارد که شما هم نتوانید یکی از آن‌ها باشید.