|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/react-js-e-commerce/
课程评论：没有评论
课程内容总结： 本课程是一门关于使用 React.js、Bootstrap 和 CSS 构建高级电子商务项目的综合性前端开发课程。课程内容从零开始，循序渐进，旨在帮助不同水平的学习者掌握开发一个功能齐全的电商网站的前端部分。 课程主要涵盖以下几个方面： 1. **项目搭建与配置**: * 安装和配置 VS Code 编辑器。 * 创建和启动新的 React 项目。 * 安装和配置 React Bootstrap。 * 安装 Fonts 和 Icon 库。 * 创建项目所需的文件夹和库。 2. **核心组件设计与实现**: * **导航栏 (TopNavbar)**：设计和实现顶部导航栏，包括搜索功能和图标。 * **首页内容 (HomeTop)**：设计和实现侧边栏和产品轮播（使用 Slider Slick 库）。 * **主要商品分类**: 创建和设计商品分类展示区域。 * **产品展示**: 设计和实现新品、精选产品等不同的产品列表展示，并实现通过按钮控制轮播。 * **底部 (Footer)**：设计和实现网站的页脚部分。 3. **页面布局与跳转**: * **主页 (HomePage)**：搭建整体主页布局，并组织各个组件。 * **单页设计**: * 设计和实现联系我们页面 (Contact Page)。 * 设计和实现收藏页面 (Favorite Page)。 * 设计和实现通知页面 (Notification Page)，包括通知详情。 * 设计和实现购物车 (CartList Page)，包括商品列表、支付信息和历史订单。 4. **用户认证与管理**: * **注册与登录**: 设计和实现用户注册、登录、忘记密码和重置密码的页面。 5. **商品详情与相关功能**: * **分类商品列表 (Category Products)**：设计和实现展示特定分类下商品的页面。 * **商品详情 (Product Detail/Details)**：设计和实现商品详情页面，包括图片放大 (Zoom Image)、多图预览 (Preview Image)。 * **推荐与评价**: 设计和实现推荐产品 (Suggested Products) 和用户评价 (Review List) 部分。 * **搜索功能 (Search Page)**：设计和实现搜索商品页面。 * **子分类页面 (SubCategory Page)**：设计和实现展示子分类下商品的页面。 * **关于我们 (About us)**：设计和实现公司介绍页面。 6. **路由管理 (React Router Dom)**: * 实现页面之间的导航跳转，将按钮和侧边栏菜单链接到相应的页面。 7. **国际化与用户体验优化**: * **多语言支持 (MultiLanguage)**：实现网站的多语言切换功能。 * **产品评价系统 (Rating)**：设计和实现产品评分和评论功能，并集成 React Fontawesome 库用于图标显示。 本课程注重实践，提供各部分的源代码，帮助学习者快速掌握 React.js 前端开发技能。
React js +Bootstrap + CSS بإستخدام E-commerce دورة تشرح برمجة متجر إلكتروني وبإستخدام العديد من التقنيات البرمجة المستخدمة في برمجة وتطوير المواقع الإلكترونية,صممت هذه الدورة خطوة بخطوة ومن الصفر لتناسب جميع مستويات المتدربين والطلاب وجعل المتدرب يقوم بالتطبيق العملي للدروس كما تم تزويد الدورة بالأكواد البرمجية الخاصة بكل قسم من أقسام الدورة لتساعد وتسرع عملية التعلم لدى المتدرب والوصول إلى الهدف المطلوب بأقصر الطرق. تعتبر هذه الدورة هي القسم الأول من الموقع وهو قسم الواجهات الأمامية Frontend , أما الأقسام المتبيقة تم جعلها في دورات منفصلة لتسهيل الدراسة والمذاكرة على المتدربينالقسم الأول - تثبيت وتهيئة مشروع رياكت الدرس الأول - إنشاء وتشغيل مشروع رياكت جديدVS code - الدرس الثاني - تثبيت محرر الأكوادReact BootStrap - الدرس الثالث- تثبيت مكتبةFonts _Icon - الدرس الرابع - إنشاء المجلدات والمكتبات الضروريةTopNavbar -القسم الثاني - تصميم وبرمحة قسمTopNavbar - الدرس الأول - تصميم وبرمجة قسمالدرس الثاني - إضافة قسم البحث و الأيقوناتالدرس الثالث - تنسيق التصميم والألوان للأزرارالدرس الرابع - تنسيق التصميم ضمن عدة أعمدةHomeTop القسم الثالث - تصميم وبرمجة القائمة الجانبية والشرائح HomeTop - الدرس الأول - تصميم الهيكل الأساسي لقسمالدرس الثاني - تصميم القائمة الجانبيةالدرس الثالث - إظهار وإخفاء القائمة الفرعيةالدرس الرابع - تنسيق التصميمSlider Slick - الدرس الخامس - إضافة مكتبة عرض الشرائحالدرس السادس - تنسيق إعدادات الشرائحالقسم الرابع - تصميم وبرمجة قسم الأصناف الرئيسيةالدرس الأول - إنشاء الملفات الخاصة بقسم الأصنافالدرس الثاني - تصميم وبرمجة قسم الأصنافالقسم الخامس - تصميم وبرمجة أقسام المنتجاتالدرس الأول - تصميم وبرمجة قسم المنتجات الجديدةالدرس الثاني - التحكم بالشرائح عن طريق الأزرارCollection products - الدرس الثالث - تصميم وبرمجة قسم المنتجاتFeatured Products - الدرس الرابع - تصميم وبرمجة قسم المنتجات المميزةFooter -القسم السادس - تصميم وبرمجة قسم الفوترFooter -الدرس الأول - تصميم وبرمجة قسم الفوترHomePage - الدرس الثاني - إنشاء الصفحة الرئيسية وتنظيم المكونات ضمنهاالقسم السابع - تصميم وبرمجة صفحات الموقعContact Page - الدرس الأول - تصميم صفحة التواصلFavorate Page - الدرس الثاني - تصميم وبرمجة صفحة المفضلةNotification Page - القسم الثامن - تصميم وبرمجة صفحة الإشعاراتالدرس الأول - تصميم وبرمجة صفحة الإشعاراتالدرس الثاني - إظهار تفاصيل الإشعاراتCartList Page -القسم التاسع - تصميم وبرمجة صفحة الإضافة إلى سلة المشترياتالدرس الأول - تصميم وبرمجة قسم المنتجات المضافة إلى سلة المشترياتالدرس الثاني - تصميم قسم معلومات الدفعالدرس الثالث - تصميم وبرمجة صفحة الطلبات السابقة للزبائن وحالة الطلباتRegister-Login -القسم العاشر - تصميم وبرمجة نظام تسجيل الدخولالدرس الأول - تصميم وبرمجة صفحة تسجيل مستخدم جديدالدرس الثاني - تصميم وبرمجة صفحة تسجيل الدخولالدرس الثالث -تصميم وبرمجة صفحة نسيان كلمة السرالدرس الرابع - تصميم وبرمجة صفحة تعيين كلمة سر جديدةالقسم الحادي عشر - تصميم وبرمجة صفحات الأصناف والمنتجاتCategory Products - الدرس الأول - تصميم وبرمجة صفحة أصناف المنتجاتProduct Detail - الدرس الثاني - تصميم وبرمجة صفحة تفاصيل المنتجات - 1Product Details - الدرس الثالث - تصميم وبرمجة صفحة تفاصيل المنتجات - 2Zoom Image - الدرس الرابع - تكبير حجم الصورة عند وضع مؤشر الماوس على الصورةPreview Image - الدرس الخامس - برمجة استعراض جميع صور المنتجSuggested Products - الدرس السادس - تصميم وبرمجة قسم المنتجات المقترحةReview List - الدرس السابع - تصميم وبرمجة قسم التقييماتSearch Page -الدرس الثامن - تصميم وبرمجة صفحة البحث عن المنتجاتSubCategory Page - الدرس التاسع - تصميم وبرمجة صفحة المنتجات الفرعيةAbout us - الدرس العاشر- تصميم صفحة معلومات عن الموقعReact Router Dom - القسم الثاني عشر - برمجة الأنتقال بين صفحات الموقعReact Router Dom - الدرس الأول - برمجة الانتقال ما بين الصفحات 1React Router Dom - الدرس الثاني - برمجة الانتقال ما بين الصفحات 2Header Router - الدرس الثالث - ربط الأزرار مع الصفحات الخاصة بهاAuth Pages - الدرس الرابع- ربط الأزرار مع صفحات نظام تسجيل الدخولSubCategory router - الدرس الخامس - ربط القائمة الجانبية مع صفحة الأصناف الفرعيةCategory router - الدرس السادس - ربط قسم الأصناف مع صفحة الأصنافProduct details router - الدرس السابع - ربط المنتجات مع صفحة تفاصيل المنتجContact us router - الدرس الثامن - ربط قسم التواصل مع صفحة التواصلMultiLanguage - القسم الثالث عشر -إضافة اللغات وإضافة بعض التحسيناتMultiLanguage - الدرس الأول - جعل الموقع متعدد اللغات وإضافة بعض التحسيناتRating - القسم الرابع عشر - تصميم وبرمجة نظام تقييم المنتجاتالدرس الأول - إضافة التقييم إلى المنتجاتالدرس الثاني - تصميم قسم التقييم للمستخدمreact fontawasome - الدرس الثالث - تثبيت مكتبة الأيقوناتالدرس الرابع - برمجة وظائف قسم التقييم والمراجعة
