Deep Devs | فرانت اند | بک اند | جاوااسکریپت | برنامه نویسی | برنامه نویسی وب – Telegram
Deep Devs | فرانت اند | بک اند | جاوااسکریپت | برنامه نویسی | برنامه نویسی وب
9.19K subscribers
657 photos
354 videos
90 files
813 links
اگر با جاوااسکریپت مشکل داری، این چنل مخصوص خودته 🤝

دوبله بهترین دوره های جاوااسکریپت و ریکت دنیا رایگان:
https://news.1rj.ru/str/DeepDevs/2166

تبلیغات و تبادل نداریم

گروه اصلی برای پرسش و پاسخ:
@DeepDevsGpOriginal

گروه چت:
@InstaDevsGp
Download Telegram
تفاوت طراح وب🪄و توسعه دهنده وب💻

طراح وب:بیشتر با ابزارهای بصری کار میکنند و هیچ وقت کد نمی‌نویسند📏
ایجاد رابط کاربری با ابزارهای گرافیکی مثل فیگما،ادوبی ایکس دی🖋🖌
تنظیم بندی رنگ،لایه بندی وب سایت،تایپوگرافی و...
📏📐
به طور کل:هرآنچه قرار وب سایت ما رو ایجاد کنه در محیط هایی که عرض کردم ایجاد میکنند؛البته به این سادگی و استراکچرهای پیچیده ای رو با جزئیات زیاد باید پیاده سازی کنند!برای هر رابط که قابلیت کلیک داره و یا از لینک استفاده‌ شده،باید بدونند به چه صفحه ای میرن و ساختار اون صفحه رو هم باید پیاده سازی کنند با در نظر گرفتن تطابق رنگ،محتوا و...
🔰پس باید به دلیل نزدیک بودن به مخاطب هدف،ساختار رو جوری پیاده سازی کنه که:☝️🏻
روانشناسی رنگ ها،شیوه طراحی قالب و تطابق اون با موضوع هدف،تایپوگرافی(خلاصه اش اینه که هر محتوایی که می‌بینیم چه فرمت و سبک فونتی،سایز و وزن فونت داشته باشه!)و...رو در نظر بگیره
⚠️توجه:بعضی وب سایت ها به دلیل رابط کاربری بد ایجاد شده توسط بعضی طراحان ناحرفه ای و کارنابلد،پتانسیل کامل برای استفاده از تمام ظرفیت یک وب سایت رو ندارن و تیر شون به سنگ میخوره!🫨😬

توسعه وب:به معنای پیاده سازی عملی طرح ایجاد شده توسط طراح است و ارائه اون به کاربر هست🫱🏻‍🫲🏻
که دو دسته هستند:
1⃣توسعه دهنده فرانت اند
پیاده سازی باHTML,CSS,JSوکتابخانه ها و فریم ورک های آنها که به صورت بصری هستند بخش فرانت رو پیاده سازی و ایجاد میکنه.همه انچه در فیگما مثلا طراحی شده این برنامه نویس فرانت باید پیاده سازی اش کنه
2⃣توسعه دهنده بک اند
لایه های پشت وب سایت،مدیریت درخواست های کاربر رو عهده دار هست،مثلا بعد از کلیک روی یک دکمه یا فرم،درخواست و پاسخ درست اون عملیات به عهده ایشون هست.
📌توسعه دهنده وظیفه پیاده سازی UI رو به عهده داره و دلیل اینکه چرا این مدلی و این سبک و مدل طراحی شده رو خیلی دقیق و با جزئیات نمیدونه‼️

🚨راستی شما جز کدوم دسته اید و با چه ابزارهایی کار میکنید؟از خودتون بیشتر بگید💪🤔😎😇😉

#تفاوت_ها
#توسعه_دهنده_وب
#طراح_وب
@DeepDevs
👍144🔥3
نسخه ۴.۰ فریم‌ورک Tailwind CSS منتشر شد. این نسخه جدید به طور کامل برای عملکرد بهتر و انعطاف‌پذیری بیشتر طراحی شده و تجربه‌ای بازطراحی‌شده برای پیکربندی و سفارشی‌سازی ارائه می‌دهد. این نسخه از آخرین پیشرفت‌های پلتفرم وب استفاده می‌کند. ویژگی‌های برجسته این نسخه شامل موارد زیر است:

