I am excited to share my first deployed web app on GitHub Pages with you all. Netflix Clone is the link to view the app. The purpose of creating this app is to practice pulling data from an API and displaying the data to the UI. I left out the CSS for the mobile version of the app and some styling for the loading state when retrieving shows because I want to start on other projects to help practice on new stuff that I’m currently learning, however I will go back to this app to implement what is left and add on new features. I am open for criticism, suggestions and reviews as these will be helpful for my development as a front end developer so don’t hold back lol.
Thank you guys in advance for checking this app out!
Hi, the issue I found is that the lower part of the website seems to be cropped for me and there is no scroll bar so I can’t reach the #page-info form or, after clicking an anime, I cannot reach the back button at the bottom of the page, if this is because of screen size, my screen resolution is around 1366x768 (also, some arrays are being logged to the console, not sure if it was intentional).
Other than that it seems to be responding well, I tried looking for different anime and saw no issues.
Do you mind giving me info on the device that you are using (desktop, mobile phone), the screen resolution of the device and the browser you are using? I’ll make note of this info for when I get back to this project
id you manually added all the content? and add a button to show full list rather than limited (25/page).. and where do you use react . cuz I’m not seeing anything when I REACT on it. LOL
Checked in firefox, its loading fine. but there seems to be an issue with me not being able to scroll to the bottom. Like wendel said, something is messing with scrolling/screen-sizes
Yes for some reason this issue only popped up for me when I opened the app on Chrome mobile but worked on other browsers. I’ll look into this further since this is my first time hosting a project through GitHub pages. Thank you for letting me know!
@authdev7 apparently what is causing the security issue is that Google flagged the project as a page using forms to obtain user data while posing as a popular app like Netflix (even though the page doesn’t have any forms for user information, only a search bar). However, I ended up making a report with Google stating that this app is only a portfolio project so it should be resolved in a couple of days.
On the scroll issue, I’d check if body or your main wrapper has height: 100vh together with overflow: hidden. That combo clips everything below the fold on shorter screens like 1366x768. Switching to min-height: 100vh and letting the page scroll normally usually fixes it, and you can test it by setting a small viewport in devtools device mode.
The Chrome warning makes sense too, a page that looks like Netflix plus a search box can trip their phishing check. Renaming the title and logo to something clearly your own might help the review go through faster.
Yes a lot of people are having an issue with scrolling to the bottom probably because I only have the scrollbar on the div with the list. I might have to tweak the design a bit to either allow for the header and footer to be sticky to the page or just display a shorter amount of shows for each page.
I’m a little bit old fashioned lol so I just threw the background image on there. I’ll see how I change up the design once I get back to this app. Thank you for checking it out!
