دیدن این ویدیو رو فقط برای کسایی که میخوان دانش عمیقی از اتفاقات پشت صحنه ریکت داشته باشن و توی مصاحبه های فنی موفق باشن پیشنهاد میکنم😎✨

جایی که توی جابینجا نتیجه درخواست های همکاریت پشت سر هم داره میشه "تایید برای مصاحبه" و تلفن ثابت های مختلف هی پشت سر هم دارن باهات تماس میگیرن.
یعنی یه سری نکته ی ریز رو رعایت کردی!

از تجربه های خودم براتون میگم، شاید ناقص باشه ولی واقعیه:

۱. خودتون باشید!
از متن داخل about رزومه گرفته تا توضیحاتش و cover letter و SOP و هرچیزی که فکر کنید کاملا مشخصه اگر از هوش مصنوعی استفاده کنید.
آیا چیز بدیه؟
نه!
پس چرا میگی استفاده نکنیم؟ چون الان چیزی به اسم هوش مصنوعی توی اون فازیه که همه همچین ریکشنی نسبت بهش دارن:
"از هوش مصنوعی استفاده کردی؟‌ اینو که هرکسی بلده"
که در واقع اینطور هم نیست. ولی خب بخش زیادی از اعتماد رو در این بخش از تاریخ از بین میبره..

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

---------

۲. حتما رزومتون رو نسبت به توضیحات موقعیت شغلی tailor کنید.
قبلا میگفتیم برای شرکت های بزرگ رزومه های زیادی میره
ولی متاسفانه بخاطر اینکه الان شرایط بازار کار اصلا مناسب نیست، برای شرکت های کوچیک هم حتی رزومه های زیادی میره.
ولی توضیحات موقعیت شغلی دقیقا برای اینه که به شما بگن ما منتظریم چه رزومه ای ببینیم!
میخوان بگن اگه هزار تا رزومه اومد، کدومشه که احتمالا تایم بیشتری روش فکر میکنیم حتی اگه به علت "دلایل دیگر" ردش میکنیم.

نوشته توی پروژه فعلیمون نیاز به vanilla js داریم؟
خب شماهم توی رزومه روی vanilla مانوور بدید

نوشته نیاز داریم تجربه با websocket داشته باشید؟
تجربه websocket بدست بیارید
سریع یه پروژه کوچیک هم که شده لانچ کنید و توی رزومتون بیارید
یا از تجربه های قبلیتون نام ببرید
حتما هم آیتم اول باشه.

نوشته tailwindcss برامون مهمه؟
خب بنویسیدش
قطعا توی پروژه ها از ابزار های متنوعی استفاده میشه
ولی چیزی رو توی رزومه بنویسید که توی توضیحات از شما خواستن.

---------

۳. از اعداد واضح استفاده کنید.
هرچی توضیحات شما واضح تر و clear تر باشه
قطعا شانس شما برای تایید شدن بالا میره.

این دوتا جمله رو مقایسه کنید:
۱. از تکنیک های مختلفی مثل performance tuning و memoization استفاده کردم و پرفورمنس تا حد قابل توجهی افزایش پیدا کرد!
۲. با استفاده از تکنیک های performance tuning و memoization پرفورمنس رو تا ۳۰ درصد افزایش دادم.

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

میتونید بگید از lighthouse , page speed insight و ...
استفاده کردم
یا برای بهتر کردن re-render ها و اندازه گیریشون از devtools profiler استفاده کردم.

واضح باشه نتایج کارتون!
همه بلدن بگن فلان کاری که کردم عالی و درجه یک بود.

----------

۴. کاور لتر (cover letter) ننویسید. اگر قراره یه متن تکراری و مصنوعی از GPT بگیرید.
توضیحات موقعیت شغلی رو بخونید
اگر فکر میکنید واقعا گزینه مناسبی برای اون موقعیت هستید
توی کاور لتر ذکر کنید
بگید که چرا انتخاب میکنید با این تیم کار کنید
چه مزیتی دیدید؟
چرا اونا باید شمارو انتخاب کنند؟
خودتون باشید و واضح ولی دقیق حرفتون رو بزنید.

چون که تمام ماجرا راجع به جلب اعتماد هست!

----------

و اما توی جلسه مصاحبه

۵. علت رد شدن شما تا ۸۰ درصد استرسی هست که دارید.
من تاحالا تجربه مصاحبه کردن داشتم
مصاحبه شدن هم داشتم
کاملا مشخص و واضح بود برای خودم که هم علت رد شدن خودم بعد از مصاحبه و هم علت رد کردن دوستانی که مصاحبه کردم باهاشون استرس و انرژی منفی بوده.

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

