This course explores Javascript based front-end application development, and in particular the React library (Currently Ver. 16.3). This course will use JavaScript ES6 for developing React application. You will also get an introduction to the use of Reactstrap for Bootstrap 4-based responsive UI design. You will be introduced to various aspects of React components. You will learn about React router and its use in developing single-page applications. You will also learn about designing controlled forms. You will be introduced to the Flux architecture and Redux. You will explore various aspects of Redux and use it to develop React-Redux powered applications. You will then learn to use Fetch for client-server communication and the use of REST API on the server side. A quick tour through React animation support and testing rounds off the course. You must have preferably completed the previous course in the specialization on Bootstrap 4, or have a working knowledge of Bootstrap 4 to be able to navigate this course. Also a good working knowledge of JavaScript, especially ES 5 is strongly recommended. At the end of this course you will: - Be familiar with client-side Javascript application development and the React library - Be able to implement single page applications in React - Be able to use various React features including components and forms - Be able to implement a functional front-end web application using React - Be able to use Reactstrap for designing responsive React applications - Be able to use Redux to design the architecture for a React-Redux application
Этот курс входит в специализацию ''Специализация Full-Stack Web Development with React'
Front-End Web Development with React
от партнера
Об этом курсе
Недавно просмотрено: 162,355
Learner Career Outcomes
41%
начал новую карьеру, пройдя эти курсы
45%
получил значимые преимущества в карьере благодаря этому курсу
31%
стал больше зарабатывать или получил повышение
Learner Career Outcomes
41%
начал новую карьеру, пройдя эти курсы
45%
получил значимые преимущества в карьере благодаря этому курсу
31%
стал больше зарабатывать или получил повышение
100% онлайн
Начните сейчас и учитесь по собственному графику.
Курс 2 из 4 в программе
Гибкие сроки
Назначьте сроки сдачи в соответствии со своим графиком.
Промежуточный уровень
Прибл. 33 часа на выполнение
Предполагаемая нагрузка: 4 weeks of study, 6-8 hours/week
Английский
Субтитры: Английский
Программа курса: что вы изучите
12 ч. на завершение
Introduction to React
In this module we get a quick introduction to front-end JavaScript frameworks and libraries, followed by an introduction to React. We will also learn about React components and JSX.
12 ч. на завершение
21 видео ((всего 234 мин.)), 23 материалов для самостоятельного изучения, 2 тестов
21 видео
How to Use the Learning Resources10мин
What is Full-Stack Web Development?5мин
Exercise (Video): Setting up Git6мин
Exercise (Video): Basic Git Commands18мин
Exercise (Video): Online Git Repositories12мин
Node.js and NPM3мин
Exercise (Video): Setting up Node.js and NPM2мин
Exercise (Video): Basics of Node.js and NPM23мин
Front-end JavaScript Frameworks and Libraries Overview12мин
Introduction to React8мин
Exercise (Video): Getting Started with React9мин
React App Overview16мин
Introduction to JSX5мин
Exercise (Video): Configuring your React Application9мин
React Components3мин
Exercise (Video): React Components Part 124мин
React Components: State and Props9мин
Exercise (Video): React Components Part 222мин
React Components: Lifecycle Methods Part 114мин
Assignment 1 Requirements (Video): React Components5мин
23 материала для самостоятельного изучения
Welcome to Front-End Web Development with React: Additional Resources10мин
Full-Stack Web Development: The Big Picture: Objectives and Outcomes10мин
Full Stack Web Development: Additional Resources10мин
Setting up Your Development Environment: Git and Node: Objectives and Outcomes10мин
Setting up your Development Environment10мин
Exercise (Instructions): Setting up Git10мин
Exercise (Instructions): Basic Git Commands10мин
Exercise (Instructions): Online Git Repositories10мин
Exercise (Instructions): Setting up Node.js and NPM10мин
Exercise (Instructions): Basics of Node.js and NPM10мин
Setting up your Development Environment: Git and Node: Additional Resources10мин
Introduction to React: Objectives and Outcomes10мин
Exercise (Instructions): Getting Started with React10мин
Exercise (Instructions): Configuring your React Application10мин
Introduction to React: Additional Resources10мин
React Components: Objectives and Outcomes10мин
Exercise (Instructions): React Components Part 110мин
Exercise (Instructions): React Components Part 210мин
React Components: Additional Resources10мин
Assignment 1: React Components: Additional Resources10мин
Ideation: Objectives and Outcomes10мин
Ideation Report Template10мин
Ideation: Additional Resources10мин
10 ч. на завершение
React Router and Single Page Applications
In this week, you will learn about various component types. You will learn about React router and its use in designing single page applications. You will also learn about single page applications and use React Router to design single page applications.
10 ч. на завершение
14 видео ((всего 191 мин.)), 16 материалов для самостоятельного изучения, 2 тестов
14 видео
Exercise (Video): Presentational and Container Components21мин
React Components: Lifecycle Methods Part 28мин
Functional Components3мин
Exercise (Video): Functional Components14мин
React Virtual DOM6мин
Exercise (Video): Header and Footer17мин
React Router8мин
Exercise (Video): React Router36мин
Single Page Applications9мин
Exercise (Video): Single Page Applications Part 123мин
React Router: Parameters6мин
Exercise (Video): Single Page Applications Part 223мин
Assignment 2: React Router and Single Page Applications4мин
16 материала для самостоятельного изучения
React Component Types: Objectives and Outcomes10мин
Exercise (Instructions): Presentational and Container Components10мин
Exercise (Instructions): Functional Components10мин
React Component Types: Additional Resources10мин
React Router: Objectives and Outcomes10мин
Exercise (Instructions): Header and Footer10мин
Exercise (Instructions): React Router10мин
React Router: Additional Resources10мин
Single Page Applications: Objectives and Outcomes10мин
Exercise (Instructions): Single Page Applications Part 110мин
Exercise (Instructions): Single Page Applications Part 210мин
Single Page Applications: Additional Resources10мин
Assignment 2: React Router and Single Page Applications: Additional Resources10мин
UI Design and Prototyping: Objectives and Outcomes10мин
UI Design and Prototyping Report Template10мин
UI Design and Prototyping: Additional Resources10мин
8 ч. на завершение
React Forms, Flow Architecture and Introduction to Redux
In this module you will be introduced to uncontrolled and controlled forms and briefly examine form validation in React applications. You will get an overview of the Flux architecture and introduced to Redux as a way of realizing the flux architecture
8 ч. на завершение
13 видео ((всего 188 мин.)), 15 материалов для самостоятельного изучения, 1 тест
13 видео
Controlled Forms5мин
Exercise (Video): Controlled Forms35мин
Exercise (Video): Controlled Form Validation23мин
Uncontrolled Components2мин
Exercise (Video): Uncontrolled Forms17мин
The Model-View-Controller Framework7мин
The Flux Architecture11мин
Introduction to Redux20мин
Exercise (Video): Introduction to Redux23мин
React Redux Forms4мин
Exercise (Video): React Redux Form13мин
Exercise (Video): React Redux Form Validation15мин
Assignment 3: React Forms and Redux5мин
15 материала для самостоятельного изучения
Controlled Forms: Objectives and Oute10мин
Exercise (Instructions): Controlled Forms10мин
Exercise (Instructions): Controlled Form Validation10мин
Controlled Forms: Additional Resources10мин
Uncontrolled Forms: Objectives and Outcomes10мин
Exercise (Instructions): Uncontrolled Forms10мин
Uncontrolled Forms: Additional Resources10мин
Introduction to Redux: Objectives and Outcomes10мин
Exercise (Instructions): Introduction to Redux10мин
Introduction to Redux: Additional Resources10мин
React Redux Form: Objectives and Outcomes10мин
Exercise (Instructions): React Redux Form10мин
Exercise (Instructions): React Redux Form Validation10мин
React Redux Form: Additional Resources10мин
Assignment 3: React Forms and Redux: Additional Resources10мин
14 ч. на завершение
More Redux and Client-Server Communication
In this module you will explore Redux further including Redux action, combining reducers, and Redux thunk, client-server communication using Fetch and the REST API. You will get a brief introduction to animation in React. You will also learn about testing, building and deploying React applications.
14 ч. на завершение
20 видео ((всего 312 мин.)), 26 материалов для самостоятельного изучения, 2 тестов
20 видео
Redux Actions8мин
Exercise (Video): Combining Reducers9мин
Exercise (Video): Redux Actions24мин
Redux Thunk10мин
Exercise (Video): Redux Thunk50мин
Exercise (Video): React-Redux-Form Revisited12мин
Networking Essentials17мин
Brief Representational State Transfer (REST)16мин
Exercise (Video): Setting up a Server using json-server6мин
Promises10мин
Fetch20мин
Exercise (Video): Fetch from Server33мин
Exercise (Video): Fetch Handling Errors15мин
Exercise (Video): Fetch Post Comment18мин
React Animations13мин
Exercise (Video): React Animations9мин
Exercise (Video): React Animation Components9мин
Assignment 4: Redux, Client-Server Communication and Fetch4мин
Introduction to Webpack7мин
Exercise (Video): Building and Deploying the React Application11мин
26 материала для самостоятельного изучения
Redux Actions: Objectives and Outcomes10мин
Exercise (Instructions): Combining Reducers10мин
Exercise (Instructions): Redux Actions10мин
Redux Actions: Additional Resources10мин
Redux Thunk: Objectives and Outcomes10мин
Exercise (Instructions): Redux Thunk10мин
Exercise (Instructions): React-Redux-Form Revisited10мин
Redux Thunk: Additional Resources10мин
Client-Server Communication: Objectives and Outcomes10мин
Exercise (Instructions): Setting up a Server using json-server10мин
Client-Server Communication: Additional Resources10мин
Fetch: Objectives and Outcomes10мин
Exercise (Instructions): Fetch from Server10мин
Exercise (Instructions): Fetch Handling Errors10мин
Exercise (Instructions): Fetch Post Comment10мин
Fetch: Additional Resources10мин
React Animations: Objectives and Outcomes10мин
Exercise (Instructions): React Animations10мин
Exercise (Instructions): React Animation Components10мин
React Animations: Additional Resources10мин
Assignment 4: Redux, Client-Server Communication and Fetch: Additional Resources10мин
Building and Deployment: Objectives and Outcomes10мин
Exercise (Instructions): Building and Deploying the React Application10мин
Building and Deployment: Additional Resources10мин
Project Implementation: Objectives and Outcomes10мин
Final Report Template10мин
Лучшие отзывы о курсе Front-End Web Development with React
The course was very helpful for me I learnt many new things in react world through this course. The instructor teached the course very well and covered all the content nicely. Thanks coursera
Instructor Jogesh is really good and I feed the course pace is set absolutely perfect for online learning quickly and easily.\n\nThank you sir,\n\nBest Regards,\n\nKishore Buridi
Преподаватели
Jogesh K. Muppala
Associate ProfessorDepartment of Computer Science and Engineering
О Гонконгский университет науки и технологий
HKUST - A dynamic, international research university, in relentless pursuit of excellence, leading the advance of science and technology, and educating the new generation of front-runners for Asia and the world.
Специализация Full-Stack Web Development with React: общие сведения
Learn front-end and hybrid mobile development, with server-side support, for implementing a multi-platform solution.
The first two courses in this Specialization cover front-end frameworks: Bootstrap 4 and React. You’ll also learn to create hybrid mobile applications, using React Native. On the server side, you’ll learn to implement NoSQL databases using MongoDB, work within a Node.js environment and Express framework, and communicate to the client side through a RESTful API. Learners enrolling in this Specialization are expected to have prior working knowledge of HTML, CSS and JavaScript.
Ideally learners should complete the courses in the specified sequence. It is strongly recommended that the React course be completed before proceeding with the React Native course.
Часто задаваемые вопросы
Когда я получу доступ к лекциям и заданиям?
Зарегистрировавшись на сертификацию, вы получите доступ ко всем видео, тестам и заданиям по программированию (если они предусмотрены). Задания по взаимной оценке сокурсниками можно сдавать и проверять только после начала сессии. Если вы проходите курс без оплаты, некоторые задания могут быть недоступны.
Что я получу, оформив подписку на специализацию?
Записавшись на курс, вы получите доступ ко всем курсам в специализации, а также возможность получить сертификат о его прохождении. После успешного прохождения курса на странице ваших достижений появится электронный сертификат. Оттуда его можно распечатать или прикрепить к профилю LinkedIn. Просто ознакомиться с содержанием курса можно бесплатно.
Какие правила возврата средств?
Можно ли получить финансовую помощь?
Остались вопросы? Посетите Центр поддержки учащихся.