React Project Three: Build a Class Scheduling Application


Not CompletedHow to Install the Redux Dev Tools

Welcome back to the course. In this video, we are going to implement the Redux dev tools extension so you can use them in your application.

Not CompletedMapping State to Props in Redux

What we want to do is get access to our courses data, so it will display in our application instead of the dummy data we put in, and we can learn about that through the mapStateToProps function.

Not CompletedHow to Use the Spread Operator to Map Course Data into the Library Course Component

Hey there, welcome back to the course, great job in getting mapStateToProps working in the libraryCourse or in the library component. In this video we are going to take the custom data and basically render it in our library course.

Not CompletedUpdating the Enrolled Property on the Course Model

Hey there, welcome back to the course in this video we are going to learn how we can mark these courses as enrolled and not enrolled.

Not CompletedImplement the Ability to Toggle the Enrolled Action and Reducer

Welcome back to the course, in this video we are going to make it so we can toggle our enrolled status. We're going to make it so we can click on this plus button and it will change the enrolled status in our store.

Not CompletedImplementing the Toggle Enrolled Reducer Functionality with JavaScript's Map Function

Welcome back to the course. In our last video with we set up our action and reducer for toggleEnrolled.

Not CompletedBuild in the Ability to Remove Elements in the Schedule Course Component

Alright, let's go ahead and put in the functionality for our remove course, so we want to make it so we can remove courses from our schedule and we are going to use the same action to do that.

Not CompletedBuilding the Progress Tracker Functionality

Alright, welcome back to the course so we have it so we can remove courses and that's great, but we don't have our progress tracker working. So in this video we are going to implement just the percentage functionality and then when we come around to this again after styling everything we will implement the animation effect.

Not CompletedStart of Style Implementation for the Course Library

Hi there, welcome back to the react course. In this video we are going to start styling our application starting with the Course Library title and this component the library course component.

Not CompletedLibrary Course Component Styles

We've brought some styles for the application but we obviously need to finish it, so let's put some styles in for the Course Library.

Not CompletedHow to Add and Remove CSS Classes in React

In this video, we are going to add some padding to our margins and we are going to style the arrow and I'm going to make it move up and down as well. Let's begin with styling the line.

Not CompletedRendering the Description Based on the Arrow Status

Welcome back to the course, in the last video we got our line styles in a little bit better and we got in the arrow animation put in.

Not CompletedImplementing the Course Selected Styles

Let's go ahead and get the styles in here so that when we have this hover animation, it stays when we have the course open.

Not CompletedAdding and Removing Button Styles in React

Let's go ahead and add in the styles for the button here.

Not CompletedHow to Add and Remove Action Animations in React

Welcome back to the course. In this video we are going to add in the animation when we click this so it's going to turn and turn into an 'X'.

Not CompletedHow to Animate a Component's Height in React

Welcome back to the course and in this video I'm going to show you how we can animate this.

Not CompletedRefactoring the Library Course Grid

Welcome back, in this video what we are going to want to do is open up Firefox, so that we can see the grid tools more easily.

Not CompletedLabel and Arrow Style Refactor

Welcome back to the course. In this video we're going to find out how we can put this line under our drop down for our course animation in our Course Library drop down so it hides when we hide it.

Not CompletedUsing an Extra Column Instead of Negative Margins

Welcome back to the course. In this video we're going to solve this problem right here, so when we hover over these courses it doesn't allow us to click on our little plus.

Not CompletedStyling the Schedule Header Label

Welcome back to the course, in this video we are going to make it so we're going to style this. Starting with the My Schedule label.

Unsupported Browser

devCamp does not support ancient browsers.
Install a modern version for best experience.