MentorDev
326 subscribers
372 photos
10 videos
10 files
52 links
🚀Mentoring 🔰UI🔰UX🔰Design🔰Develop🔰Tips🔰Tricks,...

Mentoring: https://mentorjet.org

Contact us: @FazelMatt
Download Telegram
5 اشتباه رایج در استفاده از gradient

Scale
با افزایش مقیاس گرادیانت حالت یکنواختی آن را از بین نبرید.

Light-Dark
گرادیانت هایی که دارای تفاوت روشنایی زیادی هستند در خیلی جاها قابل استفاده نیستند.

Placement
زمانی که از گرادیانت دایره‌ای استفاده میکنید رنگ تیره تر را وسط قرار ندهید.

Rainbow
لطفا گرادیانت ها رو رنگارنگ نکنید.

Too Saturated
از رنگ های خیلی اشباع شده استفاده نکنید، چشم هارو اذیت میکنه.


#gradient
#UI

@frontdevir
ورژن 5 Bootstrap به طور رسمی ریلیز
شد.

#bootstrap

@frontdevir
رنگ و کنتراست توجه را به خود جلب می کند.

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

_credit ui-ux

#UI #UX

@frontdevir
همترازی چشم ها را هدایت می کند.

همترازی بخشی از اسکلت طرح است که طبق آن عناصر در یک طرح قرار می گیرند، و مشخص می کند که عناصر بصری(متن یا تصویر)، به شکل دلخواه و تصادفی در یک ترکیب قرار نمی گیرند. به عنوان مثال، در یک صفحه معمولی که متن آن در سمت چپ ترازبندی شده است، اشیاء موجود در صفحه مشترکا در حاشیه سمت چپ قرار می گیرند.

_credit ui-ux

#UI #UX

@frontdevir
you-dont-know-js.pdf
5 MB
You Don't Know JS

از کتاب های مهم منتشر شده ی در ارتباط با جاواسکریپت قطعا می توان به کتاب you don’t know js رسید که برای هر توسعه دهنده یا برنامه نویسی که با javascript مشغول به کار است مطالعه ی این کتاب توصیه می شود.

@frontdevir
تو ۵ دقیقه ری‌اکت رو مرور کنید.

🔗 https://dev.to/ericchapman/react-cheat-sheet-updated-may-2021-1mcd

#frontend

@frontdevir
🔥 JavaScript array cheat sheet

@frontdevir
پلاگین فیگما

میتونید لینک وبسایتی که دوست دارین رو بهش بدین و اون براتون فایل فیگمای لایه باز اون لندینگ رو
میسازه


🔗 https://www.figma.com/community/plugin/1159123024924461424/html.to.design

@frontdevir
در گیت هاب، ریپوزیتوری های بسیار جالبی وجود داره، که میتونه سطح آمادگیتون برای مصاحبه ها رو بالاتر ببره.
🔥نقاط ضعفت در مصاحبه ها رو به نقطه قوتت تبدیل کن.

