توسعه Dark Mode با استفاده از React Hooks

 

دانلود ویدیو

 

در این ویدیو آموزشی با استفاده از Custom Hookها در React توسعه Dark Mode را انجام می‌دهیم.

Hookها در به روز رسانی ۱۶٫۸ کتابخانه React ارایه شدند. با استفاده از این توابع Hook می‌توانیم تمام فرآیندهایی که در کلاس کامپوننت‌ها انجام می‌شدند را در فانکشنال کامپوننت‌ها انجام دهیم.

از مفاهیم مهم در Hookها، توسعه Custom Hook می‌باشند. با استفاده از این نوع Hookها می‌توانیم توابعی توسعه دهیم که به صورت داینامیک قابل استفاده مجدد هستند.

 

[button class=”github-btn” href=”http://frontcast.ir/async-javascript”]ویدیوی آموزشی: فرآیندهای Asynchronous در جاوااسکریپت[/button]

 

 

دیدگاه‌ها:

محمد نادری

بهمن 18, 1400  در  11:48 ق.ظ

سلام وقتتون بخیر
راهی هست که دیگه inline-style ندیم و کلاس بدیم ؟

مسعود صدری

بهمن 21, 1400  در  2:54 ب.ظ

سلام
وقت شما هم بخیر.
پیشنهاد می‌کنم این مقاله رو مطالعه کنید:
https://css-tricks.com/easy-dark-mode-and-multiple-color-themes-in-react

meysam1366

آذر 28, 1399  در  8:28 ب.ظ

سلام عالی بود آقا مسعود
ممنون

مسعود صدری

آذر 28, 1399  در  8:28 ب.ظ

سلام
ممنون از شما.

aminda

آذر 10, 1399  در  10:00 ق.ظ

خیلی خوب توضیح دادید مفاهیم رو
تشکر از شما

مسعود صدری

آذر 10, 1399  در  2:57 ب.ظ

سلام
ممنون از شما.

farhadm

آذر 9, 1399  در  11:12 ق.ظ

سلام
چگونه میتونید قبل از رندر شدن ، مقدار بک گراند را ست کنیم؟
چون وقتی که روی دارک مود قرار دادین و صفحه رو رفرش کردین خیلی سریع ابتدا صفحه سفید بود بعد که رندر شد به دارک تغییر کرد.
ممنون

مسعود صدری

آذر 9, 1399  در  11:19 ق.ظ

سلام
زمانی که از useEffect استفاده می‌کنیم، تابع آرگومان useEffect دقیقا بعد از رندر کامپوننت اجرا می‌شه.
این موضوع برای مدیریت Side Effectها است.
لطفا هوک useLayoutEffect رو بررسی کنید.
https://reactjs.org/docs/hooks-reference.html#uselayouteffect

افزودن دیدگاه جدید