Giter VIP home page Giter VIP logo

cineclix's Introduction

cineclix

Screenshot 2023-05-08 at 17 26 21

Description:

  • A Nextjs app that lets you view movies { popular, upcoming, topRated, etc }, also gives you more information about each movie..

In this project I have:

  • Kinda recreated a movie streaming platform that gives you information about movies according to trends.

Built With

Live Demo

Please click for the live demo.

Deliveries

  • Movie Page:-

Screenshot 2023-05-08 at 17 26 42

  • Search Bar:-

Screenshot 2023-05-08 at 17 26 58

๐ŸŽ‰ Getting Started

Make sure you fork it, to make your copy of the repo.

git clone https://github.com/Okekejr/cineclix.git

Install the dependencies (using npm or yarn

  • Using npm: npm install
  • Using yarn: yarn

Starting project locally

npm run start or yarn run dev

Show your support

Please give a โญ๏ธ if you like this project!

cineclix's People

Contributors

okekejr avatar

Stargazers

Shahrad Elahi avatar jist avatar

Watchers

 avatar

cineclix's Issues

navbar&pageLayout

Tasks:

  • create navbar component
  • import and create the app logo
  • build page layout

styles&page

Task:

  • cleanup default next.js files
  • add chakra theme and styles
  • download and import fonts
  • add 404-page redirect

moviesPage,SEO,favicon

Tasks:

  • create the movies page
  • pass the ids and create the movie UI
  • add next seo
  • edit the favicon

allSections&types

Tasks:

  • create the homepage
  • create all sections { topRated, upcoming, popularMovies, nowPlaying }
  • create and import types
  • create mini-movies and big-movie cards for some sections
  • make everything responsive up until now

Enhancement

Code Review Comment: Refactoring API Requests

Code Location: src/hooks/usePopular.ts

Overview

I've reviewed my usePopular hook and find that it's well-structured and effective for managing data fetching. However, I see opportunities to improve the code's readability and maintainability.

Suggestions

  1. Separation of Concerns: I'm thinking about breaking down the API request logic further by creating a dedicated utility function for making requests. This would help reduce code duplication and centralize error handling.

  2. Error Handling Enhancement: Instead of using alert(error) for error handling, I'll consider creating a standardized error-handling mechanism. This could involve returning error messages from the API request function and handling them appropriately in the hook.

  3. Type Definitions: While I've provided type annotations for state variables, I'll add type definitions for the response data from the API requests. This would provide stronger type safety and make the code more self-documenting.

  4. Parameterizing API Endpoints: To enhance the hook's reusability, I'm considering passing the API endpoints as parameters to the hook. This would allow me to use it for fetching other types of data as well.

  5. Testing: As this hook is crucial for fetching and managing data, I'll definitely write unit tests to ensure its functionality remains intact during future changes.

Conclusion

My code demonstrates my understanding of state management and data fetching in React. By implementing these suggestions, I can further improve the quality, maintainability, and extensibility of the usePopular hook.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.