۱. انجین با عملکرد بالا

این نسخه بازنویسی کامل شده است و زمان بیلد را به شدت کاهش داده است. برای مثال:

زمان بیلد کامل: از ۳۷۸ میلی‌ثانیه به ۱۰۰ میلی‌ثانیه کاهش یافته است.

زمان بیلد افزایشی: از ۴۴ میلی‌ثانیه به ۵ میلی‌ثانیه کاهش یافته است.

بیلدهای افزایشی بدون تغییر CSS جدید: تنها ۱۹۲ میکروثانیه زمان می‌برند.

۲. طراحی برای وب مدرن

تلویند سی اس اس v4.0 از ویژگی‌های مدرن CSS مانند cascade layers، رنگ‌های ترکیبی (color-mix)، و ویژگی‌های منطقی (logical properties) استفاده می‌کند. این ویژگی‌ها نه تنها عملکرد را بهبود می‌بخشند، بلکه پشتیبانی از طراحی RTL و انیمیشن‌های پیشرفته را نیز ساده‌تر می‌کنند.

۳. نصب ساده :

فرآیند نصب بسیار ساده‌تر شده است:


نصب از طریق npm:
npm i tailwindcss @tailwindcss/postcss 

افزودن پلاگین PostCSS:


export default { plugins: ["@tailwindcss/postcss"], }; 

ایمپورت کردن Tailwind در فایل CSS:
@import "tailwindcss"; 


۴. پشتیبانی از پلاگین Vite

پلاگین اختصاصی برای Vite فراهم شده است که استفاده از Tailwind را سریع‌تر و ساده‌تر می‌کند:

import { defineConfig } from "vite"; import tailwindcss from "@tailwindcss/vite"; export default defineConfig({ plugins: [ tailwindcss(), ], }); 


۵. شناسایی خودکار محتوا

در این نسخه، دیگر نیازی به پیکربندی فایل‌های قالب (template) به صورت دستی نیست. به طور خودکار تمام فایل‌های مورد نیاز شناسایی می‌شوند.

۶. پیکربندی مبتنی بر CSS

