پروژه‌های برنامه نویسی Front-End برای دوران قرنطینه

ویروس کرونا در این روزها همه ما را خانه نشین کرده و دل و دماغ را از همه ما گرفته. بیاید کمی هم جنبه‌های دیگر را نیز ببینیم و این شرایط را به نفع خودمان تغییر دهیم. می‌پرسید چطور. خب، حال که فرصت بیشتری برای یادگیری داریم پس چرا برنامه نویسی تمرین نکنیم. آن هم برنامه نویسی وب. هم چیزی می‌سازیم هم چیزی یاد می‌گیریم که به درد بخور باشد. در این نوشته چند ایده پروژه را مطرح می‌کنیم تا بتوانیم هم یاد بگیریم و هم از کسالت قرنطینه در امان باشیم. در ضمن حال ویروس کرونا را هم بگیرم. برخی از پروژه ها با CSS/HTML و یا با استفاده از یک فریم‌ورک قابل انجام است و برخی دیگر نیاز به نوشتن جاوا اسکریپت دارد. خلاق باشید و از این ایده‌ها بتوانید ایده‌های دیگری نیز ایجاد کنید. برای این که یادگیری بهتری داشته باشید نیاز است تا یک پروژه را انتخاب و برنامه ریزی کنید. هر روز زمان مشخصی را برای پیشبرد پروژه اختصاص دهید و حتما یک Deadline برای انجام کار اختصاص دهید. سعی کنید تا نهایت ممکن بر روی جزییات کار کنید و به جستجو و حل چالش‌ها بپردازید. این ایده‌ها برای برنامه نویسی تحت وب و Front-End است و سطح مبتدی یا متوسط را پوشش می‌دهد.

پروژه اول: پیاده سازی layout‌های مختلف

اجازه دهید ابتدا با layout شروع کنیم. سعی کنید تا با استفاده از HTML و CSS چند چیدمان در لینک زیر را پیاده کنید: https://www.free-css.com/free-css-layouts/page1. پس از پیاده کردن حداقل ۱۰ layout، آنها را راست به چپ کنید تا با متن فارسی درست نمایش داده شود. این پروژه کوچک و ایجاد دید مناسب در چیدمان بسیار خوب است.

پروژه دوم: پیاده سازی یک صفحه ساده

در این پروژه قرار است یک صفحه بسیار ساده را طراحی کنید که در این لینک قرار دارد https://www.free-css.com/free-css-templates/page237/white-edition. این صفحه نقطه خوبی برای چیدمان یک صفحه واقعی است. سعی کنید این صفحه را برای فارسی نیز پیاده سازی کنید.

پروژه سوم: ساخت یک صفحه شخصی برای خودتان

چه خوب خواهد بود تا یک صفحه شخصی داشته باشیم. با استفاده از HTML و CSS3 یک صفحه درست کنیم تا بتوانیم خودمان را معرفی کنیم. از طرح در این وب سایت استفاده کنید: https://www.free-css.com/free-css-templates/page249/magazee. طرح‌های دیگری نیز در سایت هست که حتما به آنها نیز سر بزنید ولی برای شروع سعی کنید از طرح‌های ساده‌تر استفاده کنید. برای این که کمی پیشرفته‌تر کار کنیم صفحه را responsive یا واکنشگرا کنید. شما می‌توانید از Flex box در CSS استفاده کنید. خلاق باشید و با رنگ‌ها بازی کنید و از رنگ‌های دلخواه خود استفاده کنید. نکته مهم این است که نوشته‌ها خوانا باشند. این پروژه نقطه خوبی برای یادگیری خواهد بود و شما در آن بحث های layout یا چیدمان عناصر صفحه و استفاده از قدرت CSS را تمرین خواهید کرد.

پروژه چهارم: پیداه سازی یک وب سایت One-page برای یک شرکت

تصور کنید مشتری با شما تماس گرفته و از شما می‌خواهد یک وب سایت شرکتی با استفاده از طراحی که به شما می‌دهد ایجاد کنید. این طرح در این لینک قرار دارد: https://colorlib.com/wp/template/nitro/ سعی کنید تا جای ممکن طرح را پیاده سازی کنید. بخری از بخش‌ها مانند منو بالا یا قسمت our features نیاز به جاوا اسکریپت دارد که در این مرحله می‌توانید آن را نادیده بگیرید و بیشتر بر روی پیاده سازی اجزاء پیج با استفاده از HTML و CSS تمرکز کنید.

پروژه پنجم: کمی جاوا اسکریپت برای فرم

در این لینک یک فرم تماس داریم https://colorlib.com/preview/#nitro قرار است شما این فرم را پیاده سازی کنید و بعد با استفاده از جاوا اسکریپت (و نه jQuery) در زمان کلیک شدن فرم را بررسی کنید تا:

۱- همه field ها پر شده باشند.

۲- ایمیل فرمت درست باشد.

