|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/react-js-responsive-single-page-company-portfolio-website/
课程评论：没有评论
课程名称：React JS 响应式单页公司作品集网站 课程概述：欢迎参加这门 React JS 课程。在本课程中，您将构建一个完整的现实世界响应式单页Web应用程序，利用 React JS 技术。课程还将教您如何使用 Node JS 和 Express JS 通过 Nodemailer 和 SendGrid 发送电子邮件。您将打造一个功能齐全的真实企业简介网站，项目包含丰富的功能和特点，我努力将 React JS 的不同功能融入到项目中。以下是您将学习的内容： - 创建具有平滑滚动效果的单页应用程序。 - 使用 React HTTP 请求获取 API 数据并展示在应用中。 - 利用上下文 API 实现深色和浅色主题切换。 - 使用 Bootstrap 使网站在任何设备上响应式。 - 实现打字效果。 - 使用 React Player 在应用中播放视频。 - 为 API 数据添加分页功能，构建自定义设计的分页。 - 实现图像放大效果。 - 学习如何在 React 应用中使用滑块展示响应式幻灯片。 - 使用 React JS 的 POST 请求从联系表单发送电子邮件。 - 使用条件渲染为不同项目生成不同的颜色。 - 使用 Node JS 和 Express JS 进行后端邮件发送。 - 利用 Postman 测试 API 端点并发送电子邮件。 - 为应用中的各种项目添加加载和滚动时的动画效果。 - 实现返回顶部的滚动功能。 暗/浅色主题特性：您将学习如何动态改变 React 应用的主题颜色，使用 React Context API 构建主题系统。 React 手风琴特性：构建基于 API 数据的手风琴系统，并标记单个打开的项目。 使用的视频播放器：从 URL 播放视频。 React Hooks：您将在构建完整 React 应用时使用以下 Hooks：useState、useEffect、createContext。 使用的不同包： - React Smooth Scrolling：实现导航点击平滑滚动至不同部分。 - Typewriting Effect：为主页添加各种打字效果。 - React Paginate：为课程部分添加数据分页。 - React Slick Slider：在反馈部分展示响应式滑块。 - React Toastify：为用户发送邮件时显示 Toast 消息。 - Back-to-Top Scroll：在单页应用中实现回到页面顶部的功能。 - React Reveal：为每个项目添加动画效果。 - Node Mailer：结合 Node JS、Express JS 和 SendGrid 发送邮件。 - React Player：播放 YouTube 视频或其他视频，了解其各种功能与控制。 Git 和 GitHub：学习如何将 React 项目发布到 GitHub，创建分支并提交代码，进行 Git Pull 请求，处理不同分支并合并，以及如何执行 Git 提交。 本课程将为您提供构建现代响应式网站的全套技能与经验。
Welcome to this react js course. In this course, you will build a complete real-world responsive single-page web app using react js. You will also learn how to use node js and express js for sending an email using nodemailer and SendGrid. You will build a fully functional real-world responsive company profile website. This project has a lot of functionality and features. I tried to add different sorts of features of react js. Here are the lists that you are gonna learn from this course:Single-page app with smooth scrolling.React HTTP Request for an API endpoint.How to get API data and show it in the react app.Context API to add Dark and Light theme.Bootstrap to make our website responsive for any device.Typewriting effect.How to play video in react js app using react player.How to add pagination with API data. You will build custom-designed pagination with API data.React js loads more pagination features.How to add image zoom-in effect in react js app.React js slick slider. You will learn how to show a responsive slider.React js post request to send email from contact form.React js conditional rendering to generate different colors for different items.Node js and express js for sending emails from the backend.How to test API endpoint in postman for sending an email.React js animation for different items of our app while loading the first time and scrolling.How to add back-to-top scroll features in react js front end app.Theme Features - Dark theme and light theme for our react js app.How to send email from react js using node js, express js, and send grid.How to deploy react js app to Netlify.Dark and Light theme Features: You will learn how to dynamically change react app theme color. We will use react Context API to build this theming system.React Accordion Features: You will build react accordion system with API data. We will get our data from a public API endpoint and then will show it in accordion mode. You will also learn how to mark a single item if the accordion is open.React Video Player: To play video in our react js app from URL.React Hooks that you will use to build the complete react js app:useStateuseEffectcreateContextDifferent packages that you will use in this course:React smooth scrolling - This package we will use to scroll from one section to another section when user clicks on the navbar. Typewriting effect - We will use this package to add different types of writing effects to our app. The different sentences will be added in this type of writing effect in the main home section. React paginate - We will use this package to add pagination to our app. In the career section, we will show API data in our app and we will show pagination so that can slice our data and show it based on the pagination number instead of showing all the data from our API endpoint.React slick slider - We will use this package for our feedback section where we will show a list of feedback in the slider. We will also make sure that our slider is responsive to any device.React toastify - To show toast messages to our users when they send emails from the contact form.Back-to-top scroll - This package will be used for scroll-to-top features. In a single-page web app, we have many sections on one page. Therefore when our user scrolls to the last section of the page the user again needs to scroll to reach the top section. To solve this problem we will use back-to-scroll features so that they can just click on the button and then it automatically goes to the top section.React reveal - This package will help us to show animation for each item. You will learn how to add animation for any fields in your react js app.Node Mailer - To send e-mail ail we will use nodemailer with node js, express js and sendgrid.React Player - We will use this package to play youtube videos or any other videos in our react js app. You will explore different kinds of functionalities for this react player and how to control it.Git and GitHub:You will learn how to publish react js project to Github.How to create a branch and push our code to GitHub.How to do a git pull request.Work on different branches and merge them.How to do git commit.