به جای استفاده از فایل tailwind.config.js، اکنون می‌توانید تمام تنظیمات خود را مستقیماً در فایل CSS انجام دهید:
@import "tailwindcss"; @theme { --font-display: "Satoshi", "sans-serif"; --color-primary: #3498db; } 


۷. استفاده از متغیرهای CSS

تمام مقادیر طراحی به صورت متغیرهای CSS در دسترس هستند:

:root { --font-display: "Satoshi", "sans-serif"; --color-primary: #3498db; }


این متغیرها را می‌توان در استایل‌های داخلی یا کتابخانه‌هایی مثل Motion استفاده کرد.

۸. رنگ‌های مدرن P3
پالت رنگ پیش‌فرض از RGB به OKLCH ارتقا یافته است که باعث vivid‌تر شدن رنگ‌ها می‌شود.

۹. پشتیبانی از Container Query
اکنون می‌توانید بدون نیاز به پلاگین، از کوئری‌های کانتینر استفاده کنید:

<div class="@container"> <div class="grid grid-cols-1 @sm:grid-cols-3 @lg:grid-cols-4"> <!-- محتوا --> </div> </div> 


۱۰. ابزارهای جدید برای ترنسفرم سه‌بعدی :


ابزارهایی برای انجام ترنسفرم‌های سه‌بعدی مانند rotate-x-* و scale-z-* اضافه شده است:

<div class="rotate-x-45 scale-z-125"> <!-- محتوا --> </div> 


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


@DeepDevs
21👍11❤‍🔥2🆒1
⚠️پادکست کوتاه امشب در مورد مهارت های نرم،ارتقا دادن خود با یک اپلیکیشن کاربری و معرفی یک سایت کاربری و فوق العاده هست.👨🏻‍💻👩🏻‍💻😎🤩😌

امیدوارم این تجربه دید خیلی خوبی بهتون بده و بتونید از این طریق به نتایج شگفت انگیزی دست پیدا کنید و در جهت ارتقای مهارت های نرم و فنی شما نقش موثری داشته باشه‼️💯

#پادکست
#مهارت_های_نرم
#اپلیکشن_کاربری
#توسعه_فردی@DeepDevs
🔥16👍85
Who Will Know (Tragedy) Shiro SAGISU [Shin Godzilla OST]
<unknown>
یه ذره روحتون رو نوازش بدید و بذارید خستگی ها خارج بشن..
❤‍🔥11👍2👌2🤯1
💣منتظر یک انفجار عجیب قریب برای فردا شب هستید؟😎

🚨فردا شب یک ویدئوی خفن داریم براتون آماده میکنیم که بفهمید چطور...🤔


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

چیزی که سبب میشه رزومه ای بسازید بس عجیب و قریب و با قدرت که هر کارفرمایی رو کامل از نظر مهارت های فنی که دارید ضربه فنی کنه و چاره ای جز این نداشته باشه که شما رو قبول کنه!💯😎
منتظر باشید!ویدئو در حال ادیت نهایی هست...🙂‍↕️

📌ریکشن فقط آتیش بزنید ببینم چقدر آماده اید براش🔥🔥🔥

#سوپرایز
#بازار_کار
#سکوی_پرتاب
@DeepDevs
10🔥76👍4😎2😡21
Forwarded from فرانت چپتر 🥕
🚀 فروش بلیت‌های همایش فرانت‌چپتر آغاز شد!

⭐️ داستان‌های شنیدنی از بهترین‌های فرانت‌اند
موقعیتی برای یافتن فرصت‌های تازه
💎 تیم سازی، سفر و سرگرمی در کنار جامعه

🔥 همین حالا ثبت‌نام کن و جا نمونی!

🎉 FrontChapter.ir/event

🥕 @FrontChapter

مشتاق دیدارت هستیم! 😎
Please open Telegram to view this post
VIEW IN TELEGRAM
👍4🔥3💔1
سلام بچه ها چطورید.ما اومدیم با...

🔥بالاخره پس از کلی کار و زحمت باقلوای دوست داشتنی و خوشمزه تون رو آماده کردیم و آماده سرو هست!پس بفرمایید...🎂⚡️

⚠️[(فرایند مصاحبه شغلی)]🔐
کلی روش کار کردیم و زحمات🏃 و تجربیات🏆 ارزنده ای هست رو هر شب طبق یک باقلوا خوشمزه تقدیم تون کنیم!🍰💥


🚨مطالب برای هر مصاحبه ای قابل استفاده خواد بود!🧑‍⚖️👩‍⚖️
خصوصا برنامه نویسی و حوزه IT👨‍💻👩‍💻


قراره بیش از 170سوال مصاحبه رو براتون برسی کنیم!💣

که مطالبش طبق پارامتر های زیر ارائه شده:

پر تکرار ترین سوالات
بحث بر انگیز ترین سوالات
با جزییات
همراه با سوال و جواب
مثال عملی و واقعی!



3️⃣ شکل ارائه میشه:

✳️متن محور📖
✳️پادکست کوتاه🎧
✳️ویدئو کوتاه🎬


📌امشب اولین محتوا به صورت متن 📝ارائه میشه
با هشتگ
#آمادگی_مصاحبه
🔗میتونید به محتوا دسترسی پیدا کنید🔥🔥


📣آماده اید؟😎
بزن بریم...😉
#مصاحبه #مصاحبه_شغلی #آمادگی_مصاحبه@DeepDevs
❤‍🔥32👍7
آمار و ارقام اطلاعات لطفاً!
001)در طول ..... سال گذشته موقعیتهای شغلی، میزان درآمد تاریخ استخدام نام و عنوان کارفرمایتان چه بوده است؟

در بعضی بخشهای مصاحبه بعضی اطلاعات مرور میشن که بازگویی اونها اختیاری نیست و باید اونها رو ثبت کرد
📑هدف شون
1⃣گرفتن هر نوع آمار
2⃣اطلاعاتی از (سابقه تحصیلی)و(کاری) شما هست‼️
برای تأیید همه آنها شاید به کارفرماها و مؤسسات آموزشی که نام برده اید، تماس بگیرن⁉️

⭕️مرجع اطلاعات درخواست شده باید قابل دسترسی وآماده باشد چراکه
هر سازمانی چنین اطلاعاتی را از شما می خواهد‼️
صرف نظر از سطح شغلی که درخواست دادید اگر ازتون بخوان فرم درخواستی رو پر کنید، باید این کار را انجام بدید‼️
💠ممکنه در بخش ثبت تجربیات بنویسید 《به رزومه مراجعه کنید》 و مسئولیت را به گردن کارمندای منابع انسانی بندازید تا سابقه شما رو چک کنه‼️
اما شاید از شما بخوان اطلاعات رزومه تان را در فرم درخواست شغل هم بنویسید🤷🏻
🙅در واقع، رزومه ی شما الزاماً همان اطلاعاتی را ندارد که فرم درخواستی از شما خواسته است!🙅‍♀

یک سوال🤔
بعد از تکمیل فرم و وقتی که هنوز اونجا هستید،بخش منابع انسانی سازمان یا شرکت، فرم پر شده را مرور یا برسی می کند و اطلاعات بیشتری از شما می خواهد⁉️
🔰(میدونم میدونید.ولی باید یادآوری کنم) میزان حقوق و دلیل ترک شغل قبلی رو هیچ کس تو رزومه نباید بنویسه‼️‼️⚠️
🤷🏻حتی می تونید بپرسید میشه فرم رو خونه پر کنم؟
🚨در هر صورت با منشی بحث نکنید!
چراکه احتمالا به کارفرما گزارش بده که شما از تکمیل فرم اجتناب کردید.👈😱در چنین مواقعی بهتره دور استخدام شدن تون رو خط بکشید.🤦‍♂🤦‍♀
اطلاعاتی که در فرم می نویسید باید با اطلاعات ذکر شده در رزومه هماهنگ باشد🫵

🔗بیشترین مواردی که مورد توجه قرار میگیرند اینهاست!👇👇👇
❇️تاریخها
❇️عناوین شغلی

♻️در موردمیزان حقوق درخواستی
حواستون رو جمع کنید زیرا ممکنه در طول مصاحبه دوباره در مورد آن سؤال بشه و باید جوابتون با چیزی که نوشته اید هماهنگ باشه.

در غیر این صورت باید خود را برای سؤالهای بیشتری آماده کنید.

⚠️اعتبار شما به دلیل تناقض در جواب ها، زیر سؤال می ره!پس مراقب باشید‼️‼️



#مصاحبه_شغلی #مصاحبه #آمادگی_مصاحبه@DeepDevs
👍19❤‍🔥74👌2
002)چگونه شغل قبلی تان را پیدا کردید؟
با برنامه ریزی بود یا آن را تصادفی پیدا کردید؟


