برای انجام پروژه ابتدا این ریپازیتوری را Fork کنید سپس پوشه template را کپی کنید و آن را به نام و نام‌خانوادگی خود تغییر دهید. مثلا AliFarjad پوشه کار شما می شود. برای اجرای اولیه دستورات زیر را به ترتیب در محیط ترمینال (power shell ویندوز یا خود vs code) اجرا نمایید.
- npm install
- npm run dev
دستور اول ماژول های مورد نیاز را نصب می کند و دستور دوم پروژه را در محیط محلی سیستم شما اجرا می کند و یک آدرس برای اجرا در مروگر به شما می دهد.
در این پروژه باید فرم لاگین و رجیستر (ورود و ثبت نام) با UI یا ظاهری مانند تصویر زیر را پیاده سازی نمایید.
سناریوهای موجود مانند سناریوهای تعریف شده در سند تعریف پروژه بوت کمپ ری اکت فراوین می باشد.
https://docs.google.com/document/d/1wCyCf_wjd5xZ4b06qnFrbEg29AYGtQYyWJ0-Or-O6Xg/edit?usp=drivesdk
با این تفاوت که با ظاهری مانند عکس فوق و زبان انگلیسی. همچنین سناریوهای زیر اضافه شده است:
- برای بررسی صحیح بودن موبایل از regex موجود کتابخانه فراوین استفاده شود.
farawin.mobileRegex(این نکته رعایت شود که اعداد فارسی به انگلیسی تبدیل شوند می توان از تابعfarawin.toEnDigitبرای این منظور استفاده نمود) - استفاده از
farawin.testLoginبرای لاگین وfarawin.testRegisterبرای ثبت نام (باید نام کاربری که همان موبایل هست به همراه پسورد به تابع ارسال نمایید.) خروجی این توابعPromiseمی باشند. - با کلیک کاربر بر روی نوشته forgot password یک alert با این متن به کاربر نمایش داده شود:
این امکان هنوز پیاده سازی نشده است - با کلیک بر روی sign up همین فرم تنها با تغییر متن ها به متن های مناسب برای رجیستر، افزودن یک
inputبرای دریافت تکرار رمز ورود، همچنین تغییر sign up به sign in و عملکرد آن و دیگر موارد مورد نیاز برای رجیستر تبدیل به فرم رجیستر شود.
دوستان توضیحات این پروژه رو ابتدا کامل مطالعه بفرمایید.
در ارائه این پروژه در نظر داشته باشید: ۱- پروژه رو برای خودتون مرحله بندی کنید و بعد از هر مرحله یک کامیت با توضیحات کامل داشته باشید ۲- تغییرات یا کامیت های خودتون رو مرتب و روزانه (از فردا) مرج نمایید. مدنظر داشته باشید نیازی به کامل بودن نیست مراحل مهم می باشد ۳- اولویت پروژه به صورت زیر است. یعنی باید از درست بودن هر مرحله اطمینان حاصل کنید و بعد به اولیوت های بعدی رو پیاده کنید
اولیوت ها: *با انجام حداقل موارد ظاهری یا UI کارکرد سناریوها انجام شود.
- تستی کامل از سناریوها انجام گشته و در صورت بروز خطا ابتدا خطا ها برطرف شود. *موارد ظاهری مطابق تصویر خواسته شده گردد.
کد Css برای بک گراند دکمه لاگین:
background: -webkit-linear-gradient(right,#00dbde,#fc00ff,#00dbde,#fc00ff)
آدرس تست نمونه اصلی: