VOOZH about

URL: https://www.coursera.org/learn/packt-react-js-portfolio-builder-hands-on-beginner-workshop-wydjf

⇱ React JS Portfolio Builder 2026 - Hands-On Beginner Workshop | Coursera


React JS Portfolio Builder 2026 - Hands-On Beginner Workshop

Ends soon! Keep adding new skills with 10,000+ programs for $239 (usually $399). Save now.

React JS Portfolio Builder 2026 - Hands-On Beginner Workshop

Included with

Gain insight into a topic and learn the fundamentals.
Beginner level

Recommended experience

5 hours to complete
Flexible schedule
Learn at your own pace

Gain insight into a topic and learn the fundamentals.
Beginner level

Recommended experience

5 hours to complete
Flexible schedule
Learn at your own pace

What you'll learn

  • Learn how to create reusable React components using modern best practices.

  • Understand the management of local and global state in React applications.

  • Build dynamic applications by integrating external APIs for real-world functionality.

Details to know

Shareable certificate

Add to your LinkedIn profile

Recently updated!

May 2026

Assessments

7 assignments

Taught in English

There are 7 modules in this course

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.

In this comprehensive workshop, you will build a real-world React project from the ground up. By the end of the course, you’ll have developed a complete portfolio application showcasing your React skills. You will learn how to set up your development environment, build reusable components, manage state effectively, and implement dynamic features. As you progress, you'll tackle complex topics like global state management and integrating APIs, all while developing a functional, interactive application. The course is structured to guide you step-by-step through every aspect of building a React project. You will begin with the basics, such as setting up your tools and generating a new React project, before diving into creating components and learning how React’s state management works. From there, you’ll implement essential application features like dynamic rendering, navigation, and result pages. The course also introduces API integration, giving you hands-on experience working with real-world data. Whether you’re looking to become proficient in React or build your portfolio with practical projects, this course has something for you. It’s ideal for beginners eager to learn React and gain hands-on experience. No prior React knowledge is required, though basic understanding of JavaScript and HTML will be beneficial. By the end of the course, you will be able to build fully functional React applications, manage state with React hooks, integrate external APIs, and deploy your projects to production environments.

In this module, we will set the foundation for your React portfolio project. You’ll gain insight into the course objectives and learn how to generate a React project. Additionally, we’ll review the essential starter files that will streamline your development process.

What's included

4 videos1 reading

4 videosTotal 11 minutes
  • Introduction1 minute
  • What We Will Implement?1 minute
  • Generating React Project7 minutes
  • I Prepared Some Files2 minutes
1 readingTotal 10 minutes
  • Full Course Resource10 minutes

In this module, we will dive into React component creation. You will learn how to develop reusable components, structure JSX markup, and leverage React Strict Mode to improve your development process and catch potential errors early.

What's included

3 videos1 assignment

3 videosTotal 13 minutes
  • Creating React Components7 minutes
  • Rendering React Components Markup5 minutes
  • React Strict Mode1 minute
1 assignmentTotal 15 minutes
  • Creating Our First Components - Assessment15 minutes

In this module, we will explore state management in React. You'll understand how to manage both local and global state using hooks like useState and useReducer, helping you build dynamic applications with seamless state handling.

What's included

3 videos1 assignment

3 videosTotal 28 minutes
  • useState Hook5 minutes
  • useReducer Hook9 minutes
  • Global State in React14 minutes
1 assignmentTotal 15 minutes
  • State Management - Assessment15 minutes

In this module, we will add interactive functionality to the application. You'll learn how to dynamically render questions, handle user navigation, display results, and provide visual feedback by highlighting answers.

What's included

5 videos1 assignment

5 videosTotal 47 minutes
  • Rendering Questions6 minutes
  • Next Button3 minutes
  • Result Page8 minutes
  • Rendering Answers12 minutes
  • Highlighting Answers17 minutes
1 assignmentTotal 15 minutes
  • Adding Functionality - Assessment15 minutes