اگر field خالی بود باید border field به رنگ قرمز در بیاید.

پروژه ششم: ایجاد یک استاپ واچ

حتما بر روی موبایل یک Stopwatch دارید. با شروع میلی ثانیه دقیقه و ساعت رو نشان می‌دهد. سعی کنید با استفاده از جاوا اسکریپت یک Stopwatch درست کنید که یک دکمه شروع دارد. در ضمن یک دکمه pause دارد که به محض کلیک شدن عدد کنونی را در یک جدول زیر دکمه‌ها درج می‌کند و با زدن دکمه ادامه تایمر مجدد شمارش را ادامه می‌دهد. در نهایت نیز یک دکمه Stop داریم که تایمر را reset می‌کند و جدول پایین را نیز پاک می‌کند.

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

چرا کار پیدا نمی‌کنید؟

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

در این مقاله مهم‌ترین مواردی که در استخدام نشدن‌تان موثر خواهند بود را با یکدیگر بررسی خواهیم کرد. بنابراین اگر سوال چرا کار پیدا نمی‌کنم؟ ملکۀ ذهن شما شده است، مطالعۀ این مطلب را از دست ندهید.

صلاحیت کافی برای آن فرصت شغلی را ندارید

مطمئناً نیاز نیست که همۀ مهارت‌ها و صلاحیت‌های شغلی لازم که در آگهی شغلی آمده است را داشته باشید، اما مطمئناً لازم است که از درصد بالایی از آن‌ها برخوردار باشید. بنابراین توصیه می‌شود تنها برای شغل‌هایی درخواست بفرستید که حداقل ۹۰% شرایط و صلاحیت‌های مورد نظر را داشته باشید (البته در نظر داشته باشید که در مشاغل تخصصی این اعداد می‌توانند پایین‌تر هم باشند).

اگر در قسمت شرح وظایف شغلی بین ۳ تا ۵ سال سابقه درخواست شده و شما ۲ سال و نیم سابقۀ کاری دارید، می‌توانید این میزان را کافی بدانید. اما اگر تنها ۶ ماه سابقه کار دارید، وقت خود را برای فرستادن درخواست برای چنین فرصت شغلی تلف نکنید. مطمئن باشید با ۶ ماه سابقه استخدام نخواهید شد.

توانایی شما بالاتر از نیاز شرکت است

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

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

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

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

سازمان‌ها اغلب به دنبال افرادی هستند که در کاری خاص تخصص دارند و برای همان کار هم درخواست فرستاده‌اند. ارسال درخواست برای چند عنوان شغلی در یک سازمان، باعث می‌شود کارفرمایان تصور کنند شما تنها به دنبال پیدا کردن شغل هستید و نوع و عنوان شغلی برایتان اهمیت چندانی ندارد. بنابراین پس از استخدام هم از این شغل لذت نخواهید برد. بنابراین شاید این موضوع پاسخ سوال چرا کار پیدا نمی‌کنم؟ باشد.

رزومۀ شما مرتب و خوانا نیست

در زندگی روزمرۀ ما، اشتباهات تایپی مشکل مهمی به حساب نمی‌آیند. با این حال، وجود چنین اشتباهاتی در رزومه بحثی متفاوت است.

وجود داشتن یا نداشتن اشتباه تایپی در رزومه ممکن است وضعیت شما را تغییر دهد. شاید باورش برایتان سخت باشد اما اینکه به مصاحبه دعوت شوید یا درخواست شما رد شود، ممکن است به یک اشتباه تایپی وابسته باشد.

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

قالب رزومه شما نیز بسیار اهمیت دارد. نیازی نیست که رزومه‌تان رنگارنگ و شلوغ باشد، رزومه‌ باید به راحتی قابل خواندن باشد. اگر رزومه شما مرتب و منظم نباشد و از قالب‌های درست پیروی نکرده باشد، ریسک انتخاب نشدن شما بالاتر می‌رود.

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

نامۀ همراه یا Cover Letter جذابی ننوشته‌اید

همه فرصت‌های شغلی موجود از شما نامه اختصاصی نمی‌خواهند، اما اگر این درخواست را از شما داشته باشند، باید حتماٌ این کار را انجام دهید، در غیر این صورت احتمال استخدام نشدن شما بالا خواهد رفت.

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

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

به یاد داشته باشید که نباید ادعا کنید بهترین فرد برای آن موقعیت شغلی هستید، زیرا شما از وضعیت رقبای خود خبری ندارید و این ادعای شما برای کارفرما خنده‌دار خواهد بود.

دلیل ترک شغل قبلی خود را نمی‌توانید توضیح دهید

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

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

سابقه و پیشینه شغلی شما ثبات ندارد

اگر دانشجو یا تازه فارق‌التحصیل باشید، منطقی است که چند دوره کوتاه کارآموزی و شغل تابستانی داشته باشید. اما اگر این شرایط را نداشته باشید آیا پیشینه شغلی بدون ثبات توجیهی دارد؟

