طراحی رابط کاربری : زبان ها و فریم ورک های آن
@hesammousavi @ali.bayat @davoodkhany @mhmdkavosi @mehdisut @proamirm @milad @juza66 @rezajashnsaz0011
سلام
وقتتون بخیر
ببخشید من بیشتر تو زمینه بکند کار میکنم ولی خب بعضی وقتا دیگه مجبوریم فرانت هم کار کنیم
من فقط تا یه حدودایی html و css و bootstrap میدونم
به نظرتون برای نوشتن ui بعدش باید چه چیزایی یاد بگیرم؟! (نمیخوام ui خیلی حرفه ای بزنم، ساده ولی در حد قابل قبول)
قالب های آماده بوت استرپ رو از کجاها میتونم پیدا کنم؟! فارسی سازی (راست به چپ کردن) کار سختیه یا نه؟
بیشتر بحثم روی angular و vue و es6 و این چیزاس که اسمشونو فقط شنیدم
میخواستم ببینم اینا چی هستن اصلا و برای ui باید کدوما رو یاد بگیرم و پیش نیاز هاش چیا هست؟!
تشکر
پاسخها
11
قدم اول: یاگیری پایه
- به ترتیب:
- HTML
- CSS
قدم دوم (این قدم اختیاریه، ولی توصیه شدید میشه به دلیلی که میگم): شما نیاز به یک فاندیشن دارید که کارتون رو ساده کنه. در بوت استرپ اغلب این فاندیشن ها وجود داره و کافیه شخصی سازی بشه. درگیری با چیز هایی مثل Flexbox و همه و همه در بوت استرپ رفع میشه.
- یادگیری Bootstrap
قدم سوم: یادگیری جاوا اسکریپت (خود جاوا اسکریپت اولیه و اکما اسکریپت آخر، نیاز به عمیق شدن زیاد داخل این بخش نیست و اگه قبلا سابقه برنامه نویسی دارید، در طول پروژه دستتون میاد)
قدم چهارم (ایجاد تعامل با کاربر): قدیما این قدم چهار زیاد مطرح نبود اما الان واقعا اساسیه. ابزار هایی مثل reactjs و vuejs بهتون کمک میکنن که تا با کاربر تعامل بگیرید.
در واقع کار این ابزار ها اینه حجم کد هایی که شما نیاز داری با جاوا اسکریپت بزنی رو به شدت کاهش میدن و بسیار ساده میکنن.
مثال: در صورتی که کاربر روی منو کلیک کرد، بدون refresh محتوا بارگزاری بشه. یا وقتی کاربر روی این دکمه کلیک کرد، این اتفاق بیفته.
شما فکر میکنم قبلا فلاتر کار میکردید و مفاهیم استیت لس و استیت فول رو میدونید.
اینجا به همون شکله. وقتی فقط html css میزنید یعنی یه ویجت تماما استیت لس. اما وقتی vue یا react رو قاطی کار میکنید میشه یه ویجت استیت فول.
پیشنهاد من برای یادگیری Vue هستش؛ سادگی خیلی بیشتر نسبت به رقبا مثل reactjs و کم حجم بودن، و یادگیری سریع تر بدون سردرد.
اونجایی که نوشتید برای درخواست ajax چیکار کنم؟ این کم میره تو دسته استیت فول پس با vue قابل انجامه!
قدم پنجم: به کار شما نمیاد اما وارد مباحث pwa میشه. به نظرم pwa اونقدری که بهش میپردازن جا نیفتاده و هنوز پختگی کامل رو نداره. پس به یه فرانت کار توصیه میکنم یاد بگیره اما به یه نفری که میخواد کارش راه بیفته نه.
برای جمع بندی و خلاصه، پیشنهاد میکنم این ها رو یادبگیرید:
- HTML
- CSS
- Bootstrap
- JS (+ES)
- Vue.js
موفق باشید
درود...
برای نوشتن رابط کاربری یادگیری این چارچوب ها کافیه:
HTML -> CSS -> Sass = Bootstrap or Bulma
Javascript -> VueJS
angular و vue و اینا بیشتر واسه وب اپلیکیشن های SPA بکار میرن .. واسه یه قالب معمولی نیازی نیس اینا رو یاد بگیری همون jquery کافیه
واسه طراحی قالب باید این مسیر رو طی کنی
html css bootstrap js jquery
گفتگوهای مرتبط
شاید پاسخ شما همینجا باشد
@rezajashnsaz0011 @endworld
الان مثلا ui راکت رو با چه چیزی میشه زد؟
- vuex و vuejs چه فرقی با هم دارن؟
برای راکت رابط کاربری با ویو جی اس نوشته شده...
شما می توانید با بوت استرپ و ویو جی اس پروژه بنویسید...
Vue.js در واقع یک فریمورک جاوا اسکریپت با ابزار اختیاری مختلف برای ایجاد یک رابط کاربری مناسب است.
Vuex یک کتابخانه مدیریت وضعیت است که مخصوص ایجاد اپلیکیشنهای پیچیده و بزرگ در ویوجیاس است. در یک اپلیکیشن، Vuex از یک مکان ذخیرهسازی همگانی و مرکزی برای تمام کامپوننتها استفاده میکند. همچنین قابلیت بروزرسانیهای سریع را نیز به شما میدهد.
مکان ذخیرهسازی Vuex به شیوهای طراحی شده است که هر کامپوننتی نمیتواند وضعیت آن را تغییر دهد. این موضوع به شما اطمینان میدهد که وضعیتها تنها به دلایل منطقی تغییر خواهند کرد. بنابراین موارد ذخیره شده یک منبع قابل اطمینان و درست هستند: داده مربوط به هر المان تنها یکبار ذخیره شده و در حالت read-only قرار میگیرد، بنابراین کامپوننتهای دیگر نمیتواند روی آن تاثیر بگذارند.
خب css و html هستش دیگه!
بحث js هم برای ایجاد انیمشن یا درخواست های ایجکس و ... استفاده میشه .
vue که شما میگی اگر ساده بخوام بگم باهاش کامپونت میسازی یعنی html و css در فایل جدا با پسوند vue و تویی همون فایل میشه درخواست های ایجکس زده و بدون اینکه صفحه بخواد رفرش بشه دادها تون رو روی تگ های که مشخص میکنی مینویسی یا انیمشن ها ، real-time بودن یکسری تگ ها رو براش مینویسی.
vuex هم که دوستمون دربالا اشاره کردن برای نگهداری داده هاست، مثلا داده های یک کاربر که لاگین کرده یا توکن و ...
@elyasbeshkani
ui راکت رو میشه با html css bootstrap jquery زد
البته راکت از vuejs استفاده کرده بجای jquery
شما UI رو میتونی با HTML و CSS هم کار کنی.
اما یه جاهایی نیاز به Reactive بودن داری که باید از خود جاواسکریپت و یا jquery استفاده کنی.
حالا اگر بخواهی ۱ لول بری جلوتر .. jquery رو حذف میکنی و از React یا VueJs استفاده میکنی..
ببخشید پیش نیاز vue js چیه؟
فقط جاوااسکریت کافیه یا es6 و es7 و... هم لازمه
- برای دخواست های ajaxچطور؟ باید چی یاد بگیرم؟
سلام.
اگه نمیخوای خیلی درگیر فرانت بشی بنظرم
واسه دیزاین بوت استرپ یاد بگیر (بخاطر اینکه اموزش های بیشتری واسش هست٬سایت های بیشتری ازش استفاده میکنن مخصوصا توی ایران)
واسه جاوااسکریپت هم vue رو پیشنهاد میکنم چون کار باهاش واقعا سادس و واسه کسی که نمیخواد خیلی درگیر فرانت بشه عالیه.
@elyasbeshkani
پیش نیاز ویو جی اس یادگیری جاوا اسکریپت هستش...
اجاکس همین طور...
پیوند زیر:
https://www.w3schools.com/xml/ajax_intro.asp