const Projects = ({ github_repos }) => {
return (
{/* FLASHCARD O MATIC */}
A flash card application for teacher to create decks on subjects they teach, and for students to be able to study those decks.
💼 About this project
A local school has decided to put together a flash card application, Flashcard-o-matic, to help their students study online. Teachers will use this application to create decks of flash cards for the subjects that they teach, and students will study the decks.
🧠 What I learned
This was an assessment for Thinkful's Software Engineering Immersion.
Learning Objectives:
- Installing packages via NPM
- Running tests from the command line
- Writing React function components
- Creating routes, including nested routes, using React Router
- Using hooks like useState(), useParams(), and useHistory()
- Debugging React code through console output and using the VS Code debugger
Grading Criteria:
- All the props are treated as read-only.
- State is never directly mutated; it's only updated via setState().
- The Edit Card and Create Card screens share the same form component.
- The useEffect() hooks have the appropriate dependencies listed in the dependency array.
- State is "lifted up" to the parent component where appropriate.
- All inputs are controlled. Generally, there is a warning on the console when you type into the input box and it changes from uncontrolled to controlled. The warning looks like this: "Warning: Input is changing an uncontrolled input of type <text|number|etc.> to be controlled." This is often the result of initializing the state to null or undefined.
)
}
export default Projects;