داشتن برنامه به معنی هدفمند بودن شماست و نشان میدهد فردی هستید که برای خود برنامه ای تغییر کرده اید و به آن عمل می کنید💯

اما اگر به طور تصادفی شغل قبلی تان را پیدا کرده باشید
📇پاسخ شما یه شرایط بستگی دارد

مثلاً می توانید بگویید👇👇:
پس از فارغ التحصیلی فکر میکردم بهترین انتخاب برا من کار در صنایع.......است. هنگام مصاحبه در.......یکی از متقاضیان به شغلی در.......اشاره کرد؛
در موردش تحقیق کردم و به صنعت......علاقه مند شدم🙄 و فرصت های شغلی اش رو دنبال کردم🤭؛
باید بگم که اون گفتگو مسیر حرفه ای من روکاملا تغییر داد❗️🙂‍↔️

📌باید جواب شسته رفته ای داشته باشید تا شرایط را به نفع خودتان تمام کنید🙂‍↕️🤫

⚠️توجه
مصاحبه کننده می تونه این سؤال رو در مورد شغل های قبلی تون هم بپرسه😪


#سابقه_کار #مصاحبه_شغلی #آمادگی_مصاحبه@DeepDevs
👍7❤‍🔥2🔥1
003)چگونه از این فرصت شغلی با خبر شدید؟

این سؤال کیفیت منابع اطلاعاتی شما را می سنجه⁉️

⚠️در مورد معرفتان اغراق نکنید❗️
🔰اگر تصادفاً همسایه ی شما رئيس، مدیر اجرایی سازمانی هست که برای مصاحبه به آن آمده اید یا یکی از کارمندان انجا آشنا شما هستند حتما آن را ذکر کنید.


