{"id":25417502,"url":"https://github.com/dev-nayanbiswas/reelera","last_synced_at":"2026-04-07T09:31:19.235Z","repository":{"id":271342239,"uuid":"898613697","full_name":"Dev-NayanBiswas/ReelEra","owner":"Dev-NayanBiswas","description":"ReelEra is an engaging online portal designed for movie enthusiasts, offering a platform to explore, share, and celebrate their love for cinema. Movie lovers can upload and showcase films that reflect their personal interests, creating a vibrant community of shared tastes","archived":false,"fork":false,"pushed_at":"2025-01-07T05:21:15.000Z","size":8174,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-16T17:59:29.865Z","etag":null,"topics":["mongodb","motion","react","reactrouterdom","tailwindcss"],"latest_commit_sha":null,"homepage":"https://reeleraassignment10.netlify.app/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Dev-NayanBiswas.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-12-04T17:54:05.000Z","updated_at":"2025-01-07T23:10:01.000Z","dependencies_parsed_at":"2025-01-07T06:33:06.884Z","dependency_job_id":null,"html_url":"https://github.com/Dev-NayanBiswas/ReelEra","commit_stats":null,"previous_names":["dev-nayanbiswas/assignment-10-client","dev-nayanbiswas/reelera"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dev-NayanBiswas%2FReelEra","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dev-NayanBiswas%2FReelEra/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dev-NayanBiswas%2FReelEra/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dev-NayanBiswas%2FReelEra/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Dev-NayanBiswas","download_url":"https://codeload.github.com/Dev-NayanBiswas/ReelEra/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":239171866,"owners_count":19594047,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["mongodb","motion","react","reactrouterdom","tailwindcss"],"created_at":"2025-02-16T17:59:42.537Z","updated_at":"2025-12-30T21:50:42.187Z","avatar_url":"https://github.com/Dev-NayanBiswas.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp\u003e\n\u003ca\u003e\n\u003ch1 align=\"center\"\u003eReelEra\u003c/h1\u003e\n\u003cp align=\"center\"\u003eone stop for All movies\u003c/p\u003e\n\u003c/a\u003e\n\u003c/p\u003e\n\n***\n\n\n#### *Intro*\n\n\n*Basically it's an online portal for movie lovers, movie freak can upload movies of their personal interest. Our goal is to make it an open source for them who love to add movies in their watchList and can get the updates about new upcoming movies and can buy tickets online...*\n#### *Key Features*\n*Its an open source for all kind of people who love to watch and share their zone of interest with others, all they need to do just login or Sign up*\n- *On first landing page their is a carousel of new released and upcoming movie posters, then our top rated movies based on our users ratings. A subscription package section for our premium users who will like to get every single updates about new movies.Our contact details and a social section where user can join our Gang in social sites*\n*On add Movie page user can add movies what ever he likes most cause we do believe in sharing so it's open for all to contribute*\n- *All movies section is a free zone where any user can visit. without login he won't be able to go further long*\n- *Registration process of ours is so simple, All you need to do create an user on signUp page and you are good to go. If you don't like to be bother by login process then google signUp would be the best. Existed user can login and can set password if they fail to login with existed credentials **(Note:password should be 8characters long and must have a special character, one uppercase and lowercase letters)***\n- *Only logged in user can add Movies on add movies section he/she need to go through our general criteria, No reel or short movies are allowed*\n- *Details page with come up with details of selected movie, where user can edit or delete movies or can save them as their Favorite one*\n- *If user think these information of details page is not proper so he can update the details as well by clicking on pen icons will give him the access of detail page*\n- *User can't choose one movies again n again it well turn red whenever they add that particular movie on their favorite list*\n- *On My Favorite page user can have a look of his favlisted movies, as well as can delete their already watched movies by clicking on remove button*\n- *We got an FAQ section for those users who like to know more about us and to serve their little queries without spending a single word*\n\n\u003cimg align=\"center\" src=\"./src/assets/iconLogo.svg\" alt=\"\" /\u003e\n\n#### *Web Dev Zone*\n***This simple single page website was created with-***\n- ***TailwindCss***\n  - custom Classes.\n  - Applied utility class.\n  - InlineCss.\n  \n- ***Framer Motion***\n  - Basic Enter Animation.\n  - Gestures.\n  - Variants.\n  - useScroll Hook.\n  - useTransform Hook.\n  - useSpring Hook.\n  - WhileInView\n  \n- ***Javascript***\n   - Basic JS like ternary, Double Not, OR operator, Array Methods,Async Functions,Regular Functions, Immediately Invoked Function Expression, Optional Chaining, TryCatch blocks, fetching method and more...\n- ***React with Vite***\n    - useState with conditional values\n    - useEffect, with no dependencies, multiple Dependencies..\n    - Custom Hook,\n    - Context API..\n- ***React Router Dom***\n  - Optional Routing,\n  - Dynamic Routing,\n  - Index routing,\n  - useRouterError,\n  - Navigate Component,\n  - Outlet,  \n  - useParams,\n  - useLoaderData,\n  - useNavigate,\n  - useLocation,\n  - Link\n  - NavLink\n- ***Firebase Authentications***\n  - Google SigIn\n  - Sign Up with Email and Password\n  - Update Profile\n  - Signin with Email \u0026 Password\n  - Password Reset\n- ***Express js***\n  - POST\n  - GET\n  - PUT\n  - DELETE methods\n- ***Node js \u0026 MongoDB.***\n  - insertOne()\n  - find()\n  - findOne()\n  - DeleteOne()\n  - updateOne() \n\n\n\u003cp\u003e\n    \u003ca\u003e\n    \u003ch4 align=\"center\"\u003eRoute \u0026 Components\u003c/h4\u003e\n    \u003cp align=\"center\"\u003e\u003ci\u003eSimple overview of routes \u0026 Components are distributed following this Diagram\u003c/i\u003e\u003c/p\u003e\n    \u003c/a\u003e\n\u003c/p\u003e\n\n```mermaid\nflowchart LR\nclassDef routeStyle fill:#D1E8FF,stroke:#004AAD,stroke-width:2px,color:#004AAD,font-size:18px,font-weight:bold;\nclassDef componentStyle fill:#FFEBCD,stroke:#D2691E,stroke-width:2px,color:#8B4513,font-size:18px,font-style:italic;\n\nid1([main.jsx Root]) --\u003e id2([MainLayout])\nid2 --\u003e id4([Home]) --\u003e id5([HomePage])\nid5--\u003eid40([Banner Carousel])\nid5--\u003eid41([Top Rated Movies])\nid5--\u003eid42([Subscription Packages])\nid5--\u003eid43([Contact])\nid2 --\u003e id6([All Movies]) --\u003e id7([All Movies Page])\nid2 --\u003e id8([My Favorite]) --\u003e id9([Favorite Movies])\nid2 --\u003eid54([Add Movies]) --\u003e id55([Add \u0026 Update])\nid2 --\u003e id10([FAQ]) --\u003e id11([FAQ Page])\nid2 --\u003e id16([Registration]) --\u003e id17([Sign In Page])\nid16 --\u003e id18([Sign Up Page])\nid16 --\u003e id19([Forget Password Page])\nid2 --\u003e id12([Details]) --\u003e id13([MovieDetails Page])\nid2 --\u003e id14([Error]) --\u003e id15([ErrorPage])\n\n\n\nclass id2,id4,id6,id8,id10,id12,id14,id16,id54 routeStyle\nclass id1,id5,id7,id9,id11,id13,id15,id17,id19,id55,id40,id41,id42,id43,id18 componentStyle\n\n```\n\n\n***\n\u003cp\u003e\n    \u003ca\u003e\n    \u003ch4 align=\"center\"\u003eServer\u003c/h4\u003e\n    \u003cp align=\"center\"\u003eSimple File \u0026 Folder map\u003c/p\u003e\n    \u003c/a\u003e\n\u003c/p\u003e\n\n\n```mermaid\nstateDiagram-v2\nclassDef controller fill: ,color:green,font-weight:bold,stroke-width:0px;\nclassDef main fill: #fafafc ,color:green,font-weight:bold,stroke-width:0px;\n\nclassDef config fill:#fafafc,color:green,font-weight:bold,stroke-width:0px;\n\nclassDef function fill:#4b4c4f,font-weight:bold,font-size:16px,stroke-width:0px, color: #dcdee4 ;\n\nclassDef root fill:#b2dcea ,font-weight:bold,font-size:24px,stroke-width:0px, color: #60606a, font-style:italic;\n\n\nfavMoviesController --\u003e index.js\nglobalErrorControl --\u003e index.js \nproductController --\u003e index.js \ndataBase --\u003e index.js \n\nindex.js ::: root\nfavMoviesController ::: config\nproductController ::: config\nglobalErrorControl ::: config\nConfig ::: config\nControllers ::: main\ndataBase ::: config\n\ngetAllMovies ::: function\nupdateAMovie ::: function\naddANewMovie ::: function\ndeleteAMovie ::: function\ngetMovieByID ::: function\ngetTopRatedMovies ::: function\naddFavoriteMovie ::: function\ndeleteFavoriteMovie ::: function\ngetAllFavoriteMovies ::: function\nglobalError ::: function\nMongoDB ::: function\n\n    state Config {\n        state dataBase {\n            MongoDB \n        }\n    }\n    state Controllers {\n        state favMoviesController {\n            addFavoriteMovie--\u003edeleteFavoriteMovie\n            deleteFavoriteMovie--\u003egetAllFavoriteMovies\n        }\n        state globalErrorControl {\n            globalError\n        }\n        state productController {\n            getAllMovies --\u003e updateAMovie\n            updateAMovie --\u003e addANewMovie\n            addANewMovie --\u003e deleteAMovie\n            deleteAMovie --\u003e getMovieByID\n            getMovieByID --\u003e getTopRatedMovies\n        }\n    }\n```\n***\n\n\n##### *Errors and Challenges*\n- *As criteria I took challenge to apply react-hook-form for all input fields except search bar. Here I learn few new functionalities like how to handle error, crating setError manually, register input fields and handling errors with formState:{errors}, clear manual Errors, reset input fields, watch specific field changes like state, control and Controller concepts are not really clear yet...*\n- *React-simple-Rating was not so simple to handle with react hook form*\n- *As add and Edit are the quite similar functionality same form for both Add and Edit operations based on conditions and mode*\n- *Tried to apply add to favorite button toggler which one through me into an infinity loop*\n- *Search functionality was awesome thanks to Shariyar Vai for better explanation, few things are clear but still now need to learn more about MongoDB and Node.js*\n- *Thanks to Dave Gray, procademy, piyushGarg, codeWithRobby for a global error handler, cause it was really great and effective way to handle error rather then watching red texts on terminals.Know this was not an standard way to handle it I just tried to apply just a portion of their huge project, still learning and getting confused but improving myself*\n- *Tried to apply framer motion animation here though I'am in learning process but I found it quite easier then GSAP animation*\n- *Tried to explain my whole project into mermaid charts I found it really great to explain and to debug codes* \n\n***\n[_Feel Free to Visit **ReelEra**_](https://reeleraassignment10.netlify.app/)\n\n\u003cbr/\u003e\n\u003cbr/\u003e\n\u003cbr/\u003e\n\u003cbr/\u003e\n\u003cbr/\u003e\n\u003cbr/\u003e\n\u003cbr/\u003e\n\u003cbr/\u003e\n\u003cbr/\u003e\n\n\n\u003cimg align=\"center\" src=\"./src/assets/popCorn.svg\" alt=\"\" /\u003e\n\n### *Thanks for Visiting*\n### \u003ca\u003e*ReelEra*\u003c/a\u003e\n\n***Everyone knows that debugging is twice as hard as writing a program in the first place. So if you're as clever as you can be when you write it, how will you ever debug it?***\n\n\u003ca\u003e ― *Brian Kernighan*\u003c/a\u003e \n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdev-nayanbiswas%2Freelera","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdev-nayanbiswas%2Freelera","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdev-nayanbiswas%2Freelera/lists"}