Build a Movie APP With React | React Tutorial for Beginners

Learn how to code an interactive Movie Database app using ReactJS. We look into the implementations of using an API to get information about movies and display them on screen using react components. We also look into hooks such as the useState hook to create a functional state.

A Javascript Project

Day 5 #31Days31Videos

// MY GEAR FOR CODING AND YOUTUBE

All of these products I own and have tested!

FOLLOW ME ON TWITTER!!!

LIKE, SUBSCRIBE & SHARE

Music: DEAF KEV - Invincible (NCS Release)

[VladimirCordas]

Great tutorial, I would just like to add that we should use if condition around render method in Results component, so when results is empty it doesn't throw type error on map method, but renders some text instead.

[sounak]

I laughed so hard when you looked at the default css and called it disgusting 😂😂😂

[rahulzagade]

please keep bringing such videos all other react videos are complicated But Your Are Easy TO Understand :)

[evenyoucancode]

This is the video that got me to your channel. Loved it.

[ridwanulhasantanvir]

9:20 section main css
16:52 Search ({ handleIn } adding curly brace

[claudiaalves]

great tutorial, helped me a lot, thanks

[utkarshjoshi]

Loved the how quickly and simply the app was created.
Though found one issue when a movie is opened even if content is not big a scroll is coming
So to Fix that
use {(typeof state.selected.Title != 'undefined') ?
<Popup selected={state.selected} closePopup={closePopup} /> : <Results results={state.results} openPopup={openPopup}/> }
and put overflow-y: auto in css so it gives scrollbar only if the text exceed
and : either renders Popup or Results as if the popup is rendered above the Results than it will take the space of the Results as base

[mih]

Thanks so much for this man, and your effort & time.

[mustaphaabdulmuiz]

Hi there, Thank you so much for the tutorial, i had a problem when trying to create the openPopUp section, i keep getting {Response: "False", Error: "Incorrect IMDb ID."}, i have tried everything but nothing seems to work.

[istandaloneroronoazoro]

Tyler Pots I LOVE DRAGON BALL AS WELL!!!! Are you by any chance an even bigger anime fan! I'd like to connect and talk more about this if so! I am also a Developer - both for Software as well as for Front-End, at Junior level tough!


I am also in the UK :)

[secularph]

17:30 why does it logs out one character before, the console.log is used every time text is changed

[maplestoryinchinese]

Where did you find that the '&s=' is the right search key for the API?

[dericmasten]

What extension is installed to generate the line from 8:20-8:26 ?

[ekaagustina]

Greattt! Its understandable for beginner like me. But I was wondering how to clear the input field?? 🤔🤔

[MrFlamerFuel]

Great vid but I get a problem @24:45 when we hit Enter I get "TypeError: Cannot read property 'map' of undefined". I´m using another API if that could be it? @Tyler Potts please help!

[iLord]

Thank you, I just made an anime database

[Tonestire]

I don't understand why you need a ternary operator for the Popup component but not your Search or Results components. How is it that those two don't render when your Popup component is rendered?

[manaspaul]

I have a question. sometimes it's rally seems complicated for me, What's the difference between writing a function inside the render or outside the render, if you discuss this on the next day that's gonna be great.

[ilyasezzahid]

thank you, your videos ar great. Do more content on React please

[wyattbrown]

Did anyone else get a TypeError: Cannot read property 'map' of undefined? I am having this issue and I don't know how to solve it.