🔰Tech interview handbook : https://github.com/yangshun/tech-interview-handbook
🔰Go : https://github.com/inancgumus/learngo
🔰Awesome interview : https://github.com/DopplerHQ/awesome-interview-questions
🔰JS Algorithms : https://github.com/TheAlgorithms/Javascript
🔰Js Algorithms and Data Structures : https://github.com/trekhleb/javascript-algorithms
🔰JS clean code : https://github.com/ryanmcdermott/clean-code-javascript
🔰Vue JS : https://github.com/sudheerj/vuejs-interview-questions
🔰HTML 5 : https://github.com/learning-zone/html-interview-questions
🔰React : https://github.com/learning-zone/react-interview-questions
🔰JS : https://github.com/learning-zone/javascript-interview-questions
🔰Angular : https://github.com/sudheerj/angular-interview-questions
🔰JS : https://github.com/sudheerj/javascript-interview-questions
🔰Front End : https://github.com/h5bp/Front-end-Developer-Interview-Questions
🔰Angular : https://github.com/Yonet/Angular-Interview-Questions
🔰System Design : https://github.com/shashank88/system_design
🔰Python : https://github.com/learning-zone/python-interview-questions
🔰Go : https://github.com/shomali11/go-interview
🔰Front End : https://github.com/khan4019/front-end-Interview-Questions
🔰30 seconds of interviews : https://github.com/30-seconds/30-seconds-of-interviews
🔰Full Stack : https://github.com/indy256/Full-stack-Developer-Interview-Questions-and-Answers
🔰React : https://github.com/Pau1fitz/react-interview
🔰Linux SysAdmin : https://github.com/chassing/linux-sysadmin-interview-questions
🔰Back End : https://github.com/arialdomartini/Back-End-Developer-Interview-Questions
🔰Reverse Interview : https://github.com/viraptor/reverse-interview
🔰JS : https://github.com/ganqqwerty/123-Essential-JavaScript-Interview-Questions
🔰Android : https://github.com/MindorksOpenSource/android-interview-questions
🔰Front End : https://github.com/h5bp/Front-end-Developer-Interview-Questions
🔰React : https://github.com/sudheerj/reactjs-interview-questions
🔰How Web works : https://github.com/vasanthk/how-web-works?ref=hackernoon.com
🔰Front End interview hand book : https://github.com/yangshun/front-end-interview-handbook?ref=hackernoon.com
🔰JS : https://github.com/sudheerj/javascript-interview-questions?ref=hackernoon.com
🔰JS : https://medium.freecodecamp.org/the-definitive-javascript-handbook-for-a-developer-interview-44ffc6aeb54e
🔰Vue : https://www.onlineinterviewquestions.com/vue-js-interview-questions/
🔰React : https://www.sitepoint.com/react-interview-questions-solutions/
🔰Front End : https://itnext.io/frontend-interview-cheatsheet-that-helped-me-to-get-offer-on-amazon-and-linkedin-cba9584e33c7
🔰Google Interview Warm up : https://grow.google/certificates/interview-warmup
🔰Interview Practices : https://pramp.com
🔰Data Science : https://github.com/ShuaiW/data-science-question-answer
🔰Front End : https://h5bp.github.io/Front-end-Developer-Interview-Questions
🔰HTML, CSS, JS : https://www.acefrontend.com
🔰Android : https://code.coursesity.com/android-interview-questions
🔰DevOps : https://github.com/Tikam02/DevOps-Guide
🔰Web 3 : https://github.com/noahliechti/web3-interview-preparation
🔰PHP : https://github.com/learning-zone/php-interview-questions
🔰Laravel : https://github.com/Devinterview-io/laravel-interview-questions
🔰PHP : https://github.com/learning-zone/php-interview-questions

سایت ها و ریپوزیتوری های این قسمت فقط اختصاص به یک موضوع ندارند و چندین فیلد رو شامل میشوند 👇
🔰https://workat.tech/practice
🔰https://github.com/FAQGURU/FAQGURU
🔰https://bigfrontend.dev
🔰https://github.com/kdn251/interviews
🔰https://www.fullstack.cafe
🔰https://github.com/ombharatiya/FAANG-Coding-Interview-Questions
🔰https://github.com/Olshansk/interview
🔰https://github.com/jwasham/coding-interview-university
🔰https://github.com/Olshansk/interview
🔰https://github.com/huihut/interview/blob/master/README_en.md


#InterviewRepo
🔥3👍2
Introduction to StyleX
StyleX is a simple, easy to use JavaScript syntax and compiler for styling web apps.
StyleX combines the strengths and avoids the weaknesses of both inline styles and static CSS. Defining and using styles requires only local knowledge within a component, and avoids specificity issues while retaining features like Media Queries. StyleX builds optimized styles using collision-free atomic CSS which is superior to what could be authored and maintained by hand.

https://stylexjs.com/


@frontdevir
👍1
جابجایی State، یکی از ساده‌ترین راه‌ها برای جلوگیری از رندر نشدن اجزای پر هزینه است .


@frontdevir
👍21🔥1
توی React تغییرات Ref رو با useEffect
چک نکنید.

#react #hooks

@frontdevir
👍3
1702181653780.gif
2.6 MB
الگو های معماری نرم افزار:

-> MVC, MVP, MVI, MVVM and VIPER

@frontdevir