{"id":15314771,"url":"https://github.com/yuna-c/vanilateam","last_synced_at":"2026-02-06T02:31:23.512Z","repository":{"id":251040188,"uuid":"836097608","full_name":"yuna-c/vanilaTeam","owner":"yuna-c","description":"vanila javascript team project","archived":false,"fork":false,"pushed_at":"2024-08-14T09:16:15.000Z","size":1396,"stargazers_count":0,"open_issues_count":0,"forks_count":2,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-07-19T09:08:08.297Z","etag":null,"topics":["firebase","fontawesome","html","javascript","scss","tmdb-api"],"latest_commit_sha":null,"homepage":"https://cinespot8.vercel.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/yuna-c.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,"zenodo":null}},"created_at":"2024-07-31T06:36:45.000Z","updated_at":"2024-08-14T09:16:18.000Z","dependencies_parsed_at":"2024-08-05T13:42:36.559Z","dependency_job_id":"2fa62c9f-bd0b-4ac8-bc7d-fe8912f649fe","html_url":"https://github.com/yuna-c/vanilaTeam","commit_stats":null,"previous_names":["yuna-c/vanilateam"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/yuna-c/vanilaTeam","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuna-c%2FvanilaTeam","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuna-c%2FvanilaTeam/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuna-c%2FvanilaTeam/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuna-c%2FvanilaTeam/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/yuna-c","download_url":"https://codeload.github.com/yuna-c/vanilaTeam/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuna-c%2FvanilaTeam/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29145828,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-06T01:13:33.096Z","status":"online","status_checked_at":"2026-02-06T02:00:08.092Z","response_time":59,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["firebase","fontawesome","html","javascript","scss","tmdb-api"],"created_at":"2024-10-01T08:46:59.558Z","updated_at":"2026-02-06T02:31:23.493Z","avatar_url":"https://github.com/yuna-c.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## vanilaMovie\n\nTMDB API를 통한 영화 검색 및 정보 탐색 사이트\n\u003cbr\u003e\n\n## 사이트\n\nhttps://cinespot8.vercel.app/\n\u003cbr\u003e\n\n## 개요\n\nMOViE API를 가공하여 사용자에게 MOVIE 정보를 줄 수 있는 페이지 제작\u003cbr\u003e\nAPI를 통한 비동기화를 연습해보는 사이트 제작\u003cbr\u003e\nSCSS를 통한 페이지 디자인\u003cbr\u003e\nJS로 페이지를 통으로 구현해 보는 연습\n\u003cbr\u003e\n\n## 개발기간\n\n2024.07.31~ 2024.08.07\n\u003cbr\u003e\n\n## 활용 기술\n\n\u003cimg src=\"https://img.shields.io/badge/sass-CC6699?style=for-the-badge\u0026logo=sass\u0026logoColor=white\"\u003e \u003cimg src=\"https://img.shields.io/badge/Javascript-F7DF1E?style=for-the-badge\u0026logo=javascript\u0026logoColor=white\"\u003e \u003cimg src=\"https://img.shields.io/badge/html5-E34F26?style=for-the-badge\u0026logo=html5\u0026logoColor=white\"\u003e \u003cimg src=\"https://img.shields.io/badge/TMDB API-F5C518?style=for-the-badge\u0026logo=themoviedatabase\u0026logoColor=white\"\u003e \u003cimg src=\"https://img.shields.io/badge/firebase-DD2C00?style=for-the-badge\u0026logo=firebase\u0026logoColor=white\"\u003e\n\u003cbr\u003e\n\n## Code Convention\n\n- .prettierrc 설정\n- JS : Camel Case\n- SCSS : kebab-case\n  \u003cbr\u003e\n\n## 기능 및 특징\n\n1. 회원가입 및 사용자 로그인 기능(유효성 검사)\n2. 마이페이지 비밀번호 변경, 찜 기능\n3. 사용자 리뷰 CRUD 기능\n4. 검색 기능\n5. 페이징 기능\n6. 모바일 페이지 토글 및 반응형\n7. 슬라이드 기능(메인/ 상세)\n8. 최신순/ 인기순 데이터 가공 소팅기능\n9. 하단 푸터의 날씨API를 사용한 지역,온도,날씨 출력\n   \u003cbr\u003e\n\n## 팀원\n\n\u003ctable\u003e\n   \u003ctr\u003e\n    \u003ctd align=\"center\"\u003e\u003cb\u003eFrontend\u003c/b\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003cb\u003eFrontend\u003c/b\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003cb\u003eFrontend\u003c/b\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003cb\u003eFrontend\u003c/b\u003e\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd align=\"center\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/kyulipark\" width=\"100px\" /\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/Limgife\" width=\"100px\" /\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/jungminji0215\" width=\"100px\" /\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/yuna-c\" width=\"100px\" /\u003e\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd align=\"center\"\u003e\u003cb\u003e\u003ca href=\"https://github.com/kyulipark\"\u003e박규리\u003c/a\u003e\u003c/b\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003cb\u003e\u003ca href=\"https://github.com/LGC1010\"\u003e임기철\u003c/a\u003e\u003c/b\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003cb\u003e\u003ca href=\"https://github.com/jungminji0215\"\u003e정민지\u003c/a\u003e\u003c/b\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003cb\u003e\u003ca href=\"https://github.com/yuna-c\"\u003e최유나\u003c/a\u003e\u003c/b\u003e\u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\n## 개인별 담당\n\n- **박규리** : 상세페이지 데이터 가공 및 페이지 UI\u003cbr\u003e\n  : 푸터 날씨, 온도, 지역 보이게 처리\u003cbr\u003e\n  : 푸터 멤버 소개 기능\u003cbr\u003e\n\n- **임기철** : 메인 상단 슬라이드 기능\u003cbr\u003e\n  : 메인 상단 최신순/ 인기순 데이터 소팅\u003cbr\u003e\n\n- **정민지** : 파이어 베이스를 통한 댓글 CRUD 기능\u003cbr\u003e\n  : 상세페이지 배우소개, 스틸컷 슬라이드 기능\u003cbr\u003e\n\n- **최유나** : TMDB API 세팅\u003cbr\u003e\n  : UIUX SCSS 세팅 및 모듈화\u003cbr\u003e\n  : search API를 통한 검색 기능\u003cbr\u003e\n  : search API를 통한 페이징 기능\u003cbr\u003e\n  : 마이페이지 찜기능/ 비밀번호 변경 기능\u003cbr\u003e\n  : 로그인 페이지 기능\u003cbr\u003e\n  : 회원가입 페이지 + 유효성 검사\u003cbr\u003e\n  : 반응형 처리 (메뉴 토글 기능)\n  \u003cbr\u003e\n\n## 폴더구조\n\n```bash\n@vanilaMovie                                           //\n└─vanilaMovie                                          //\n   ├─ index.html                                       //\n   ├─ page                                             //\n   │  ├─ Provider                                      //\n   │  │  ├─ detail.html                                //\n   │  │  ├─ join.html                                  //\n   │  │  ├─ login.html                                 //\n   │  │  └─ mypage.html                                //\n   ├─ js                                               //\n   │  ├─ detail                                        //\n   │  │  ├─ detail.js                                  //\n   │  │  ├─ detailCredits.js                           //\n   │  │  ├─ detailImages.js                            //\n   │  │  ├─ review.js                                  //\n   │  │  └─ script.js                                  //\n   │  ├─ join                                          //\n   │  │  ├─ join.js                                    //\n   │  │  └─ script.js                                  //\n   │  ├─ login                                         //\n   │  │  ├─ login.js                                   //\n   │  │  └─ script.js                                  //\n   │  ├─ mypage                                        //\n   │  │  ├─ mypage.js                                  //\n   │  │  └─ script.js                                  //\n   │  ├─ sort                                          //\n   │  │  └─ sort.js                                    //\n   │  ├─ utils                                         //\n   │  │  ├─ date.js                                    //\n   │  │  └─ uuid.js                                    //\n   │  ├─ config.js                                     //\n   │  ├─ fetchData.js                                  //\n   │  ├─ fetchFirebaseData.js                          //\n   │  ├─ firebaseConfig.js                             //\n   │  ├─ goMain.js                                     //\n   │  ├─ header.js                                     //\n   │  ├─ footer.js                                     //\n   │  ├─ mainSlide.js                                  //\n   │  ├─ modal.js                                      //\n   │  ├─ nav.js                                        //\n   │  ├─ pager.js                                      //\n   │  └─ script.js                                     //\n   ├─ scss                                             //\n   │  ├─ _detailCredits.scss                           //\n   │  ├─ _detailImages.scss                            //\n   │  ├─ _footer.scss                                  //\n   │  ├─ _header.scss                                  //\n   │  ├─ _mainSlide.scss                               //\n   │  ├─ _reset.scss                                   //\n   │  ├─ _review.scss                                  //\n   │  ├─ _sort.scss                                    //\n   │  ├─ _variables.scss                               //\n   │  ├─ detail.scss                                   //\n   │  ├─ login.scss                                    //\n   │  ├─ main.scss                                     //\n   │  ├─ modal.scss                                    //\n   │  ├─ mypage.scss                                   //\n   │  └─ style.scss                                    //\n   ├─  assets                                          //\n   │  ├─ fontawesome.html                              //\n   │  └─ img                                           //\n   │     ├─ favicon.png                                //\n   │     ├─ next.png                                   //\n   │     └─ prev.png                                   //\n   ├─ .prettierrc                                      //\n   └─ .gitignore                                       //\n```\n\n  \u003cbr\u003e\n   \n## 반응형 사이트\n![스크린샷 2024-08-07 오후 5 41 27](https://github.com/user-attachments/assets/e19a6253-3b88-4ce0-b105-3861b87ecad4)\n\n## 세부 페이지\n\n![스크린샷 2024-08-07 오후 5 41 31](https://github.com/user-attachments/assets/afd8bcd1-ff8e-499a-9733-20d0887f22a1)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyuna-c%2Fvanilateam","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyuna-c%2Fvanilateam","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyuna-c%2Fvanilateam/lists"}