In this module, we will work with real-world APIs. You’ll learn how to fetch trivia questions asynchronously and handle potential API errors, ensuring your application remains reliable and smooth for end users.

What's included

2 videos1 assignment

2 videosTotal 18 minutes
  • Making Async Questions with Trivia API14 minutes
  • Handling API Errors4 minutes
1 assignmentTotal 15 minutes
  • Working with Real API - Assessment15 minutes

In this module, we will guide you through the deployment process. You will learn how to set up a production server, configure it for React, and deploy your application live so others can access it online.

What's included

3 videos1 assignment

3 videosTotal 17 minutes
  • Renting a Production Server to Deploy React4 minutes
  • Configuring Production Server to Deploy React7 minutes
  • Uploading React to Production5 minutes
1 assignmentTotal 15 minutes
  • Deployment - Assessment15 minutes

In this module, we will give you practical homework to continue building and refining your skills beyond the course, ensuring you feel confident as you apply your newfound knowledge in real-world projects.

What's included

1 video2 assignments

1 videoTotal 1 minute
  • Homework1 minute
2 assignmentsTotal 75 minutes
  • Full Course Practice Assessment 15 minutes
  • Full Course Assessment60 minutes

Instructor

Offered by

Explore more from Software Development

Why people choose Coursera for their career

👁 Image

Felipe M.

Learner since 2018
"To be able to take courses at my own pace and rhythm has been an amazing experience. I can learn whenever it fits my schedule and mood."
👁 Image

Jennifer J.

Learner since 2020
"I directly applied the concepts and skills I learned from my courses to an exciting new project at work."
👁 Image

Larry W.

Learner since 2021
"When I need courses on topics that my university doesn't offer, Coursera is one of the best places to go."
👁 Image

Chaitanya A.

"Learning isn't just about being better at your job: it's so much more than that. Coursera allows me to learn without limits."

Frequently asked questions

React JS is a popular JavaScript library used for building user interfaces, especially for single-page applications. It allows developers to create reusable components, making the development process more efficient and scalable. React's component-based architecture and state management features make it an essential tool for modern web development, especially when building dynamic, interactive web applications.

This workshop teaches beginners how to build a React-based portfolio website from scratch. It covers essential topics like setting up React, creating components, managing state, integrating APIs, and deploying your application. By the end of the workshop, you'll have a fully functional portfolio project showcasing your newly acquired React skills.

After completing this workshop, you will be able to create React applications with interactive features like dynamic rendering, state management, and integration with external APIs. You'll also gain the ability to deploy your React applications to a production server, making your projects accessible to the world. This hands-on experience will be a valuable addition to your portfolio.

This workshop is designed for beginners, so no prior experience with React is required. However, a basic understanding of HTML, CSS, and JavaScript will be helpful as the workshop builds on these foundational web development skills.

This workshop is ideal for anyone looking to learn React from the ground up, particularly those interested in web development. If you're a beginner or looking to expand your skills in modern JavaScript frameworks, this workshop will give you the tools and knowledge to start building React applications and improve your portfolio.

The workshop takes approximately 2 hours to complete. It is a hands-on, practical session that you can follow along with at your own pace.

Yes, you can preview the first video and view the syllabus before you enroll. You must purchase the course to access content not included in the preview.

If you decide to enroll in the course before the session start date, you will have access to all of the lecture videos and readings for the course. You’ll be able to submit assignments once the session starts.

Once you enroll and your session begins, you will have access to all videos and other resources, including reading items and the course discussion forum. You’ll be able to view and submit practice assessments, and complete required graded assignments to earn a grade and a Course Certificate.

If you complete the course successfully, your electronic Course Certificate will be added to your Accomplishments page - from there, you can print your Course Certificate or add it to your LinkedIn profile.

This course is currently available only to learners who have paid or received financial aid, when available.

Yes. In select learning programs, you can apply for financial aid or a scholarship if you can’t afford the enrollment fee. If fin aid or scholarship is available for your learning program selection, you’ll find a link to apply on the description page.

Financial aid available,