refer to check tech requirements

[maggiez13]

Tech Checklist

Project Fundamentals

• [ ] Used Vite for this project
• [x] Used React
• [x] Used React Router for client side routing
• [x] Used Context at least once
• [x] Made a fetch to get multiple resources
• [x] Made a fetch to get a single, specific resource
• [ ] Made a third fetch for whatever you want
• [ ] Bonus: Were able to get it deployed in a functional state

React Fundamentals

• [ ] Created at least 3 components
• [ ] Have all components in their own files (1 export per file)
• [ ] Passed props to a component at least 3 times
  • [ ] 1st check box
  • [ ] 2nd check box
  • [ ] 3rd check box
• [ ] Used the useState hook at least 3 times
  • [ ] 1st check box
  • [ ] 2nd check box
  • [ ] 3rd check box
• [ ] Used the useEffect hook at least 2 times
  • [ ] 1st check box
  • [ ] 2nd check box
• [ ] Handled at least 2 non-submission events (clicking on something causes a UI change)
  • [ ] 1st check box
  • [ ] 2nd check box
• [x] Handled form submission event properly with React syntax
• [ ] At no point did you ever use any vanilla DOM JS methods
• [x] Rendered an array of items to the screen at least once

Advanced React

• [x] Used the useContext hook at least once
• [ ] Had at least 2 different pages in the application
• [ ] Used the proper Link components to navigate between pages
• [ ] Used the useParams hook at least once
• [ ] Demonstrated a working controlled Form
• [ ] Lifted state up out of a component at least once
  • That is a fancy way of saying that you had the state of a component and then passed down the getter and setter functions for the hook to a child component. You've seen us do this!

Style

• [x] Navigation bar fits cleanly on mobile and desktop
• [ ] Navigation visually indicates what page you are on
  • Think underlines, bolding, etc. this should change as you move around the site
• [ ] Used Flexbox or Grid to style list of components
• [ ] Repeated elements have a consistent "card" style
• [ ] Site has a primary color
• [ ] Site has a secondary color
• [ ] Site has an accent color
  • This is for things like buttons, links, etc.
• [ ] No more than 2 different fonts were used on any one page
• [ ] Buttons have altered visual states for hover, active, and focus
• [ ] Links have altered visual states for hover, active, and focus

A11y

• [ ] There is a main element on each page
• [ ] There is a nav element on each page
• [ ] The nav contains a ul of links
• [ ] At least one h1 element on each page
• [ ] At least one section is used properly on each page
• [ ] Heading tag hierarchy is always correct
• [ ] div is never used in place of ul and li
• [ ] Every form input has a proper label
• [ ] Each form is aria labelled properly to make it a landmark
• [ ] Every img has a unique alt (if applicable, get points if no image)
• [ ] All colors have a AAA difference
  • https://color.a11y.com can check your site for you!
• [ ] All buttons look like buttons, all links look like links

README

• [ ] Includes a README.md file
• [ ] The README file describes the purpose and audience for the application
• [ ] The README file describes the user stories
• [ ] The README file include screenshots of the final project

[Gonzalomarcylabschool]

These should all be broken down into your Tickets. So in the tickets you have made, take the tasks that go along with the feature/ Requirement of the project that it goes along with. These should also be how you break down your timeline in your Proposal.