khanhtran47 / sora Goto Github PK

@ctuanle We use zustand because it's cute
https://github.com/pmndrs/zustand

Example: title should be List movies instead of Remix App

create list trending page with list image and table

@ctuanle

• trên api của imdb t thấy gọi theo page nên t nghĩ mình chia phim theo page luôn thay vì call theo kiểu lướt xuống dưới thì sẽ call thêm page 2
• có thể kiểu khi call về mình lưu thông tin vào 1 state, khi chuyển page rồi quay lại những page cũ sẽ k phải call lại
• thêm 1 hàng trên cùng để lm cái bộ lọc với search phim

setup eslint-prettier rules

• https://github.com/Josh-McFarlin/remix-image
• lazy-loading images

Maybe take data from db like this, but we create a card banner from next-ui (or mui) like in the design :v
https://nextui.org/docs/components/card
https://mui.com/material-ui/react-card/

source pic: dribble

• Home
  • TV Series
  • Movie
  • Anime
• Discovery
• Artists
• Detail (movie, artist...)
• SignIn, SignOut page
• ...

Send data from parent to child route
https://remix.run/docs/en/v1/api/remix#usematches

sadge nextui chưa có component select :( chắc xài tạm hàng của mui hoặc đợi khi mô có select của nextui thì lm ✌️

@ctuanle Filter movie and tv with discover api

https://developers.themoviedb.org/3/discover/movie-discover
https://developers.themoviedb.org/3/discover/tv-discover

@Khanhtran47
Nãy thấy master có mấy commits mới của bot, merge về branch feature thì thấy vercel chạy task deploy, đáng lẽ ra chỉ chạy task này khi có thay đổi phía master thôi nhỉ?

https://github.com/dromru/react-photoswipe-gallery

TODO:

• add search icon, search input, search route
• add api, infinite scrolling
  • https://developers.themoviedb.org/3/search/search-keywords
  • https://developers.themoviedb.org/3/search/multi-search

Add transition on opening/closing drawer for header

• replace all mui components to nextui and style css using stitches (in progress)
• Adding dark mode using use-dark-mode
  https://nextui.org/docs/theme/dark-mode
  https://stitches.dev/docs/theming
  https://rossmoody.com/writing/remix-stitches

@ctuanle player 2 cần id của imdb đều api detail của tvshow từ tmdb k có id imdb nên t k biết lấy kiểu gì, 1 là nghĩ cách lấy id imdb 2 là lm cái điều kiện xóa player 2 của tv show

Already add cast and crew tab in #123
things left to do: We have many items from both cast and crew (about 100 → 500 items), so we need to install a package for virtualizing list and use in List component

https://tanstack.com/virtual/v3/docs/guide/introduction

https://nextui.org/docs/components/modal

• close drawer when click a navlink or click outside
• design navlink when active for leftDrawer and Header
  https://remix.run/docs/en/v1/api/remix#navlink

Test with French
https://github.com/sergiodxa/remix-i18next

@ctuanle Maybe add a loader for hiding this :v

https://www.themoviedb.org/genre/80-crime/tv

• hide left-drawer and create new bottom navbar for mobile (optimize and display more content)
• fix response and design for mediaList and mediaItem
• ssr load dark theme (done but still have flash on loading theme)

• add movie picture, description, banner, genre, cast, director (if available)
• add similar movies
• add link embedded for movie 👍

[
        {
            "name": "123movies",
            "url": "https://googlvideo.com/"
        },
        { 
            "name": "2Embed",
            "url": "https://www.2embed.to/"
        },
        { 
            "name": "2Embed",
            "url": "https://2embed.org/"
        },
        {
            "name": "APIMovieDB",
            "url": "https://v2.apimdb.net/"
        },
        {
            "name": "DBGDrivePlayer",
            "url": "https://databasegdriveplayer.co/"
        },
        {
            "name": "DBGo",
            "url": "https://dbgo.fun/"
        },
        {
            "name": "FireSonic",
            "url": "https://firesonic.sc/play_video.php?video_id={imdbId}"
        },
        {
            "name": "Free Streaming API",
            "url": "https://fsapi.xyz/"
        },
        {
            "name": "GOMO",
            "url": "https://gomo.to/movie/{imdbId}"
        },
        {
            "name": "VidSource",
            "url": "https://vidsrc.me/"
        },
        {
            "name": "Superembed",
            "url": "https://www.superembed.stream/"
        },
        {
            "name": "Databasegdriveplayer",
            "url": "https://databasegdriveplayer.co/player.php?tmdb={TMDb_ID}"
        },
        {
            "name": "Autoembed",
            "url": "https://autoembed.xyz/"
        },
        {
            "name": "1movietv",
            "url": "https://1movietv.com/"
        },
        {
            "name": "Gdriveplayer",
            "url": "https://api.gdriveplayer.us/"
        },
        {
            "name": "Streamo",
            "url": "https://streamo.cc/"
        },
        {
            "name": "123movie",
            "url": "https://api.123movie.cc/"
        }
]

• features after finishing authentication 🤟

• thay hết mui icon rồi remove mui với emotion

t mới tìm đc cái ni, m bt thư viện mô có icon mô nhìn đc k ?
https://react-icons.github.io/react-icons

1. Trending

• get list

2. Movies

• get list
  • upcoming
  • popular
  • top_rated
• get detail
• get videos
• get credits
• get similar

3. Tv

• get list
  • upcoming
  • popular
  • on_the_air
• get detail
• get videos
• get credits
• get similar

style lại trang 404 với error, thêm nút để chuyển về trang chủ

• tạo component errorboundary + catchboundary

https://remix.run/docs/en/v1/api/conventions#catchboundary
https://remix.run/docs/en/v1/api/conventions#errorboundary
https://remix.run/docs/en/v1/guides/not-found
https://remix.run/docs/en/v1/guides/errors

https://nextui.org/docs/components/tooltip

Add a separate route and data for vi (for using ophim api :v)

• add padding 0, margin 0, box-sizing: border-box...
  https://nextui.org/docs/theme/customize-theme#global-styles
• maybe adding new font: poppins, lato...
• ...

https://www.themoviedb.org/person

Maybe using back for creating db for user :v

https://remix.run/docs/en/v1/guides/routing
@ctuanle m nghiên cứu cái ni thử, t đọc qua mà k chắc có đúng k nữa

• index.tsx
• trending.tsx
• recommend.tsx
• recent.tsx
• top-imdb.tsx
• history.tsx
• movies
  • /index.tsx (render a list of movies)
  • /$moviesId.tsx (theo t hiểu thì mỗi id film thì ứng với file như ri)
• tv-shows
  • /index.tsx
  • $tvId.tsx
• animes
  • $animesId.tsx
  • index.tsx (xài api của mal)
• __auth
  • login.tsx
  • signup.tsx
• __auth.jsx (này t k chắc)