📌اگر با معرف خود ارتباط مستقیم ندارید [(مثلاً شاید ارتباط شما از طریق پدرمادر یا یکی از دوستان صورت گرفته،صادق باشید)]
📌وقتی اسم معرفتان رو می‌گید مصاحبه کننده نسبت به شکل رابطه ی شما کنجکاو می شود🤔
🚨پس بهتر است نوع رابطه ی شما را از خود شما بشنود تا از کسی که معرف شما بوده است!

#معرف
#سوالات_مصاحبه #مصاحبه_شغلی #آمادگی_مصاحبه #مصاحبه@DeepDevs
👍13❤‍🔥3
004)فرض کنید به دلیل تعدیل نیرو،موقعیت شغلی شما حذف بشه،حال اگه وضعیت شرکت بهبود یابد و شروع به استخدام نیرو کنه آیا حاظرید به شغل قبلی خود برگردید؟🤔

سازمان با این سؤال می خواد در صورت درخواست مجدد، میزان تعهد شما را نسبت به روابط جدید بسنجه!

اینطوری میتونید جواب بدید:
در طول هشت سال کار در ............. چیزهای زیادی یاد گرفتم و تجربیات بسیار ارزشمندی کسب کردم صادقانه بگویم با شناختی که از وضعیت بازار دارم شاید سالها طول بکشد تا شرکت بتواند سهمش را در بازار دوباره به دست آورد، اما من نمیتوانم به عقب برگردم برای همه ی کسانی که در آنجا مشغول به کار هستند آرزوی موفقیت میکنم اما می خواهم در مسیر جدیدی حرکت کرده و در صنعت متفاوت تری فعالیت کنم
#مصاحبه_شغلی #آمادگی_مصاحبه
#تعدیل_نیرو #سوالات_مصاحبه
#مصاحبه@DeepDevs
👍19❤‍🔥2😡1
005)دلایل شما برای ترک سازمان/شرکتی که در آن کار میکردید چه بوده است؟

⚠️به هیچ وقت از کارفرمای خود بد نگویید!
◾️همیشه خود را فرد برنده ای نشان دهید که همیشه برای/بابرنده ها کار کرده!
◾️هرگز شکایت نکنید که کارفرمای قبلی سِمت شما را ارتقاء نداده!

🔗در عوض دیدگاه بهتری داشته باشید!
《پیشرفت های اخیر باعث شناخته شدن سازمان شده است؛من هم فکر کردم برای من نیز وقت خوبی است تا پیشرفت کنم》


#مصاحبه_شغلی #آمادگی_مصاحبه
#سوالات_مصاحبه #مصاحبه@DeepDevs
👍61
006)حقوق مدنظر شما چقدر است؟

⚠️مراقب باشید. سه اصل رو باید یادتون باشه!

1⃣آیا فرم درخواست کار را پر نموده اید؟
اگر پر کردید، شرکت مورد نظر اطلاعات لازم را در اختیار داره، پس باید جواب هاتون با هم هماهنگ باشه.

2⃣مقدارحقوق شغل پیشنهاد شده را می دانید؟
از طریق آگهی استخدام کارگزینی، یا یکی از عوامل داخلی؟! در صورت امکان پاسخ بدید. بعد از اینکه شغل به شما پیشنهاد شد در مورد حقوق صحبت کنید، نه قبل از آن.
3⃣هیچ نظری در مورد میزان حقوق پرداختی ندارید؟
اگر مقدار کمی پیشنهاد دهید، ارزش خود را پایین میارید؛اگر قیمت بالایی پیشنهاد بدید ارزش خود را بیش از اون شغل بالا میبرید!
بنابراین مقدار مناسبی پیشنهاد کنید و اگر احساس می کنید که کم است،بگید این مقدار پایه ی حقوقه و شامل مزایا و اضافه حقوق ها نیست!
#مصاحبه_شغلی #مصاحبه #حقوق_دریافتی #مصاحبه@DeepDevs
8👍4
اکستنشن برای راست چین کردن Deepseek با اون میشه متن هایی که Deepseek به صورت فارسی و انگلیسی مینویسه رو راست چین کرد و خوانایی دقیق رو شاهد باشیم.
لینک دانلود و نصب واسه فایر فاکس


https://addons.mozilla.org/en-US/firefox/addon/rtl-deepseek/

@DevTwitter منبع
| <AmirAli Noroozi/>
@DeepDevs
10👍3😡1