آموزش طراحی سیستم‌های فرانت‌اند مقیاس‌پذیر - آخرین آپدیت

دانلود Designing Scalable Frontend Systems

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

با اطمینان در دور بعدی مصاحبه طراحی سیستم فرانت‌اند حاضر شوید

طراحی فرانت‌اند برای دفتر سفارشات ارز دیجیتال (Crypto Orderbook)

تفاوت بین HLD (طراحی سطح بالا) و LLD (طراحی سطح پایین)

آگاهی از انتظارات مصاحبه‌کننده

ارائه کامل HLD / LLD

ایجاد دیاگرام توالی (Sequence Diagram) کامل

شناسایی پشته فناوری مناسب (Tech Stack)

جنبه‌های در نظر گرفته شده برای مورد استفاده (Use Case)

بهره‌گیری از مکانیزم قالب‌بندی عمومی (Generic Templating Mechanism)

طراحی معماری مبتنی بر کامپوننت (Component-based Architecture)

شناسایی کامپوننت‌ها در رابط کاربری (UI)

شناسایی تعاریف اسکیمای API (API Schema Definitions)

اتصال به سرویس‌های پایین‌دستی (Downstream Services)

نوشتن کد شبه (Pseudo code) برای حل مسئله

دانلود فایل طراحی کامل

پیش‌نیازها:

  • اتصال اینترنت فعال
  • لپ‌تاپ / دسکتاپ

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

دقیقاً ۱ سال پیش، در فوریه ۲۰۲۱، من برای موقعیت E5 (Senior SDE) در فیس‌بوک، لندن (تیم اصلی React) مصاحبه دادم. اما نمی‌دانستم که رویای من برای کار با Dan Abramov به خاطر ۱ اشتباه از بین خواهد رفت.

من دور طراحی را نادیده گرفتم.

فکر می‌کردم قبولی در مصاحبه فقط به این است که نشان دهم می‌توانم مسائل را حل کنم و ویژگی‌هایی را که مصاحبه‌کننده از من می‌پرسد پیاده‌سازی کنم.

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

سلام، نام من Manoj Satishkumar است.

من در بیش از ۳۵ شرکت مصاحبه کرده‌ام و در شرکت‌های متعددی از جمله Walmart، PayPal، Oracle، Tesco، JP Morgan و Cerner پذیرفته شده‌ام. این یک جلسه زنده است که من برای تمام جویندگان شغلی که می‌توانند دور کدنویسی را رد کنند اما نمی‌توانند دور طراحی را بگذرانند، برگزار کردم.

من سعی می‌کنم روشن کنم که مصاحبه‌کنندگان در دور طراحی فرانت‌اند به چه جنبه‌هایی توجه می‌کنند. ما HLD / LLD / دیاگرام‌های بلوکی توالی را به صورت عمیق ترسیم خواهیم کرد و همچنین در این جلسه کد شبه خواهیم نوشت.

"من برای شما در مصاحبه‌های آینده آرزوی موفقیت دارم"


سرفصل ها و درس ها

مقدمه جلسه Introduction to the session

  • چرا باید طراحی سیستم را یاد بگیرید؟ Why should you learn system design?

  • به جلسه خوش آمدید Welcome to the session

  • درباره مدرس About the instructor

  • پیشینه فیسبوک The facebook background

  • دور طراحی ... آماده ... شروع کنید Design ... Round ... Ready

  • دستور جلسه - چه چیزی یاد خواهید گرفت؟ Agenda - What will you learn ?

  • نمودارها و کد شبه Diagrams and pseudo code

  • شروع کنیم! Let's get started !

سوال دور طراحی The Design Round Question

  • دفتر سفارش مبادله ارز دیجیتال The crypto exchange order book

  • انتظارات مصاحبه کننده Interviewer's expectations

  • تفاوت بین HLD و LLD Diffferences between HLD & LLD

طراحی سطح بالا ( HLD ) High Level Design ( HLD )

  • مرور سریع سوال A quick recap of the question

  • لایه فرانت، لایه میانی و کلاینت پایگاه داده Front-tier, Mid-tier and DB client

  • واحد رندر مبتنی بر الگو Template based rendering unit

  • خلاصه سریع HLD Quick Summary of HLD

طراحی سطح پایین ( LLD ) Low Level Design ( LLD )

  • بیایید با LLD شروع کنیم Let's get started with LLD

  • دنباله توضیحات The sequence of explanation

  • انتخاب فریم‌ورک‌های فرانت‌اند Choosing the frontend frameworks

  • کتابخانه‌ها / فریم‌ورک‌های فرانت‌اند در بازار Frontend libraries / frameworks in the market

  • React.js - نگاهی سریع React.js - Quick look

  • فریم‌ورک Angular - نگاهی سریع Angular framework - Quick look

  • Vue.js - نگاهی سریع Vue.js - Quick look

  • نتیجه‌گیری در مورد انتخاب کتابخانه Conclusion on choosing the library

  • نمایش پشته تکنولوژی Representing the tech stack

  • شناسایی مولفه‌های UI Identifying the UI components

  • تعیین تعاریف schema API Determining API schema definitions

  • شناسایی تعریف الگو Identify the template definition

  • کمی کد شبه بنویسیم Let's write some pseudo code

  • خلاصه سریع LLD Quick summary of LLD

نمودار توالی The Sequence Diagram

  • دریافت داده‌های دفتر سفارش Getting the order book data

  • ثبت سفارش خرید Placing a buy order

نکات پایانی Closing notes

  • مرور سریع جلسه A quick recap of the session

  • فایل طراحی را دانلود کنید Download the design file

  • دسترس‌پذیری در سیستم‌های فرانت‌اند Accessibility in frontend systems

  • تبریک می‌گویم! اکنون برای دور طراحی آماده هستید. Congratulations! You are now design round ready.

سخنرانی‌های اضافی BONUS Lectures

  • میکرو فرانت‌اندها چه هستند؟ What are micro frontends ?

نمایش نظرات

آموزش طراحی سیستم‌های فرانت‌اند مقیاس‌پذیر
جزییات دوره
2 hours
36
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
2,468
3.9 از 5
دارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Manoj Satish Kumar Manoj Satish Kumar

بنیانگذار @mskwebdevelopment.com

من یک دهه تجربه در ساخت وب سایت های حرفه ای و برنامه های کاربردی دارم. من هم در استارتاپ ها و هم در شرکت های غول پیکر کار کرده ام. من اینجا هستم تا به شما کمک کنم تا یک توسعه‌دهنده وب موفق باشید و به شما کمک کنم این مصاحبه‌های فرانت‌اند را شکست دهید.

من به عنوان یک مهندس نرم افزار شروع کردم و کم کم متوجه شدم که علاقه زیادی به تدریس دارم. مادرم معلم ریاضی بود و من راه او را دنبال می‌کنم - با این تفاوت که توسعه وب تدریس می‌کنم.

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

من عاشق اکوسیستم جاوا اسکریپت هستم و چندین محصول را در حرفه خود طراحی کرده ام.

من در تجارت الکترونیک، صنایع نیمه هادی بهداشت و درمان کار کرده ام. من تجربه عملی در Javascript، React، Redux، Material UI، Node، Express GraphQL دارم.

من توسعه وب MSK را با هدف کمک به مهندسان فرانتند برای شغل ایجاد کردم.