К содержимому
learnspaceYOUR NEXT CHAPTER
ПРОСТРАНСТВО ОБУЧЕНИЯ
ГлавнаяКаталог курсовМоё обучениеCoursera

Знания без границ

Учитесь у лучших университетов и компаний мира.

Открыть Coursera
Интеграция
Пространство университета
Моё пространствоСтраница курса
↵
ЯЛичный кабинетСтудент
© 2026 LearnSpaceКаждый день — возможность узнать больше.Помощь
Web Development Bootcamp with React Bootstrap 5 & REST API · LearnSpace
Назад в каталог
courseraПрограммирование

Web Development Bootcamp with React Bootstrap 5 & REST API

Курс от Packt
Средний≈ 12.5 чАнглийский
О курсеНавыкиПрограммаПреподаватели

О курсе

This course features Coursera Coach! A smarter way to learn with interactive, real-time conversations that help you test your knowledge, challenge assumptions, and deepen your understanding as you progress through the course. Dive into the world of modern web development with a hands-on, project-based approach using React, Bootstrap 5, and REST APIs. Throughout this course, you'll master the fundamentals of web development, learn how to create stunning user interfaces, and connect to APIs for dynamic content management. The journey starts with setting up your environment, including Visual Studio Code and Node.js, before advancing to building and styling your React app with Bootstrap and custom components. As you progress, you’ll design engaging features like navigation bars, contact forms, and homepages. You will also delve into React Router for seamless navigation, enhance user experiences with dynamic routing, and integrate REST API functionality to fetch and display real-time data. Practical exercises will allow you to practice creating, editing, and deleting posts, while also covering essential user management features like signup, login, and authentication. This course is perfect for aspiring web developers who want to build a solid foundation in React development and integrate interactive APIs into their applications. It’s suitable for beginners with a basic understanding of HTML, CSS, and JavaScript, and it progressively builds on your skills to reach more complex tasks. By the end of the course, you will be able to create dynamic, responsive websites using React, Bootstrap 5, and REST APIs, manage user authentication, implement CRUD functionality, and style web pages effectively with modern tools and practices.

Навыки, которые вы освоите

Context ManagementUser AccountsCascading Style Sheets (CSS)HTML and CSSWeb DesignResponsive Web DesignDevelopment EnvironmentHypertext Markup Language (HTML)Frontend Integration

Программа курса

7 модулей · 82 учебных материалов

01Introduction and Setup8 материалов

Introduction and Setup

Course IntroductionВидеоFull Course ResourcesЧтениеInstall Visual Studio Code editorВидеоInstalling NodeJS runtimeВидео

Учитесь у экспертов

Packt - Course Instructors

Преподаватель курса

Web Development Bootcamp with React Bootstrap 5 & REST API
В каталоге вашей программы

Инвестируйте в себя

Новые знания — в удобное для вас время.

Начать на Coursera

Обучение откроется на Coursera
в новой вкладке

Обучение на Coursera

≈ 12.5 ч

7 модулей

Язык: Английский

Часть программы вашего университета
Create React App and Start Dev ServerВидео
Understanding React Project Structure and LifecycleВидео
Integrating Bootstrap5, Google Fonts, and FontAwesomeВидео
Introduction and Setup - AssessmentЗадание
02Designing NavBar, About us, Contact us with Routing13 материалов

Designing NavBar, About us, Contact us with Routing

Creating First React Component the NavBarВидеоStyling NavBar Component with Bootstrap5 NavBarВидеоCustomizing NavBar MenuВидеоCreating About and Contact PagesВидеоInstalling NPM Package for react-router-domВидеоAdding Routing for All the ComponentsВидеоSingle Page Behavior on Menu Items Click with NavLinkВидеоDesigning About Us Page Header SectionВидеоDesigning About Us Page Content SectionВидеоStyling Our Contact Us Form with Bootstrap - Part 1ВидеоStyling Our Contact Us Form with Bootstrap - Part 2ВидеоCreating a Contact Page with Bootstrap and ReactDIALOGUEDesigning NavBar, About us, Contact us with Routing - AssessmentЗадание
03Designing Footer, Homepage, and Call to Action14 материалов