نکته‌ای که لازم است حتماً مدنظر قرار بدهید این است که حداقل باید یک سال در یک شغل باقی بمانید. اگر شغل قبلی‌تان یک سال یا کمتر زمان برده است، بهتر است که در شغل بعدی حداقل ۳ سال باقی بمانید. اگر آمار شغلی شما به کارفرما نشان دهد که به اندازه کافی به سازمان وفادار نخواهید بود و اختصاص هزینه و زمان برای آموزش شما برای سازمان مقرون به صرفه نیست، مطمئن باشید که استخدام نخواهید شد.

انتظار دستمزدی نامعقول دارید

بیشتر سازمان‌ها از شما انتظار دارند که در درخواست شغلی خود دستمزد مورد نظرتان و همچنین دریافتی‌های سابق خود را درج نمایید. اگر شغل‌هایی که برای آن‌ها درخواست فرستاده‌اید، پرداختی‌شان از درخواست شما کمتر باشد، مطمئناً درخواست شما رد خواهد شد.

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

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

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

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

باید در نظر داشته باشید، کارفرمایان زمان کافی برای صحبت کردن با تمام متقاضیان را نخواهند داشت، به خصوص زمانی که این تماس‌ها ادامه پیدا می‌کند و تعداد آن‌ها زیاد می‌شود. تماس بیش از حد با کارفرما باعث عصبانیت کارفرما شده و او را از استخدام شما منصرف خواهد کرد.

اگر در پیدا کردن شغل دچار مشکل شده‌اید، پیشنهاد می‌کنیم لیست داده شده را با دقت بیشتری مطالعه کرده و تا جایی که می‌توانید این مشکلات را حل کنید تا نهایتاً بتوانید شانس استخدام شدن خود را بالاتر ببرید.

منبع: https://bit.ly/33RFubo

فرآیند طراحی وب‌سایت در ۷ مرحله ساده

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

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

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

اما چگونه می‌توانیم ترکیب هماهنگی از عناصرها را به دست آوریم؟

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

۱- شناسایی هدف

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

۲- تعیین طرح نهایی

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

۳- ساخت وایرفریم و نقشه سایت

پس از اینکه اهداف و طرح سایت‌مان را به روشنی تعریف کردیم، حالا می‌توانیم به طور دقیق نقشه سایت را طراحی کرده و میزان وابستگی المان‌ها، محتوا و ویژگی‌هایی که در مرحله قبل تعیین کردیم را مشخص کنیم. در مورد «وایر فریم» باید بگوییم که این مرحله از طراحی وب، یک طرح کلی از طرح‌بندی صفحه وب است که به طراحی و توسعه وب سایت کمک می‌کند. بنابراین برای طراحی یک سایت مؤثر، هرگز نباید از این مرحله غافل شویم.

۴- تولید محتوا

حال ما تصویر بزرگ‌تر و بهتری از وب‌سایت در ذهن خود داریم و زمان آن فرا رسیده تا برای صفحات شخصی خود تولید محتوا کنیم. همیشه باید سئو یا بهینه‌سازی موتورهای جستجو را برای سایت خود در نظر داشته باشیم و سعی کنیم آن را حفظ کنیم تا تمامی صفحات بر یک موضوع واحد و منحصربه‌فرد متمرکز باشد. این مسئله مهمی است که محتوای تازه و واقعی داشته باشید چرا که برای کار در مرحله بعدی به آن نیاز خواهید داشت.

۵- عناصر بصری

با در اختیار داشتن معماری سایت و برخی از مطالب و محتوا در جایگاه مناسب خود، ما می‌توانیم شروع به کار بر روی نام تجاری و برندینگ کسب و کار خود کنیم. بسته به مشتری، این مورد هم ممکن است در حال‌حاضر به خوبی تعریف شده باشد، اما احتمالاً شما سبک بصری یا (visual style) را از پایه و اساس تعریف کرده‌اید. ابزارهایی مانند سبک کاشی‌ها (style tiles)، کلاژهای عنصر (element collages) و moodboards نیز می‌توانند در این فرایند کمک کننده باشند.

۶- تست و آزمایش

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

۷- راه‌اندازی!

هنگامی که همه چیز به زیبایی کار می‌کند، وقت آن است که اقدام به طرح‌ریزی و اجرای سایت برای راه‌اندازی کنیم! آخرین مرحله از فرآیند طراحی سایت باید شامل برنامه‌ریزی هم در زمان راه‌اندازی و هم در راهبردها و استراتژی‌های ارتباطی باشد. زمانی‌که شما وب‌سایت خود راه‌اندازی می‌کنید، چگونه از دنیا با خبر می‌شوید؟ پس وقت آن است که شکاف‌ها را از بین ببریم.

ترجمه‌ای از:

۷ simple steps to the web design process, webflow blog

منبع: https://bit.ly/325kxJh

Create A product first!

Create a product first please!