ولی با انرژی منفی هیچکاری بجز ترک کردن نمیشه کرد!
حتی اگه ۱۰ سال هم سابقه کار داشته باشی
استرس جایی توی سازمانی که همه با امید و انگیزه کنار هم دارن برای یه هدف مشترک میجنگن نداره.

----------

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

و کلام آخر رو هم بهتون بگم
اونم اینه که صبر داشته باشید
میدونم شرایط سختیه
تعداد توسعه دهنده ها و مهندس ها روز به روز داره بیشتر میشه و موقعیت های شغلی روز به روز کمتر میشه.
ولی همیشه هم راه های زیادی برای متفاوت بودن هست.

اگر هم فکر میکنید از مهارتی که دارید نمیتونید پول در بیارید
سریع برید یه مهارت دیگه یاد بگیرید و برید سر یه کار دیگه!
گربه باید موش بگیره. چه فرقی داره سفید یا سیاه؟

لینک مستقیم ثبت نام:
https://B2n.ir/dp5896

@AIRAN_Tech
@AIRAN_Admin

رفقایی که اصفهان هستن
خوشحال میشم ببینمتون
شرکت توی جلسه برای عموم آزاد هست🤍

https://nshn.ir/rbZ0mB_x0FyU

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

درود رفقا امیدوارم که حالتون عالی باشه
من به عنوان توسعه دهنده فرانت اند توی تیم آدران و محصول footballi.net امروز همکاریمو شروع کردم.
به زودی تجربیات مسیر استخدامی و تجربیات تکنیکالی که بدست میارم رو باهاتون شیر میکنم که باهم چیزای جدید یاد بگیریم.

تجربه اولم توی شروع همکاری یه چالش فنی بود که بهش برخوردم!
اما نه یه چالش فنی که مثلا داخل پروژه باشه و من ندونم چطور حلش کنم؛ بلکه توی مهارت فنی خودم بود.

تا قبل از اینکه توی فوتبالی شروع به همکاری کنم، یه career gap تقریبا ۶ ۷ ماهه رو بخاطر یه سری شرایط و صد البته یه تصمیم اشتباه تجربه کردم.

تجربه های جالبی توی این تایم بدست اوردم ولی مهم ترین چیزی که از دست دادم sharp بودن مغزم توی حل مسئله و پیاده سازی راه حل ها بود!

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

ولی وقتی رسید به مصاحبه live coding، تازه فهمیدم که چه بلایی سر خودم و اونهمه مهارت اوردم…

همینطور این چالش همچنان توی فرایند technical onboarding همراهم بود.
و حقیقتا به قول تیم لید فرانتمون: واقعا فرانت اند خیلی فرراره.

نتیجه گیری:
هیچوقت اپدیت شدن و اموزش دیدن رو به کار کردن توی پروژه های واقعی ترجیح ندید. همیشه توی پروژه باشید و با چالش های مختلف درگیر باشید.
هرچقدر که مهارت فنیتون verbally (کلامی و لفظی) قوی باشه، اگه technically (فنی و عملی) سریع و sharp نباشید اونقدر شاید توی فضای عملی بدردتون نخوره.

به شخصه ترجیح میدم درگیر کار و تسک های مختلف باشم و همزمان به صورت دغدغه محور یا use-case oriented آموزش دیدن رو پیش ببرم.

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

راه حل اینه که حتی اگر جایی مشغول نیستید برای خودتون پروژه های بزرگ و پر از فیچر تعریف کنید (که حداقل ۷۰ درصدش خارج از چیزایی باشه که بلدید. تا مجبور به یادگیری بشید). و همزمان با این پروژه مسائل مختلفی که نیاز همین پروژه هست رو یاد بگیرید.
این مدل یادگیری رو واقعا تجربه کردم و بخش زیادی از دانش فنیم رو مدیون این سبک از یادگیری هستم.

توی تیم درگیر فرایند performance optimization یک اپلیکیشن کاملا client side هستم
که با react + vite نوشته شده و در حال توسعه هست (احتمالا به زودی نسخه MVP هم لانچ میشه).

