- Replace
<your_account>
with your Github username in the DEMO LINK - Follow the React task guideline
- Implement form inside
NewMovie
component. - Form state should be inside
NewMovie
. - Form should have next fields:
- title
- description
- imgUrl
- imdbUrl
- imdbId
- On form submit callback
onAdd
from props should be called with new film object. Also, form should be cleared. Page should not be reloaded.
Do it only if you understand everything
- validate controls values on blur
title
,imgUrl
,imdbUrl
,imdbId
should be requiredimgUrl
,imdbUrl
- should be valid urls (can use this regex/^((([A-Za-z]{3,9}:(?:\/\/)?)(?:[-;:&=+$,\w]+@)?[A-Za-z0-9.-]+|(?:www\.|[-;:&=+$,\w]+@)[A-Za-z0-9.-]+)((?:\/[+~%/.\w-_]*)?\??(?:[-+=&;%@.\w_]*)#?(?:[.!/\\\w]*))?)$/
)- invalid control should have red border and error message below
- if form is invalid submit(and submit button) should be disabled
- (**) show control as invalid only if control has been touched