Designing Footer, Homepage, and Call to Action

Designing Footer Section Layout - Part 1ВидеоDesigning Footer Section Heading - Part 2ВидеоDesigning Footer Quick Links - Part 3ВидеоDesigning Footer Newsletter - Part 4ВидеоDesigning Footer Contact Address - Part 5ВидеоHomepage LayoutВидеоDesigning Homepage Hero Section SliderВидеоDesigning Homepage Featured Post SectionВидеоDesigning Homepage Latest Post SectionВидеоDesigning Homepage Portfolio SectionВидеоAdd Home Link to the NavBarВидеоDesigning Call to Action sectionВидеоDesigning a Responsive Footer and Homepage in React with BootstrapDIALOGUEDesigning Footer, Homepage, and Call to Action - AssessmentЗадание
04Working on All Posts and Post Detail with REST API Integration16 материалов

Working on All Posts and Post Detail with REST API Integration

Create All Post Page and Link to NavBar NavigationВидеоDesigning All Posts PageВидеоUnderstanding REST API for Getting Post DataВидеоReact Hooks useState and useEffect to Call Posts API and Store Data on PageВидеоShow Posts Data on UI by Looping All DataВидеоShowing Loading Icon While the Data Is Fetched from the REST APIВидеоAdding API Base URL to a Config File and Using It EverywhereВидеоDynamic Routing Passing Data from One Component to AnotherВидеоGet Post and User Data from REST API CallВидеоDesign Layout of Post Detail PageВидеоDestructuring and Setting Post and User Data from Response to State VariablesВидеоDisplaying Post and User Information on ScreenВидеоStyling the Post Detail and All Posts ImagesВидеоImplementing Opening Email and Phone FunctionalityВидеоCreating a Post Listing and Detail View with API CallsDIALOGUEWorking on All Posts and Post Detail with REST API Integration - AssessmentЗадание
05Working on Create, Edit, Delete Post Functionality with API Integration11 материалов

Working on Create, Edit, Delete Post Functionality with API Integration

Implementing Create Post FunctionalityВидеоAlert Message for Success and Error ScenariosВидеоUpdate All Posts with Edit and Delete ButtonsВидеоEdit Post Reuse the Create Post FlowВидеоTesting Edit and Create Post FunctionalityВидеоDelete Post and Show Alert Message after DeletionВидеоDelete Confirmation Yes or NoВидеоReload All Posts after DeletionВидеоAdd a Back Button on the Post Detail ScreenВидеоBuilding a CRUD Post Management Interface with React and API IntegrationDIALOGUEWorking on Create, Edit, Delete Post Functionality with API Integration - AssessmentЗадание
06Working on Signup, Login, and Logout with API Integration8 материалов

Working on Signup, Login, and Logout with API Integration

Creating Login and Signup Screen with NavigationВидеоAxios Post Call for User RegistrationВидеоSaving User Data and Showing Success Alert MessageВидеоClearing Signup Form Data after LoginВидеоUser Login with an API CallВидеоStoring User Data and Token Secret in localStorageВидеоImplementing Login and Sign Up FunctionalityDIALOGUEWorking on Signup, Login, and Logout with API Integration - AssessmentЗадание
07User Session, Dynamic Menu, Redux, Context API12 материалов

User Session, Dynamic Menu, Redux, Context API

What Is Redux and Why We Need ItВидеоDefine User Reducer with Different ActionsВидеоProps Versus Context APIВидеоImplement Restricted Routes Based on User Session with Context API and ReduxВидеоDispatch Action to Reducer after Successful LoginВидеоImplementing Logout FunctionalityВидеоImplement Dynamic Menu Based on User SessionВидеоGet All Posts for Logged-In UserВидеоTesting All Functionality End to EndВидеоUser Session, Dynamic Menu, Redux, Context API - AssessmentЗаданиеFull Course Practice AssessmentЗаданиеFull Course AssessmentЗадание