خب تا قبل از اون همچین تجربه ای رو فقط با nextjs داشتم. که nextjs برای یه همچین منظوری ساخته شده. و تا قبل از اینکه شما وارد فضای performance optimization بشید خودش خیلی چیزارو هندل کرده. من جمله عکس ها و رندر کردنشون در بهترین حالت ممکن (که هنوز هم میبینم بعضیا با اینکه سابقه خیلی زیادی دارن عکس هاشون توی نکست یا سایز مناسبی نداره یا fetchpriority مناسبی نداره یا بدتر از همه CLS خیلی زیادی ایجاد میکنه بخاطر اشتباه سایز دادن)

ولی توی ریکت ما داریم از img element دیفالت خود jsx استفاده میکنیم. و نداشتن یک کامپوننت built-in چالش های مختلفی رو ایجاد میکنه. از جمله همین layout shift که بدترین تجربه ی ممکن رو میتونه برای کاربر ایجاد کنه.

و دقیقا وقتایی که دارید یه پروژه ای رو با ریکت میزنید و میبینید با اینکه ui خیلی خوبی داره ولی اونقد حس حرفه ای بودن و سریع بودن نداره. خیلی از مشکلات تجربه کاربری که داره بخاطر برطرف نکردن CLS یا cumulative layout shift هست.
وقتی توی لود اولیه بعد از پارس شدن استایل ها تازه سایز عکسا مشخص میشه و همه چی بالا پایین میپره توی اون لود اولیه. متریکی که برای گوگل به شدت مهمه.

و اما مسائلی که سعی کردم رعایتشون کنم تا به یک پیشرفت پرفورمنس حدودا ۳۰ درصدی برسم (رسوندنش از ۶۰ به ۸۰ و بالاتر)

اول از همه بهبود متریک CLS بود:
برای عکس هام width و height مشخص کردم توی همون jsx. و همین تمام مسئله ی CLS رو برطرف کرد.

و بهبود LCP:
چیزی که اینجا کمکم کرد به نتیجه خیلی خوبی برسم
اول از همه کاهش سایز تصاویری بود که داشتیم
هرچند عکس ها سایز خیلی کوچیکی داشت ولی همچنان میشد قضیه رو با تبدیل فرمتشون به webp یا avif بهتر کرد.
و همینطور عکس هایی که توی لود اولیه کاربر باید میدید مخصوصا عکس های داخل header رو preload کردم تا خیلی سریع کاربر ببینه و مرورگر قبل از هرچیزی اون عکس هارو دانلود کنه و نگه داره.
که سرعت paint مرورگر نیاد پایین.

همینطور code splitting که به عنوان تسک اصلی مشخص شده بود ولی من پامو فراتر از اون گذاشتم.
کامپوننت route هارو همرو lazy load کردم
و از suspense boundary استفاده کردم تا مرورگر بعد از اینکه وارد اون route شدیم کامپوننت مربوط بهش رو دانلود کنه و نمایش بده.
این کار کمک میکنه توی لود اولیه جاوا اسکریپت اضافه ای دانلود نکنیم و کوچیک تر بودن سایز باندل یا همون js مون به لود سریع تر صفحه خیلی کمک میکنه.

همچنین از rollup-plugin-visualizer استفاده میکنم تا موقع بیلد حتما بهم نشون بده چه ماژول هایی داریم و اگر سایز ماژولی به طور نا متعارف و غیر بهینه ای بزرگه یه trade-off براش انجام بدیم.
یعنی چک کنیم که آیا جایگزینی وجود داره؟
آیا ما داریم واقعا از همه ی پتانسیل ها و فیچر های این ماژول (لایبرری بیشتر منظورمه) استفاده میکنیم؟
اگر جایگزینی داره همین پرفورمنس رو به ما میده؟ و ...

و همچنین به عنوان یه نکته کنکوری که هرجایی بهتون نمیگن:
‍این کانفیگ توی vite.config

‍      // .1
      sourcemap: false, 

     // .2
      rollupOptions: {
        output: {
          manualChunks(id) {
            if (id.includes('node_modules')) {
              return id.toString().split('node_modules/')[1].split('/')[0].toString();
            }
          },
        },
      },

اولیش که مربوط به sourcemap میشه
که با تولید نکردن فایل های sourcemap
بخش های مختلف باندل رو به سورس اصلی map نمیکنه
که اول از همه نکته امنیتی خیلی مهم داره و مهم تر از اون باعث کاهش حجم خروجی نهایی میشه.

و کانفیگ بعدی که باعث میشه هر پکیجی که از node modules ایمپورت شده به عنوان یک chunk جداگونه تولید بشه
یعنی که باندل جداگونه یا فایل js جداگونه که باعث میشه:
۱. کش بهتر مرورگر
یعنی اگه فقط توی بروز رسانی فقط یکی از این موراد (لایبرری ها یا chunk ها) تغییر کنه. بقیه شون توی کش مرور گر باقی میمونن
۲. لود اولیه سریع
مرورگر فقط باندلی که لازم داره رو واکشی میکنه.
۳. تحلیل بهتر ساختار باندل
مثل همون ابزاری که گفتم ‍‍`rollup-plugin-visualizer`
وقتی از اینجور ابزار ها استفاده کنیم راحت تر میتونیم بفهمیم کد ها از کجا میان و تصمیم گیری و تحلیل برامون راحت تر میشه

نکته کنکوری رو از دست ندید 😉

اگر برای تابستون برای خودتون پلن های خفنی دارید؛ ولی دغدغه هایی شبیه به اینا دارید:

۱. نمیدونم از‌کجا شروع کنم. بین تکنولوژی های زیادی گم شدم و حس میکنم همشون لازمه و کارم خیلی سخته.

۲. من کدمو نوشتم، ولی نمیدونم درسته یا نه. بابت کدی که نوشتم اعتماد به نفس ندارم.

۳. مصاحبه ها نابودم میکنن! چرا مصاحبه هارو قبول نمیشم با اینکه پروژه هم زدم؟

۴. رزومه ساختم ولی هیچجا جواب نمیدن. نکنه مشکل از خودمه؟

۵. از بقیه خیلی عقبم…

و دغدغه های این چنینی

من تا آخر ماه در حد چند تا تایم مشاوره برام خالی شده میتونید برای هماهنگ کردن بهم پیام بدید🤍

این بار قراره نتیجه بگیرید.✅

@erfundev

بعد از چند سال تلاش برای رسیدن به کد تمیز و پرفورمنس بالا به صورت همزمان
فهمیدم که این دو خیلی کم پیش میاد که در کنار هم حضور داشته باشن.
و برای هرکدوم باید trade-off انجام داد.
همیشه پرفورمنس متوسط و کار راه بنداز مساوی با تجربه‌ی کم توسعه دهنده نیست. شاید موضوع مهم تری برای پیاده سازی وجود داره که اولویتش نسبت به پرفورمنس و سرعت لود بیشتره.

اگر به عنوان فرانت اند دولوپر هنوز توی پیاده سازی کردن ui ها مشکل دارید و فکر میکنید css در مواقعی خیلی براتون پیچیده میشه. حتی وقتی پیچیدگی ظاهری خاصی وجود نداره.
پیشنهاد میکنم طرز فکر box model رو تقویت کنید توی‌ خودتون.
نگاهی که همه چیز رو با باکس هایی از بزرگ به کوچیک تقسیم بندی میکنیم تا ریز ترین جزئیات رو با بهترین کیفیت پیاده سازی کنیم.

موضوعی که امروز با یکی از رفقایی که تازه با html css شروع کرده حدودا یک ساعت توی گوگل میت بررسی کردیم و خفن ترین نتیجه رو گرفتیم. حقیقتا من که خیلی کیف کردم از اینکه تونستم در این حد مسئله رو برای کسی که تازه شروع کرده ساده کنم (با حفظ تمام جزئیات در عین سادگی).😁

دونستن اینکه شما توی کدوم مرحله هستید
به من کمک میکنه دغدغه شمارو بیشتر بدونم
تا از تجربه ها و مطالعاتم مناسب ترین محتوارو براتون بذارم🤍😉

پس حتما شرکت کنید توی این poll

سلام دوستان
امیدوارم همگی در سلامت و امنیت کامل باشید🤍🇮🇷

رفقایی که گزینه «در جست و جوی کار» رو از نظر سنجی بالا انتخاب کردند؛ توجهشون رو به این پیام جلب میکنم.
یکی از واقعی ترین و با ارزش ترین تجربه های من در مراحل آخر پیدا کردن موقعیت شغلی مناسب بعد از کلی تلاش هست.
امیدوارم استفاده کنید و به دردتون بخوره.

به زودی تجربیات بیشتری روهم باهاتون به اشتراک میذارم.
از نوشتن رزومه اصولی تا نکاتی که واقعا هرکسی بهتون نمیگه❤️‍🔥

و‌ اینم نکات مهم توی مرحله مصاحبه. از دید یک مصاحبه کننده (خودم😁)

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

به زودی محتوای جدید هم براتون میذارم🤝

در امان باشید❤️